Cotton Candy Planner
A luxury event and wedding planner in cotton candy dreamcore style. Spun-sugar translucent surfaces via backdrop-filter blur(25px), rotating candy palette (pink/lavender/mint/peach) per section, iridescent gradient borders with hover shimmer, confetti dot texture, floating helium animations, and patisserie-styled data displays. Fraunces bubbly serif + Quicksand rounded sans + Victor Mono for elegant numbers. No photography — pure CSS translucency and OKLCH color.
Apply this design skill
Read the SKILL.md at https://joincommons.cc/api/items/cotton-candy-planner and apply its design language to my project
Designed by humans. Applied by agents.
Design Language
All colors use OKLCH for perceptual uniformity. No hex, no HSL. ### Base & Text | Token | Value | Material Name | Usage | |-------|-------|---------------|-------| | `--cream` | `oklch(0.97 0.01 90)` | Cream Puff | Page background — warm near-white, never pure white | | `--rose-text` | `oklch(0.35 0.04 350)` | Dark Rose | Primary text — warm dark, never pure black | | `--rose-light` | `oklch(0.55 0.06 350)` | Muted Rose | Secondary text, metadata, captions | ### Candy Palette (Rotating) | Token | Value | Material Name | Dominant In | |-------|-------|---------------|-------------| | `--pink` | `oklch(0.88 0.08 350)` | Cotton Candy Pink | Hero section | | `--lavender` | `oklch(0.90 0.06 290)` | Lavender Cream | Guest list section | | `--mint` | `oklch(0.91 0.07 170)` | Mint Sorbet | Budget section | | `--peach` | `oklch(0.92 0.06 70)` | Peach Meringue | Vendor section | ### Bright Accents (for text-on-light) | Token | Value | Usage | |-------|-------|-------| | `--pink-bright` | `oklch(0.72 0.12 350)` | Section labels, stat values, CTA highlights | | `--lavender-bright` | `oklch(0.72 0.10 290)` | Guest count badges, timeline dots | | `--mint-bright` | `oklch(0.74 0.10 170)` | Budget amounts, confirmed status | | `--peach-bright` | `oklch(0.78 0.10 70)` | Vendor category labels, pending status | ### Glow Shadows | Token | Value | Usage | |-------|-------|-------| | `--pink-glow` | `oklch(0.88 0.08 350 / 0.25)` | box-shadow for pink-section cards | | `--lavender-glow` | `oklch(0.90 0.06 290 / 0.25)` | box-shadow for lavender-section cards | | `--mint-glow` | `oklch(0.91 0.07 170 / 0.25)` | box-shadow for mint-section cards | | `--peach-glow` | `oklch(0.92 0.06 70 / 0.25)` | box-shadow for peach-section cards | ---
Agent instructions (SKILL.md)(advanced)
Design Skill
Provides a complete design system for building luxury event and wedding planning interfaces in cotton candy dreamcore style. Every surface looks like spun sugar — translucent, layered, impossibly light. The confectionery aesthetic is built from OKLCH color, backdrop-filter blur translucency, and a rotating candy palette that shifts dominant hue per section. Use this file as the apply-time router. Load `references/design-language.md` for the full visual system, `tokens.dtcg.json` for implementation values, and inspect `exhibit.html` for the proof surface.
