void-screen

a browser-based screen utility - solid colors, key lighting, and animated modes

v1.0 - Doles

A fullscreen browser utility for use as a monitor blanker, ambient display, key light source, or background fill. No build step, no dependencies, no backend. Pure HTML, CSS, and vanilla JS with ES modules.

Live at void.doles.dev

---

modes

Solid - full-screen color with brightness control. Nine presets plus a full color picker.

Key Light - turns your monitor into a physical light source for video calls or streaming. Adjustable color temperature from 1000K to 12000K with named presets (Candle, Tungsten, Warm White, Daylight, Cool White, Shade). Uses accurate kelvin-to-RGB math so the color is physically correct.

Matrix - digital rain using katakana and hex glyphs. Configurable color and scroll speed.

Stars - warp-speed starfield. Optional extras: spiral galaxies with individual star dots plotted along logarithmic arms, procedural planets with surface bands, terminator shadows, specular highlights and rings, and roaming UFOs with tractor beams and blinking lights.

DVD - the real DVD logo bouncing and changing color on every wall hit. Detects corner hits and throws a confetti celebration. Configurable size.

Fire - canvas particle fire with a log pile, heat shimmer, and ember physics. Click the bellows button to stoke it; it dies back down on its own.

Terminal - scrolling Hollywood-style hacker output. Color and speed controls. Built with an entry point for interactive mode.

---

controls

The UI panel auto-hides after 3 seconds of inactivity and reappears on any mouse movement. Double-click anywhere outside the panel to go fullscreen. Works best fullscreened (F11 or double-click).

---

project structure

void-screen/
  index.html                - markup and ui panel
  style.css                 - all styles
  main.js                   - entry point, ui wiring, mode orchestration
  dvdlogo.svg               - dvd logo (fill="currentColor" for recoloring)
  modes/
    matrix.js               - matrix rain canvas renderer
    starfield.js            - starfield warp + galaxies, planets, ufos
    dvd.js                  - dvd logo bounce + corner celebration
    fire.js                 - particle fire system with stoking mechanic
    terminal.js             - hacker terminal scrolling output

---

local dev

No build step. ES modules require HTTP - open via a local server, not directly as a file:// URL.

python -m http.server 8080
# then open http://localhost:8080

---

adding a mode

1. Create modes/yourmode.js exporting at minimum initYourMode() and destroyYourMode()
2. Add a mode button to #mode-row in index.html
3. Add a control group div if the mode needs settings
4. Import and wire up in main.js following the pattern in activateMode()

---

MIT License - see LICENSE