Kawaii Pack

Pastel pink/mint/lavender palette, pill shapes, bouncy motion, Cherry Bomb One display font, and sparkle particle effects.

Type	Full (theme + effects + components)
Theme CSS	`packs/kawaii.theme.css`
Effects CSS	`packs/kawaii.effects.css`
Effects JS	`packs/kawaii.effects.js`
Full bundle	`packs/kawaii.full.css` + `packs/kawaii.full.js`

Theme

Token overrides scoped to [data-theme~="kawaii"]:

Pastel pink primary, mint secondary, lavender accent
Full pill border radii (100px)
Cherry Bomb One display font
Bouncy easing curves
Soft shadow tokens

Effects

Opt-in effects via data-effect attribute:

data-effect="starburst" — animated pastel starburst gradient background
data-effect="sparkle" — CSS-only floating sparkle stars
data-effect="bounce" — spring-loaded bounce animation on hover
data-effect="wiggle" — playful rotation wobble (continuous or data-trigger="hover")
data-effect="particles" — JS-driven floating emoji particle effect

Loading

<link rel="stylesheet" href="/cdn/packs/kawaii.theme.css">  <link rel="stylesheet" href="/cdn/packs/kawaii.effects.css"> <script type="module" src="/cdn/packs/kawaii.effects.js"></script>

import { activateBundle } from '/cdn/vanilla-breeze.js' await activateBundle('kawaii')

Demo

View the Kawaii pack demo to see the theme, effects, and components in action.