Theme Preview

Switch themes to see how shared components adapt to each game's visual identity.

data-theme="default"

Active Theme: Default (Games List)

All components below inherit tokens from this theme scope.

Color Tokens

background
foreground
card
primary
secondary
muted
accent
destructive
success
warning
border
ring
chart-1
chart-2
chart-3
chart-4
chart-5

Font Families

Sans (default)

The quick brown fox

Aa Bb Cc 0123456789

Serif

The quick brown fox

Aa Bb Cc 0123456789

Mono (scores, timers)

The quick brown fox

Aa Bb Cc 0123456789

Level Cards

Feedback States

Correct Answer

A protractor measures angles

+150
Incorrect Answer

A caliper measures thickness, not angles

-50
Streak Bonus

5x combo multiplier active

1.5x
24
Correct
3
Incorrect
2
Missed
Accuracy Bonus+320
Completion Bonus+200
Perfect Bonus+500

Buttons

Badges

DefaultSecondaryOutlineDestructive

Progress

x
x
x

Shadows

2xs
xs
sm
shadow
md
lg
xl
2xl

Surfaces

Card

bg-card

Muted

bg-muted

Secondary

bg-secondary