Skip to main content
The Colors tab exposes ten preset strips and separate semantic palettes for light and dark mode. A preset fills both palettes together; it is not stored until you select Save Changes.

Included presets

Lucent Default, Ocean Breeze, Forest Mint, Sunset, Midnight, Rose, Cyberpunk, Solarized, Monochrome, and Cherry Blossom are included as starting points. You can edit any color after applying a preset.

Semantic roles

Each role has a corresponding dark-mode value. Theme components consume these roles rather than fixed brand colors, which lets supported extension pages follow the same palette.

Current Lucent defaults

Accessibility checklist

1

Check normal text

Keep paragraph and form text at a contrast ratio of at least 4.5:1 against its surface.
2

Check interactive states

Test primary buttons, muted labels, selected tabs, disabled controls, and focus rings.
3

Check both modes

A readable light palette does not guarantee a readable dark palette. Test them separately.
4

Check optional wallpaper

Re-test contrast after adding a background image or increasing glass transparency.
Avoid making base and background similar. Also avoid using a very bright dark-mode neutral color: it turns every border into a competing highlight.
Last modified on September 9, 2026