Vibeset

Light beam

A beam coming down from above and landing at a point: white core, halo, swirling fog, fine streaks, dust motes and a flare where it touches the surface. With the pointer over it, it points at the pointer; otherwise it sways slowly. The beam is not an image, it is a distance: for each pixel it computes how far it falls perpendicular to the line between origin and impact and how far it advances along it; from the perpendicular come core, halo and fog (gaussians of different widths) and from the advance, the fade at the top and the cut at the floor. The streaks and dust live in those same coordinates, so they travel with the beam. The output is transparent, with premultiplied alpha, and adds to the background without a black square. A decorative laser on every landing is what reads as AI-made today: use it when it points at something that matters.

And the React Bits original: Laser Flow

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

When to use it

For the landing of a technical or security product, with a surface to rest the beam on. Glow works when it says something.

Watch out for

A decorative laser on every hero is exactly what reads as "AI-made" today. Use it with a reason: let the beam point at what matters. It has a paused prop to stop it.

Accessibility

It respects the system reduced-motion setting and is purely decorative.