Theme Generator

Create custom color palettes for your FivUI components. Adjust colors and see real-time previews.

Color Customization

Editing dark theme colors

Base Colors

Background

Main background color

Foreground

Main text color

Primary

Primary brand color

Primary Foreground

Text on primary color

Card

Card background color

Card Foreground

Text on card background

Secondary Colors

Secondary

Secondary color

Secondary Foreground

Text on secondary color

Accent

Accent color for highlights

Accent Foreground

Text on accent color

Muted

Muted/subtle color

Muted Foreground

Text on muted color

Popover Colors

Popover

Popover background color

Popover Foreground

Text on popover background

Utility Colors

Destructive

Error/danger color

Destructive Foreground

Text on destructive color

Border

Border color

Input

Input field background

Ring

Focus ring color

Live Preview

See how your colors look with actual components

Card Title

This is a card component with some example content to showcase the theme colors.

Option 1

Option 2

Option 3