Theme Debugger

A visual guide to the application's design system.

Color Palette
Primary colors used throughout the application.

Primary

#16a34a

bg-green-600

Primary-Accent

#059669

bg-emerald-600

Text-Header

#0f172a

bg-slate-900

Text-Body

#475569

bg-slate-600

Text-Subtle

#94a3b8

bg-slate-400

Destructive

#dc2626

bg-red-600

Warning

#f59e0b

bg-amber-500

Info

#2563eb

bg-blue-600

Gradients

Page Background (Light)

bg-gradient-to-br from-slate-50 to-green-50

Page Background (Dark)

bg-gradient-to-br from-gray-900 to-green-900

Primary Button

bg-gradient-to-r from-green-600 to-emerald-600

Component Preview
How core components should appear with the current theme.

Buttons

Badges

Growth
Recovery
Fat Loss
Cognitive

Form Elements