- Plaza Mayor
- Por Centro y Estación
- Próxima: Museo
Línea nocturna · cada 12 min
LED dot matrix bus sign
The destination sign of a night bus: amber LED dots that jump from line to line, just like the real ones.
Settings
Code
<div class="uvq14-dmx"><div class="pn"><span class="no">27</span><div class="vw"><ul class="ln"><li>Plaza Mayor</li><li>Via Centre and Station</li><li>Next: Museum</li><li aria-hidden="true">Plaza Mayor</li></ul></div></div><p class="cp"><i></i>Night line · every 12 min</p></div>Prompt for AI
Paste it into ChatGPT, Claude or Cursor and it will adapt the block to your project with these settings, even if you don’t use React.
More in Text & scroll
See all Text & scrollWhere to use it
Bus and tram signs show text as a grid of glowing dots, and this block gets the same look with pure CSS: a radial gradient mask turns ordinary type into LEDs, and unlit dots stay faintly visible behind. The lines change in steps, like a real display refreshing. It fits transport apps, city guides and retro event pages.
Set the destination in the text field, write the other lines in the list and choose the LED color with the main color. A slider changes the dot size, and hovering pauses the sign so the current line can be read calmly.