Back

ThemeSelector

A row of color swatches that switch the active brand color palette. Powered by $store.theme.setColorTheme() — changes persist to localStorage under color-theme.

Color Themes

Click a swatch to switch the accent palette across the entire page.

Active theme:

Sizes

sm
md
lg

Usage

// Drop in anywhere — typically in a Navbar or Settings panel
@actions.ThemeSelector(actions.ThemeSelectorProps{
    Size: "md", // "sm" | "md" (default) | "lg"
})

// Themes: amber (default), blue, green, purple, rose
// Selected theme persisted in localStorage under "color-theme"
// Alpine store: $store.theme.colorTheme, .setColorTheme(name), .cycleColorTheme()