> From [PageWeave Design](https://pageweave-design.pageweave.site) — a working library for agentic web development. Full index: [llms.txt](https://pageweave-design.pageweave.site/llms.txt)

# Confetti Pop

Playful light — multi-hue candy palette, pill fields

- Category: Themes
- Swatches: #fff6ec #241a3d #ff6b6b #4ecdc4 #ffd93d
- Tags: light playful colorful rounded fun

## About this theme

A sticker-shop light theme: warm off-white ground, grape ink, watermelon/teal/sun accents. Pill-shaped fields, chunky 2px borders, cartoon depth via `--depth: 1`.

## Apply it

Paste into `update_theme`. Fonts:

```html
<link href="https://fonts.googleapis.com/css2?family=Baloo+2:wght@600;700;800&family=Nunito:wght@400;500;700&display=swap" rel="stylesheet">
```

## Where it works

Creative tools, kids' products, food, community apps. Pair with spring easings (`cubic-bezier(.34,1.56,.64,1)`) on hover states and hard offset shadows (`0 6px 0`) for the sticker look.

## Tuning

- Candy-store variant: base-100 → oklch(0.96 0.03 330) for a pink wash.
- Calmer: drop accent chroma to 0.12 and let primary carry alone.

## Theme CSS — paste into update_theme

```css
color-scheme: light;
--color-base-100: oklch(0.97 0.02 85);
--color-base-200: oklch(0.93 0.04 85);
--color-base-300: oklch(0.88 0.05 85);
--color-base-content: oklch(0.25 0.06 300);
--color-primary: oklch(0.62 0.22 25);
--color-primary-content: oklch(0.98 0.01 85);
--color-secondary: oklch(0.72 0.14 195);
--color-secondary-content: oklch(0.2 0.05 195);
--color-accent: oklch(0.85 0.17 95);
--color-accent-content: oklch(0.25 0.06 95);
--color-neutral: oklch(0.35 0.05 300);
--color-neutral-content: oklch(0.97 0.02 85);
--color-info: oklch(0.65 0.12 240);
--color-info-content: oklch(0.98 0.01 85);
--color-success: oklch(0.68 0.15 150);
--color-success-content: oklch(0.18 0.04 150);
--color-warning: oklch(0.85 0.17 95);
--color-warning-content: oklch(0.25 0.06 95);
--color-error: oklch(0.62 0.22 25);
--color-error-content: oklch(0.98 0.01 85);
--radius-selector: 1rem;
--radius-field: 999rem;
--radius-box: 1rem;
--size-selector: 0.25rem;
--size-field: 0.25rem;
--border: 2px;
--depth: 1;
--noise: 0;
```