--- title: Themes description: daisyUI 5 theming system — built-in themes and custom CSS themes. section: Platform order: 2 --- # Themes Every website has a theme applied via `data-theme` attribute on ``. ## Built-in Themes PageWeave supports 35+ daisyUI 5 built-in themes: - `light`, `dark`, `cupcake`, `bumblebee`, `emerald`, `corporate` - `synthwave`, `retro`, `cyberpunk`, `valentine`, `halloween` - `garden`, `forest`, `aqua`, `lofi`, `pastel`, `fantasy` - `wireframe`, `black`, `luxury`, `dracula`, `cmyk` - `autumn`, `business`, `acid`, `lemonade`, `night` - `coffee`, `winter`, `dim`, `nord`, `sunset` ## Setting a Theme Via MCP: ``` get_theme, update_theme(website: "my-site", config: { name: "nord" }) ``` ## Custom Themes Create a custom theme with OKLCH colors: ``` get_theme, update_theme(website: "my-site", config: { css: '[data-theme="my-brand"] { --color-primary: oklch(0.45 0.2 270); --color-primary-content: oklch(0.98 0.01 270); --color-base-100: oklch(0.98 0.005 270); ... }' }) ``` ### Required CSS Variables Custom themes must define at minimum: - `--color-primary` / `--color-primary-content` - `--color-base-100` / `--color-base-content` - `--color-neutral` / `--color-neutral-content` ### Design System Colors PageWeave's own design system uses: | Token | Light | Dark | |-------|-------|------| | base-100 | Warm parchment | Near-black indigo | | primary | Indigo #4F46E5 | Lighter indigo | | accent | Violet #9C3AED | Violet glow | | success | Muted sage | Muted sage | | warning | Warm amber | Warm amber | | error | Warm rust | Warm rust | All colors use OKLCH for perceptual uniformity. ## Theme Versioning Theme changes create versions. On published sites, theme changes go through the review gate.