∞ forever components

Gold-Leaf Ornamental Studies

The Pattern Loom

Three gold friezes of gold-leaf symbols (circles, spirals, triangles, eyes) scroll in alternating directions at staggered speeds, endlessly re-weaving.

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

Dark decorative hero backgrounds, art nouveau or luxury brand themes, ambient looping screensavers.

When not to

Light backgrounds (hardcoded dark background). Contexts needing legible text overlays or minimal visual noise.

Working with an AI agent

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

Add a fourth frieze row by changing `const rows=3` to `rows=4`, and shift to rose-gold by changing GOLD to '#c87941' and GOLD_HI to '#e6a066'. 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

  • row count (rows=3)
  • unit cell width (unitW=46)
  • scroll speed formula (10+ri*6)
  • symbol palette (KINDS array)
  • gold color constants (GOLD, GOLD2, GOLD_HI, MALA)
  • theme tokens (:root dark defaults + [data-theme=light] overrides)

Keep intact

  • IIFE wrapper
  • prefers-reduced-motion guard
  • visibilitychange pause/resume
  • DPR-aware fitCanvas
  • theme hook (?theme= bootstrap + forever:theme message listener + theme tokens)

Known limitations

  • Background color hardcoded in CSS (#0a0805) — must edit both CSS and canvas fill to change
  • Symbol kind cycling uses time-based index, so pattern is not strictly periodic

ornamentalfriezecanvasscrollpatterngold

More Gold-Leaf Ornamental Studies components

  • The Golden TreeRecursive gold fractal tree grows and breathes via a pulsing sine wave, with spiral coil tips and drifting gold flecks against a near-black background.
  • Mosaic ShimmerA 14x10 grid of gold tesserae pulses in diagonal sine-wave shimmer; sparse jewel-toned accents pop against the gold, evoking Byzantine mosaic.
  • Spiral Ornament EngineGold spirals, all-seeing eyes, and gilded triangles fade in and out against a near-black background, slowly rotating as they drift through their lifespan.
  • Gilded HaloConcentric gold rings bloom and fade from click/pointer points while gold-leaf flecks scatter with gravity; auto-strikes keep it alive passively.
  • Falling GoldDiamond-shaped gold flakes drift and sway downward against a near-black background, each shimmering in opacity as they tumble and rotate.
  • Byzantine CounterpointTwo SVG columns of spirals, eyes, and triangles in gold and malachite cycle motifs and counter-rotate every 900ms in phase-shifted counterpoint.