∞ forever components

Retro & Glitch

Fake terminal typing

Green-on-black CRT terminal auto-types a fake boot sequence with randomized keystroke delays, scanline overlay, and blinking block cursor; loops continuously.

csslight 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

Retro/hacker aesthetic hero sections, loading screens, portfolio intros, or any context needing an old-school terminal vibe.

When not to

Light-background layouts (background is hardcoded dark). Contexts where motion or blinking conflicts with content legibility.

Working with an AI agent

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

Change the typed lines to a custom script by editing the `lines` array, e.g. replace 'HELLO WORLD' with 'SYSTEM READY', and set the prompt color class 'p' to a magenta hex in the CSS `.p` rule.

Safe to edit

  • lines array content (text + color class per segment)
  • typing speed (32+Math.random()*40 ms)
  • text color (#7dffb0 green phosphor)
  • scanline opacity (.scan opacity:.5)
  • font size (clamp(11px,3.3vw,18px))
  • loop pause duration (delay<-80 threshold)

Keep intact

  • visibilitychange pause guard
  • prefers-reduced-motion instant-render branch
  • IIFE-style scoped variable block (avoids globals)

Known limitations

  • Background color hardcoded in CSS — must edit to use on light backgrounds
  • No click-to-skip or replay interaction; fully passive
  • innerHTML string concatenation is fragile if line text contains HTML special characters

terminaltypewriterretrocrtgreen-phosphorloopboot-sequence

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.