Hoverlight — Spotlight Text Reveal
Text that responds to light. Move your cursor and a soft spotlight reveals each line in its highlight style — halftone dots, stripes, grid, checker, gradient, or solid.
Every line is styled independently. Mix a halftone headline with a striped second line and a solid closer. Offset lines, stretch them, layer patterns — build editorial type compositions that feel printed, then bring them to life on hover.
Features
6 fill styles per line: solid, halftone, stripes, grid, checker, gradient
Independent styling for every line — colors, pattern size, gap, angle, opacity, offset, width scale
Smooth spotlight with adjustable size, softness, and follow speed
Rest state options: hidden or centered glow
Works on touch devices — the light follows your finger
Text wrapping with manual line break support
Full typography control: any font, tracking, line height, negative line gap for tight stacked type
Auto and fill sizing supported
Usage
Drop it in, type your text (one line per row), then style each line in the Line Styles array. Set your spotlight size and softness, pick a rest state, done. No code needed.
Hoverlight — Spotlight Text Reveal
Text that responds to light. Move your cursor and a soft spotlight reveals each line in its highlight style — halftone dots, stripes, grid, checker, gradient, or solid.
Every line is styled independently. Mix a halftone headline with a striped second line and a solid closer. Offset lines, stretch them, layer patterns — build editorial type compositions that feel printed, then bring them to life on hover.
Features
6 fill styles per line: solid, halftone, stripes, grid, checker, gradient
Independent styling for every line — colors, pattern size, gap, angle, opacity, offset, width scale
Smooth spotlight with adjustable size, softness, and follow speed
Rest state options: hidden or centered glow
Works on touch devices — the light follows your finger
Text wrapping with manual line break support
Full typography control: any font, tracking, line height, negative line gap for tight stacked type
Auto and fill sizing supported
Usage
Drop it in, type your text (one line per row), then style each line in the Line Styles array. Set your spotlight size and softness, pick a rest state, done. No code needed.
