Themes

Sunflower Theme for Nuxt UI

Bright yellow for cheerful, optimistic designs. Deeper shades ensure readability.
Copy the code

Light and dark mode

Light mode preview
primary
yellow-600
secondary
amber-600
success
emerald-600
info
sky-600
warning
orange-600
error
red-600
Dark mode preview
primary
yellow-400
secondary
amber-400
success
emerald-400
info
sky-400
warning
orange-400
error
red-400
Font
Lexend
Radius
0.5rem
Neutral
zinc
Collection
Warm

Use the Sunflower theme in your project

Paste the palette assignments into app.config.ts, then add the CSS to your main stylesheet. The CSS carries everything app config can't express: the font, radius, shade shifts, and the separate dark-mode tokens. See How to Export and Share Nuxt UI Themes for the details.

app.config.ts22 lines
Highlighting code…
main.css148 lines
Highlighting code…

Related guides