Generate SaaS Design System
briefkit_generate_design_systemGenerate a complete design system specification for a SaaS product: colors, typography, spacing, components, dark mode, and constraints. Ready for build tools.
Instructions
Generate a complete DESIGN.md specification for a SaaS product — colors, typography, spacing, components, dark mode, and constraints. Ready to paste into Lovable, Claude Code, or Cursor.
Args:
product_name (string): Name of the SaaS product
palette (string): Color palette — one of: trust-blue, forest-green, warm-gold, cool-purple, slate-minimal, coral-energy
fonts (string): Font pairing — one of: geometric, serif-modern, clean-sans, editorial, rounded
border_radius (number): Border radius in px (0-20, default 8)
density (string): Layout density — compact, balanced, or spacious
Returns: Complete DESIGN.md in markdown format with CSS custom properties, type scale, spacing, component specs, and dark mode mapping.
Examples:
"Generate a design system for my CRM called PipeFlow with trust blue colors" -> palette="trust-blue", fonts="geometric", density="balanced"
"Create a bold design for my dev tool API dashboard" -> palette="cool-purple", fonts="clean-sans", density="compact"
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| product_name | Yes | Name of the SaaS product | |
| palette | No | Color palette | trust-blue |
| fonts | No | Font pairing | geometric |
| border_radius | No | Border radius in pixels | |
| density | No | Layout density | balanced |