Vibeset

Letter glow

A soft light field painted with a ramp of characters from darker to lighter: where there is little light, a dot; where there is a lot, an at-sign. It sounds like a terminal without being one. It is not an image turned into text: each cell's light comes from a formula (the chosen shape plus a slow oscillation) and the character comes from that number, so it changes shape without loading anything and scales to any size. There are four shapes (horizon, rise, pinch and eclipse). Under the pointer the letters scramble and on press a wave goes out. Nearly dark cells are not painted, the loop stops off screen and with the dial at zero a single frame is drawn. It is a background: the canvas is hidden from readers and the text on top is normal HTML.

And the React Bits original: Gradient ASCII

This piece is written from scratch in Vibeset: nothing was copied or ported from React Bits. It does something similar to their Gradient ASCII, and this is what we saw in theirs in case you prefer to use the original.

When to use it

For the background of a landing that wants to sound like a terminal without being one. Keep the content on top light so it can breathe.

Watch out for

It is a background: any text on top needs its contrast measured against the lightest part of the gradient, not the average colour.

Accessibility

It respects the system reduced-motion setting and is purely decorative, so there is nothing in it to read.