∞ forever components

Art Deco

Stepped Portal

7 nested stepped ziggurat arches recede into golden depth with a slow per-layer parallax pulse; a sunburst crown gently rotates and breathes above.

svgmedium complexitysubtle 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 hero backgrounds, luxury brand headers, decorative loaders with an Art Deco or architectural theme.

When not to

Light backgrounds (hardcoded dark palette). Contexts needing legible text overlays — the central arch throat occupies focal center.

Working with an AI agent

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

Change LAYERS to 9, set the gold gradient stop colors to copper tones (#c8884a, #a05c2a), and slow the pulse cycle by changing s*0.8 to s*0.4. 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

  • layer count (LAYERS=7)
  • half-width range (hw: 160→42)
  • sunburst ray count (RN=24)
  • animation speed (s*0.35 sun rotate, s*0.8 arch pulse)
  • gold gradient stop colors
  • per-layer amplitude (amp array: 0.006+0.010)
  • theme tokens (:root dark defaults + [data-theme=light] overrides)

Keep intact

  • IIFE wrapper
  • prefers-reduced-motion guard + static frameStatic() fallback
  • visibilitychange pause/resume logic
  • allocation-free Float32Array amp/pha precompute
  • theme hook (?theme= bootstrap + forever:theme message listener + theme tokens)

Known limitations

  • Light re-theme via the [data-theme=light] token block; catalog bg/accent describe the dark default
  • Fountain arc paths are static decorations, not animated

art-decozigguratportalsunburstsvgparallaxgeometric

More Art Deco components

  • Sunburst Fan13 tapered gold rays open and close in mirrored symmetry from a glowing core medallion above a ziggurat plinth, breathing with a 7-second CSS cycle.
  • Ziggurat RiseThree stepped gold ziggurat skyscrapers rise and settle with a damped bob against a radial sunburst on deep black — staggered entrance, then looping.
  • Fountain ArcsSymmetrical golden arcs well up from a central jet with a chevron crown, fanning outward in a breathing 7.2s cycle over a near-black field.
  • Chevron MarchInterlocking gold and ink chevron bands march in alternating directions across a black canvas; a convoy of gold diamonds glides down a central seam.
  • Fan BloomA 16-rib peacock fan blooms open and closed from a sunburst medallion over a gold ziggurat base; each rib has barbs and an emerald eye-spot.
  • Gatsby FrameGold SVG frame self-draws in fourfold symmetry — ziggurat corners, sunburst fans, chevrons, and a fountain medallion bloom then fade and redraw in a 4.2s…