∞ forever components

Terminal

Git Graph

An ASCII git commit graph in a green monospace CRT terminal: box-drawing branch rails (│ ├ └ ╲ ╱ ●) run down the left as commits stream in top-to-bottom, each row pairing graph glyphs with a 7-hex short hash, an occasional decorate ref (main, feat/api, tag: v2.4.0), and a plausible commit message. A feature branch diverges, gathers commits, and merges back over one seamless looping cycle.

csslight 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

Developer-tool landing pages, version-control or CI/CD dashboards, terminal-aesthetic hero sections, and ambient "code is alive" loading backdrops.

When not to

Light-background UIs (background is hardcoded dark #0d1117) and non-technical audiences where git graph output carries no meaning. Contexts where continuous motion competes with primary reading content.

Working with an AI agent

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

Change the interval from 620ms to 400ms, rename the feature branch ref from 'feat/api' to 'feat/billing' and update its commit messages, add a second tag row 'tag: v2.4.1' near the end of the cycle, and raise MAX visible rows from 13 to 18.

Safe to edit

  • commit + rail rows and their message pools (cycle array)
  • stream interval (setInterval delay 620)
  • max visible rows (MAX=13)
  • ref-tag colors (.ggr-ref-main / .ggr-ref-feat / .ggr-ref-tag CSS)
  • header label text (.ggr-head)
  • graph glyph glow (.ggr-g text-shadow)

Keep intact

  • IIFE 'use strict' wrapper
  • visibilitychange stop/play guard with running-timer flag
  • prefers-reduced-motion path that fills a static frame then returns early
  • seamless single-lane cycle boundaries (first/last rows keep the graph coherent across loops)
  • graph glyph column width (.ggr-g width:4ch) that aligns hashes across rows

Known limitations

  • Background and accent are hardcoded dark green — must edit CSS to retheme
  • The graph is a pre-authored looping cycle, not a live repository topology
  • Short hashes are regenerated randomly each loop, so they do not persist or reference real commits
  • Purely ambient — no click/hover interactivity is exposed

terminalgitgraphasciimonospacedark-modedeveloperstream

More Terminal components

  • Shell SessionSimulates a looping shell session: commands type out character-by-character with a blinking cursor, then output lines appear, then the next command begins.
  • Resource MonitorRetro BBS-style system monitor showing 6 CPU core bars and 3 memory rows with ASCII block characters; values drift randomly every 420ms.
  • Log StreamSimulates a live server log tail — new entries slide in every 650ms with color-coded INFO/WARN/ERROR/DEBUG levels and real-time timestamps.
  • Build RunnerSimulates npm install + build pipeline in a scrolling terminal; packages, lint/compile steps, and file-change events stream in sequence and loop endlessly.
  • Network TraceSimulates a live traceroute — hops appear one by one with color-coded latency (green/orange/red); ms values fluctuate after trace completes, then loop.
  • Diff ViewerA unified git diff viewer that streams a code review in line by line: a file header with +12/-4 counts, a hunk header, then context/addition/deletion…