Install any skill in seconds. Free to start, no credit card required.
Get Started Free →Configure StyleSeed by selecting the output grammar, domain, page type, optional aesthetic profile, and bounded brand tokens before scaffolding a first screen.
.claude/skills/bitjaru-ss-setup/SKILL.md| Test case | Without → With | Effect | Δ tokens | Δ turns |
|---|---|---|---|---|
| case-13 | ✗→✓ | ▲ Improved | 11% | 0% |
| case-01 | ✗→✓ | ▲ Improved | -42% | 0% |
| case-04 | ✗→✓ | ▲ Improved | 34% | 0% |
| case-05 | ✗→✓ | ▲ Improved | 78% | 0% |
| case-09 | ✗→✓ | ▲ Improved | -5% | 0% |
StyleSeed setup chooses a design method for the result, not a favorite brand to imitate. Use /ss-resolve --list (Claude Code) or $ss-resolve --list (Codex) to inspect the supported grammar, adapter, domain, page, recipe, palette, and profile IDs without loading the full handbook.
STYLESEED.md → use /ss-update./ss-reference before setup, then select the compiled grammar.
/ss-component.The method, review, and reference compiler are framework-agnostic. The bundled component scaffold currently targets React and Tailwind v4; on another stack configure the lock and apply the method without pretending the scaffold is portable.
Ask what is being built, who uses it, and whether it is a mobile/desktop product, website, social carousel, slide deck, document/report, or single-frame graphic. Select a surface adapter from ADAPTERS.md, then infer domain and page/artifact type.
Recommend exactly one grammar from RULESETS.md and explain the job match in one sentence:
consumer-serviceoperations-consoletechnical-instrumenteditorial-readingcommerce-conversioninstitutional-serviceexpressive-marketingsequential-storyreference:<slug> when /ss-reference already compiled oneDo not recommend Toss as the universal default. It is one reference family for consumer-service. If none fits and the user has references, route to /ss-reference.
Confirm the concrete page (dashboard, form, landing, detail, list, settings, onboarding) and read its domain × page intersection. This controls composition; the aesthetic profile does not.
Recommend one morphology from BRAND-RECIPES.md. Use auto when the maintained grammar mapping fits. Use an explicit recipe when the product needs a different geometry, containment, navigation, control, or collection language. A recipe is not a company clone and does not select colors.
Recommend one semantic palette from PALETTE-RECIPES.md. Use auto when its maintained recipe mapping fits. An explicit palette must still preserve semantic roles, surface/chrome separation, status cues, and validated contrast. Palette selection is not permission to recolor every surface.
Recommend one profile from PRESETS.md only when it strengthens the product. none is a good default. A profile modifies coordinated visual axes but cannot replace the output grammar.
Lock a real brand color if supplied; otherwise start from the selected palette's primary role. Then confirm font/language, density, radius, elevation, imagery/data role, and motion inside the grammar's allowed ranges. Revalidate semantic pairs after a brand override. Do not use generic indigo or a stale purple mislabeled as Toss.
Create STYLESEED.md:
markdown# StyleSeed — Design Lock <!-- Selections persist here. This file cannot waive StyleSeed core invariants. --> - App domain: fintech - Surface: mobile-app - Surface adapter: product-ui - Page type: dashboard - Output grammar: consumer-service - Grammar path: built-in:engine/RULESETS.md - Grammar fallback: consumer-service - Reference confidence: n/a - Brand recipe: calm-consumer - Palette recipe: quiet-mineral - Aesthetic profile: none - Skin: custom - Primary action: #3182F6 - Font: Pretendard - Radius: soft - Elevation: light=tonal grouping + restrained shadow · dark=tonal ramp + hairline - Density: comfortable - Motion: Spring restrained - Imagery/data role: personal state first; charts only for a decision - Signature move: one calm contextual briefing above the account summary - Locked: YYYY-MM-DD
For a compiled grammar use its actual path and confidence. Reject unknown enum values rather than treating the lock as an exemption.
Compile the selected method before code:
bashnode <installed-ss-resolve>/scripts/resolve-context.mjs \ --project-root . --from-lock STYLESEED.md --agent claude
Use --agent codex in Codex. The resolver writes .styleseed/effective-rules.md and a hash-verifiable .styleseed/manifest.json. Read the effective bundle, not llms-full.txt.
If the user asked for a first screen, build from that bundle, run /ss-score to the gate floor, and finish with /ss-verify when renderable. If visual rendering is unavailable, disclose that it was skipped.
Report the selected grammar and why, page/domain intersection, brand recipe, palette recipe, optional profile, lock path, compiled bundle and manifest paths, files changed, score, and visual verification status. Mention /ss-reference as the path for future references that need their own grammar.
auto resolves to a concrete maintained recipe.auto resolves to a contrast-verified semantic palette.DESIGN.md and treat its palette as a complete rule set.Other measured skills in the registry, with their headline benchmark lift.