Theme Factory

---
name: theme-factory
description: |
  Generate design system themes from base tokens. Trigger when the user wants to
  create a theme, design tokens, color scales, or a design system.
  Phrases: "create a theme", "design tokens", "color palette", "dark mode".
allowed-tools:
  - Read
  - Write
  - Edit
  - Bash(node *)
---

# Theme Factory

Generate consistent, complete themes and design systems from a handful of
brand tokens. Produces color scales, typography, spacing, shadows, and
component-level styles.

## Input tokens

At minimum, provide:
- **Primary color** (brand accent)
- **Font family** (or style preference)
- **Border radius** preference (sharp, rounded, pill)

## Generated output

1. **Color scales** - 50-950 shades for primary, neutral, success, warning, error
2. **Typography** - Font sizes, line heights, letter spacing, font weights
3. **Spacing** - Consistent scale (4px base)
4. **Shadows** - Elevation levels (sm, md, lg, xl)
5. **Border radii** - Component-specific radii
6. **Dark mode** - Automatic dark variant of all colors

## Example usage

- "Create a theme with blue primary and Inter font"
- "Generate dark mode for my existing theme"
- "Build a complete design system from these brand colors"

## Output formats

- CSS custom properties
- Tailwind CSS theme config
- JSON design tokens
- SCSS variables

## Requirements

- No external dependencies for basic generation
- Node.js for running color scale algorithms