Vestaboard Display

Vestaboard Display is a high-fidelity split-flap animation component for Framer that recreates the iconic mechanical display board experience. Each character flips with realistic motion, producing a nostalgic, tactile effect perfect for modern websites, dashboards, and hero sections.

Designed for both visual impact and performance, this component brings mechanical text animation, dynamic messaging, and interactive storytelling into your Framer projects.

🎯 Core Features

- Split-Flap Animation

Each cell animates with a realistic two-part flip using 3D transforms, shadows, and timing delays, closely mimicking real-world Vestaboard displays.

- Message Cycling

Automatically rotates through multiple messages with configurable timing, creating dynamic, continuously updating content.

- Scramble Effect

Before settling, each character cycles through random values, replicating the authentic “mechanical search” behavior of split-flap boards.

- Color Tile Support

Insert colored tiles using simple syntax:{R} {O} {Y} {G} {B} {V} {W}Perfect for highlighting, branding, or visual storytelling.

- Cascade Animation

Characters animate in a wave pattern across rows and columns, creating a premium, cinematic transition effect.

🎨 Customization Options

• Messages (multiple text inputs)

• Animation speed and duration

• Cycle interval (or disable auto-play)

• Light / dark theme

• Corner radius

• Color tiles and accent effects

🧠 Smart Layout System

• Auto text wrapping for 22-column grid

• Intelligent word breaking

• Centered layout (horizontal + vertical)

• Responsive typography using fluid scaling

🎯 Best Use Cases

• Hero sections with dynamic messaging

• SaaS dashboards and analytics UI

• Web3 / AI landing pages

• Creative portfolios and agency websites

• Announcement boards and feature highlights