Themes

Cherry Theme for Nuxt UI

Bold red tones for high-energy, attention-grabbing interfaces.
Copy the code

Light and dark mode

Light mode preview
primary
red-500
secondary
orange-500
success
emerald-500
info
sky-500
warning
amber-500
error
rose-500
Dark mode preview
primary
red-400
secondary
orange-400
success
emerald-400
info
sky-400
warning
amber-400
error
rose-400
Font
Poppins
Radius
0.375rem
Neutral
zinc
Collection
Warm

Use the Cherry 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.ts16 lines
Highlighting code…
main.css80 lines
Highlighting code…

Related guides