Style Guide Generator

Customize your design system and export React components

Color Palette

Customize your brand colors. Changes will be reflected in real-time.

Primary

Secondary

Accent

Background

Foreground

Muted

Muted foreground

Border

Preview & Export

Component Preview

Buttons

Input

Typography

Heading 1

Heading 2

Heading 3

This is a paragraph with regular text.