forever components

Ukiyo-e Woodblock

Blossom Fall

110 sakura petals drift and flutter down over an indigo-to-coral bokashi sky with a stylised woodblock mountain and bare branch silhouette.

canvasmedium complexitymoderate motion

Open on the canvas to copy the code → Free account · 3 copies a day · membership goes unlimited

Live demo — the real component, running in a sandbox. One self-contained HTML file, zero dependencies. Open it on the canvas →
Worth keeping? Votes steer what gets built next — sign in to cast one, free to read

When to use it

Spring or nature-themed hero backgrounds, Japanese aesthetic UIs, ambient screensaver-style displays.

When not to

Light-mode UIs (sky hardcoded dark indigo). Layouts needing legible text overlay — petals compete with reading.

Working with an AI agent

Every component ships agent-ready metadata. An example instruction for this one:

Change petal count to 60 by setting N=60, shift the palette to warm gold by setting PETAL_A="#f5e0a0", PETAL_B="#e8c96d", PETAL_C="#faf0c0", and slow fall speed by changing the rnd range in psp to (0.10, 0.30). Theme: dark tokens live in :root, the light variant in :root[data-theme="light"]; ?theme=light or a {type:'forever:theme'} postMessage switches at runtime.

Safe to edit

  • petal count (N=110)
  • fall speed range (psp rnd 0.18..0.55)
  • petal color palette (PETAL_A/B/C)
  • sky gradient stops (SKY_TOP/MID/LOW/HORIZON)
  • mountain position and size (bx, peakY, halfW)
  • drift amplitude multiplier (*6 in drawPetals)
  • theme tokens (:root dark defaults + [data-theme=light] overrides)

Keep intact

  • DPR-aware canvas sizing and setTransform
  • visibilitychange stop/start guard
  • reduced-motion static single-frame fallback
  • IIFE wrapper
  • theme hook (?theme= bootstrap + forever:theme message listener + theme tokens)

Known limitations

  • Sky and background color hardcoded — must edit CSS and gradient stops to change scheme
  • No pointer interactivity — petals ignore cursor
  • Redraws full scene every frame including static mountain and sky (no dirty-rect optimisation)

cherry-blossomparticlescanvasjapaneseukiyo-eambientnature

More Ukiyo-e Woodblock components

  • Wave CrestA stylized ukiyo-e-inspired cresting wave with curling foam claws, an indigo sea gradient, Fuji-like cone, and coral sun — all drawn procedurally on canvas.
  • Rain Lines96 diagonal rain streaks fall over layered indigo/coral hill bands and a village silhouette beneath a bokashi cream sky with a pale moon disc.
  • Crane Glide7 cranes with flapping wings glide across flat indigo/teal bands past a coral sun and Mt. Fuji silhouette, with scrolling wave crests.
  • Mountain ConeSnow-capped Fuji cone under a bokashi sky cycling night-dawn-day-dusk every 24s; sun/moon disc arcs overhead while 7 cranes drift across.
  • Koi RippleA kohaku koi undulates across a dark pond as four concentric ripple rings expand and coral petals drift, all rendered in woodblock palette.
  • Bamboo SwayNine indigo bamboo stalks sway with sine-wave lean and leaf flicker against a cream bokashi sky and low coral moon, rendered in flat woodblock style.