RecipesRecipe
CLI-Driven Theme Generation
Use the Themvora CLI to generate complete theme families from seed colors in your build pipeline.
- Goal
- Use the Themvora CLI to generate complete theme families from seed colors in your build pipeline.
- Prerequisites
- @themvora/cli installed
- Seed color definition
- Stack
- Node.js (CI/CD)
- Result
- Generated theme files in your project
1Install
One package — the CLI. Pick your package manager and run it from your project root.
Install command
Needs
@themvora/clipnpm add @themvora/cliPrefer not to install it? Run it without installing with npx --yes @themvora/cli generate …. See the CLI installation guide for global and project-local setups.
2Implement
Drop this into your project. It is the whole pattern — no other setup is required.
themvora generate \
--seed "#6366f1" \
--output ./src/themes/brand.json \
--format json3Why this works
The generate command creates light/dark theme pairs from a seed color. Output can be JSON, TypeScript, or raw CSS variables. Use in CI to generate consistent themes during build.
4Verify
- The page loads with no console errors after the change.
- The outcome holds: generated theme files in your project
- Toggling the theme in your app still works, and the state survives a reload if persistence is configured.
- Reduced-motion users see no animation if you enabled transitions.
Common failure
The most frequent cause is a prerequisite that is only half met — an adapter installed without the framework it wraps, or a provider mounted above the component that reads the theme. Re-read the prerequisites above, then confirm the provider wraps the tree that uses the value.