forever components

Post-Impressionist Night Studies

Brushstroke Frame

58 cobalt, teal and ochre brushstrokes ring the canvas edge, each wiggling; the whole frame slow-rotates while a cadmium glow breathes at center.

cssmedium 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

Decorative border for hero sections, art/museum themes, or dark-background tiles needing post-impressionist, post-impressionist ambient texture.

When not to

Layouts needing a clear unobstructed border or full-bleed content — strokes occupy all four edges.

Working with an AI agent

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

Change stroke count to 72 by setting N=72, swap '#1c3f7c' to '#6b21a8' for purple, and slow rotation by changing 0.18 to 0.08.

Safe to edit

  • stroke count (N=58)
  • color palette (cols array)
  • frame rotation speed (0.18 multiplier)
  • glow breathe duration (3.6s)
  • stroke size range (w: 14+16, h: 5+4)

Keep intact

  • IIFE wrapper
  • prefers-reduced-motion guard (REDUCED)
  • visibilitychange pause/stop logic
  • role=img + aria-label on stage div

Known limitations

  • Background hardcoded to #0a1628 — must edit CSS to use on a light background
  • Stroke positions randomized at parse time; each reload gives a slightly different layout

brushstrokeframeborderloopambientgenerative

More Post-Impressionist Night Studies components

  • Starry FlowUp to 420 cream and cobalt particle trails stream through curl-noise flow fields past glowing stars and a crescent moon, evoking a turbulent night sky.
  • Impasto StrokesThick elliptical brushstrokes accumulate along a Perlin noise flow field in cobalt, cadmium, and ochre; after ~1100 strokes the canvas fades and repaints.
  • Cypress FlameA dark green cypress silhouette writhes and twists upward like a flame against a cobalt evening sky, rendered in canvas with painterly swaying strokes.
  • Sunflower RadialTwo rings of ochre and cadmium petals rotate slowly around a phyllotactic seed-head spiral; a CSS-animated DOM core pulses at center.
  • Wheatfield WindGolden wheat stalks bend in a roving autonomous breeze via spring physics; crows scatter and arc overhead on a cobalt-to-amber gradient sky.
  • Stir the SkyCobalt, cream, and navy particles follow a noise flow field stirred by a drifting vortex, accumulating into swirling, post-impressionist brushstroke trails.