∞ forever components

Retro & Glitch

JPEG Quantize Crush

Synthetic image oscillates through JPEG-like artifacts: blocky 8x8 DCT cells, color banding, and ringing pulse in waves. Pointer/click boost quality.

canvasheavy complexityintense motionpointer

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

Retro or glitch-art hero backgrounds, tech/compression-themed visuals where lo-fi digital decay is the aesthetic.

When not to

Contexts requiring legible content overlays — constant block-smear and ringing compete heavily with text.

Working with an AI agent

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

Change ACC to [64, 255, 128] for a green accent, slow the oscillator by setting phase step from 0.012 to 0.006, and raise max quant levels from 30 to 60 for deeper crush.

Safe to edit

  • accent color (ACC array)
  • oscillator speed (t*0.012)
  • max quantization levels (30 in levels formula)
  • ringing intensity (0.22 multiplier)
  • background color (BG array and CSS #14060c)

Keep intact

  • low-res offscreen canvas (GRID) — critical for block-aligned rendering
  • IIFE wrapper
  • visibilitychange pause/resume
  • prefers-reduced-motion static fallback

Known limitations

  • Per-block pixel loop over GRID*GRID Float32Array is CPU-bound — heavy on low-end devices
  • Reduced-motion shows only a single static frame at t=120, no graceful fallback animation
  • Grid overlay skips every 4 blocks so fine-grid detail is not rendered

glitchjpegcompressiondctcanvasretrobanding

More Retro & Glitch components

  • CRT scanline screenGreen-phosphor CRT terminal: rolling CSS scanlines, vignette, glowing oscilloscope wave, blinking boot-text rows, and random canvas glitch flashes.
  • VHS tracking distortionVHS test-pattern color bars with 46-slice horizontal jitter, random tear events, a rolling tracking bar, and chroma-split REC text on a dark vermillion…
  • Pixel-art sprite marchThree rows of 8x8 two-frame pixel sprites march across a scrolling starfield at varying speeds; pointer horizontal position controls march speed.
  • ASCII shimmerGrid of ASCII ramp characters shimmers through interfering radial and plasma waves in green-teal hues; character density and wave center follow the pointer.
  • Dot-matrix tickerAmber LED dot-matrix marquee scrolling GAME OVER / INSERT COIN / HIGH SCORE across a dim dot grid. Custom 5x7 bitmap font with pulsing brightness per column.
  • Neon arcade signPink neon ARCADE sign with CSS flicker animations and a yellow chasing-light marquee around a glowing pink border frame.