How do I install the Sb Explore skill?

Run npx skillmds@latest add strongeron/sb-explore in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Sb Explore safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Sb Explore?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Sb Explore free to use?

Yes. Installing skills from SkillMD is free. This skill is licensed under MIT.

Who published Sb Explore?

strongeron (@strongeron) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Sb Explore by strongeron — Agent Skill

Name: Sb Explore
Author: strongeron

Sb Explore

Iterate on a new or redesigned component in a sandboxed Explore story outside src/components/ (+ Figma), checked against a graduation gate. Use for 'prototype this', 'try a v2', 'explore from Figma', or net-new UI not ready to ship.

strongeron 889ab15 5 files · 47.3 KB Updated Sep 17, 2026

File contents

sb-explore — sandboxed iteration (Build mode: Explore)

The component is new or being redesigned. It lives outside src/components/ so production code can't depend on it. Load references/labs-workflow.md before scaffolding. If the user pasted a Figma URL, ALSO load references/figma-to-storybook.md. Do NOT load composition-patterns.md (that's Compare → sb-wrappers).

Naming: Explore is the canonical term used throughout this skill (titles, disk paths, tags). references/labs-workflow.md predates the rename and says Labs / src/stories/labs/ — read it as the same track (Explore = Labs). Author with Explore; treat Labs only as a legacy alias you may meet in an existing repo.

Before scaffolding (ask yourself)

Iterating on a shipping component, or net-new? Determines Path A vs Path B at Ship time.
Figma URL pasted? If yes — set parameters.design = { type: 'figma', url } immediately and iterate against the frame (see figma-to-storybook.md).
API stable enough to graduate? See the 4 criteria in labs-workflow.md. If not — stay in Explore.

Scaffold

Disk path — honor the recorded storiesLocation (.storybook/audit/status.md): when stories are isolated (the audit/client default), scaffold the experiment under .storybook/explore/<topic>/ — don't scatter into a src/ you don't own. Only use src/explore/<topic>/ when the user opted into co-located for a project they own. Vite excludes either from the production bundle.
Title — Explore/<topic>/<name> — last in storySort.order, bottom of sidebar.
Tags — ['explore', '!autodocs', '!test']. Optional: 'motion', 'figma-sync', 'v2-preview'.

Graduation gate (Explore → Component)

Four criteria in labs-workflow.md: stable API · ≥3 callsites planned · designer-reviewed · tokens not magic numbers. When all met → trigger sb-ship (it preserves the experiment, never git mv). Until then, keep iterating here.

Iterate; when the gate is met, hand off to sb-ship. Append progress to .storybook/audit/status.md so an interrupted session resumes cleanly (CONTEXT.md resume protocol).

---name: sb-exploredescription: Iterate on a new or redesigned component in a sandboxed Explore story outside src/components/ (+ Figma), checked against a graduation gate. Use for 'prototype this', 'try a v2', 'explore from Figma', or net-new UI not ready to ship.license: MIT---# sb-explore — sandboxed iteration (Build mode: Explore)The component is new or being redesigned. It lives **outside `src/components/`** so productioncode can't depend on it. **Load `references/labs-workflow.md` before scaffolding.**If the user pasted a Figma URL, ALSO load `references/figma-to-storybook.md`. Do NOTload `composition-patterns.md` (that's Compare → `sb-wrappers`).> **Naming:** **`Explore`** is the canonical term used throughout this skill (titles, disk paths, tags).> `references/labs-workflow.md` predates the rename and says **`Labs`** / `src/stories/labs/` — read it as> the same track (Explore = Labs). Author with `Explore`; treat `Labs` only as a legacy alias you may meet> in an existing repo.## Before scaffolding (ask yourself)- **Iterating on a shipping component, or net-new?** Determines Path A vs Path B at Ship time.- **Figma URL pasted?** If yes — set `parameters.design = { type: 'figma', url }` immediately and iterate against the frame (see figma-to-storybook.md).- **API stable enough to graduate?** See the 4 criteria in labs-workflow.md. If not — stay in Explore.## Scaffold- **Disk path** — honor the recorded `storiesLocation` (`.storybook/audit/status.md`): when stories are **isolated** (the audit/client default), scaffold the experiment under `.storybook/explore/<topic>/` — don't scatter into a `src/` you don't own. Only use `src/explore/<topic>/` when the user opted into **co-located** for a project they own. Vite excludes either from the production bundle.- **Title** — `Explore/<topic>/<name>` — last in `storySort.order`, bottom of sidebar.- **Tags** — `['explore', '!autodocs', '!test']`. Optional: `'motion'`, `'figma-sync'`, `'v2-preview'`.## Graduation gate (Explore → Component)Four criteria in labs-workflow.md: stable API · ≥3 callsites planned · designer-reviewed ·tokens not magic numbers. When all met → trigger **`sb-ship`** (it preserves the experiment,never `git mv`). Until then, keep iterating here.## NextIterate; when the gate is met, hand off to `sb-ship`. Append progress to `.storybook/audit/status.md`so an interrupted session resumes cleanly (CONTEXT.md resume protocol).

Frequently asked questions