ui-setup
Interactive setup wizard — guides you step-by-step to configure the design system for your project
Design System Setup Wizard
When to Use
Use this skill when you need interactive setup wizard — guides you step-by-step to configure the design system for your project.
When NOT to use
- For projects already configured with StyleSeed → use
/ss-updateinstead - For just adding one component to an existing project → use
/ss-component - For changing brand skin in an already set-up project — directly swap
theme.css - For non-React or non-Tailwind-v4 stacks — currently unsupported
Guide the user through setting up StyleSeed for their project, step by step.
Instructions
Walk through these steps ONE AT A TIME. After each step, wait for the user to respond before proceeding. Keep it conversational and friendly.
Step 1: App Type
Ask:
What type of app are you building?
1. SaaS Dashboard (analytics, metrics, charts)
2. E-commerce (products, orders, payments)
3. Fintech (transactions, portfolio, market data)
4. Social / Content (feeds, profiles, messaging)
5. Productivity / Internal tool
6. Other — describe it
Remember the answer — it determines which page composition recipe to use (DESIGN-LANGUAGE.md Section 63).
Step 2: Brand Color
Ask:
What's your brand color?
1. Purple (#721FE5) — default style (toss skin)
2. Blue (#2563EB) — trust, corporate
3. Green (#059669) — growth, health, finance
4. Orange (#EA580C) — energy, creative
5. Red (#DSubscribers only
The full skill, its 1 bundled files and every download is included with every paid Complete AI plan.
Details
| Source | bitjaru/styleseed |
|---|---|
| License | MIT |
| Risk label | critical ("critical" means the skill may run commands or touch files — read before use) |
| Files | SKILL.md |
| Added | 2026-07-01 |
Related skills
accesslint-diff
Diff a live page's accessibility violations against a baseline — by default compares uncommitted changes (stash-based), or pass --branch [<name>] to diff against a branch. Reports only new violations introduced, violations fixed, and pre-existing count. Use `scan` for a full audit with no diffing.
accesslint-scan
Audit a live page for accessibility issues, locate each WCAG violation precisely, and return a selector-grounded fix worklist without editing.
accint-commitments
Triage acc's open promises and close them with honest real-world verdicts via acc_act(runtime="outcome").
accint-frames
Drain acc's deliberation queue — open/waiting brain_frames checkpointed by headless runs — via acc_act(runtime="continue").
accint-solve
Route a goal through acc's scored-memory loop via acc_act(runtime="solve"); deliberate any returned brain_frame and submit via continue.
ad-creative
Create, iterate, and scale paid ad creative for Google Ads, Meta, LinkedIn, TikTok, and similar platforms. Use when generating headlines, descriptions, primary text, or large sets of ad variations for testing and performance optimization.
