New 6 themes · light + dark · Tailwind CSS v4

Party-ready themes for shadcn/ui.

Six playful color and type systems as drop-in CSS variables. Pick one, paste it into globals.css and every component you already use changes outfit: buttons, forms, tables, charts and dialogs.

Try the live switcher Get the themes, pay what you want

6
themes
31
variables each
10
free fonts

Clay-style color pebbles arranged in an arc next to a light and dark mode toggle

--primary

oklch(0.56 0.22 355)

Party mode

Theme

Live preview

One click, a whole new outfit.

These are ordinary shadcn-style components. Only the CSS variables change. The current theme is Confetti, in light mode.

Everything in this preview is sample data for an imaginary party planner app.

Guests confirmed

128

+12 since Monday

Response rate

86%

Playlist songs

342

Budget left

€410

of €1,200 planned

RSVPs per week

Guests and plus-ones over the last 8 weeks

GuestsPlus-ones

Menu choices

From 128 confirmed guests

128

plates

Garden pasta44%
Grilled fish26%
Vegan bowl18%
Kids' menu12%

Guest list

Search filters the rows. Badges use primary, secondary and destructive.

Guest	Status	Plus-one	Dietary
Maya R. maya@example.com	Going	Yes	Vegetarian
Theo K. theo@example.com	Maybe	No	None
Ines B. ines@example.com	Going	Yes	Vegan
Kofi A. kofi@example.com	Pending	No	None
Lena S. lena@example.com	Going	No	Gluten-free
Arjun P. arjun@example.com	Not going	No	None
Noor H. noor@example.com	Going	Yes	None

7 of 128 guests

Buttons and badges

DefaultSecondaryAccentOutline

Decorations ready64%

Heads up. The cake order closes Friday at 6 pm.

October 2026

3 events

MoTuWeThFrSaSu

Notifications

New RSVPs
Instantly
Song requests
Daily digest

Do themes change component code?

No. Themes only set CSS variables, so the components you already added keep working as they are.

Is dark mode included?

Yes, every theme ships a light :root block and a matching .dark block.

The six themes

Every one with its own color, radius and type.

Each card below is rendered with its own theme variables, side by side. Toggle dark mode in the header to compare both sides.

Confetti

Pink and violet with a sunny pop. Loud in the best way.

r 1rem

Bricolage Grotesque + Inter

Lagoon

Cool teal and sea glass. Calm, clean, easy on long dashboards.

r 0.75rem

Plus Jakarta Sans + Plus Jakarta Sans

Sherbet

Orange, peach and lemon. Rounded, friendly and very summer.

r 1.25rem

Fredoka + DM Sans

Disco Night

Electric indigo with a lime highlight. Built for dark mode.

r 0.5rem

Space Grotesk + Space Grotesk

Marmalade

Burnt orange, ochre and olive on warm paper. Editorial and cosy.

r 0.375rem

Fraunces + Figtree

Matcha

Soft green with a blush accent. Quiet, airy and a little fancy.

r 0.625rem

Instrument Serif + Geist

Tokens

31 variables in OKLCH, with hex values in tokens.json.

The same names shadcn/ui uses: background, primary, muted, border, ring, chart-1 to chart-5 and the sidebar set. Confetti is shown here in light mode.

Install in three steps

Paste, load the fonts, done.

1
Start from a shadcn/ui project
Any Tailwind CSS v4 project set up with the shadcn CLI. You already have a globals.css with :root, .dark and @theme inline.
```
npx shadcn@latest init
```
2
Swap in a theme
Replace your :root and .dark blocks with one file from themes/, then merge the font and radius lines from party-themes-base.css into @theme inline.
3
Load the two fonts
Import fonts/fonts.css (self-hosted woff2 files are included), or load the same families from Google Fonts or Fontsource. Want users to switch themes? Use all-themes.css and set data-theme on the html element.

What's inside the download

6 theme files (confetti, lagoon, sherbet, disco-night, marmalade, matcha), each with light and dark
all-themes.css for runtime switching with data-theme
party-themes-base.css with the Tailwind v4 @theme inline mapping
tokens.json with every value in OKLCH and hex
10 font families as woff2 plus fonts.css and their SIL Open Font License files
This demo page as a Tailwind reference, plus a README with install steps

Get Party Themes

Pay what you want, from €0.

Party Themes is an independent theme pack made by Templates.party. It is not affiliated with, sponsored or endorsed by shadcn/ui or its maintainers. "shadcn/ui" is used only to describe compatibility.