ss-setup

# Design System Setup Wizard ## When NOT to use - For projects already configured with StyleSeed → use `/ss-update` instead - 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 (#DC2626) — bold, urgent 6. Dark (#18181B) — minimal, premium 7. Custom — just type your hex code ``` After they choose, update `css/theme.css`: - In `:root` block: change `--brand` to the chosen hex - In `.dark` block: change `--brand` to a light...