---
title: "Retro Display — Framer component · Best of Framer"
description: "$7.00 · Framer component · by Abhrajit Ray · Text. Customizable LED dot-matrix text display"
canonical: "https://framer.elliotli.dev/component/retro-display"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/Retro Display

# Retro Display

Customizable LED dot-matrix text display

[View on Framer](https://framer.com/marketplace/components/retro-display/?via=elliot-li)

![Retro Display preview image 1](https://framer.elliotli.dev/og/component/retro-display/13e5cfdf0e9cda74/1600x1200.jpg)

## Summary

Customizable LED dot-matrix text display

## Description

## Why it grabs attention:

Plain hero type gets scanned. The same words rendered as a flickering dot-matrix sign read as a physical object on the page, not type, and that's what makes a visitor stop for two more seconds. Cycle multiple messages through one sign and your hero carries a tagline, launch date, and CTA without extra blocks.

### Style statement:

CRTs, arcade cabinets, terminal energy. The chassis colors are tokens, so it can read as a modern brand mark or push hard into gaming, hardware, and AI tools.

### Under the hood:

\- The container size sets the dot grid. A \`ResizeObserver\` re-fits when the layout shifts.

\- 3x5 bitmap glyphs, multi-line wrap if the message overflows columns.

\- GSAP \`stagger: { from: "random" }\` cascade for the lit-dot reveal.

\- Cycling between messages uses one repeating timeline with dwell, fade-in, fade-out phases, cleaned up via \`gsap.context\`.

### Best for:

Hero status banners, launch and waitlist pages, retro/gaming/arcade brands, hardware and IoT, AI and developer tools, hackathon and event sites, studio portfolios.

### Controls:

\- **Texts**: array of strings, cycles through

\- **Accent**: lit-dot color

\- **Dot Size**: 2 to 16px, sets resolution

\- **Bezel**, **Ridge**, **Screen**, **Screws**: chassis colors

\- **Corner Radius**: 0 to 48px

### Built for production:

Auto-pauses offscreen (\`IntersectionObserver\`) and stays static on Framer's canvas and thumbnail. Respects \`prefers-reduced-motion\`. Auto-fits any container size. Marked as a polite live region for screen readers.

## Rank history [How rankings work →](/terms#rankings)

-   All · #9973

## Details

- **Author**: Abhrajit Ray
- **Price**: $7.00
- **Published**: 2026-05-26
- **Updated**: 2026-05-26
- **Added**: 2026-05-13
- **Categories**: Text

## More like this

-   [Hover Stretch Text](/component/hover-stretch-text) — 584.studio · $3 — Responsive & fully customizable
-   [Type Write Effect](/component/type-write-effect) — Russet Supply · Free — Animated Text & Interactive Typing
-   [Odometer Stats](/component/odometer-stats) — Pixlify · Free — Rolling number counters
-   [Clipped Words](/component/clipped-words) — Interface Studio · $5 — Words With a Little Chaos
