---
title: "Vestaboard Display — Framer component · Best of Framer"
description: "$10.00 · Framer component · by Suman Debnath · Text. Vestaboard Display is a high-fidelity split-flap animation component for Framer that recreates the iconic mechanical display board experience."
canonical: "https://framer.elliotli.dev/component/vestaboard-display"
---

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

# Vestaboard Display

Split flap text animation for Framer

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

![Vestaboard Display preview image 1](https://framer.elliotli.dev/og/component/vestaboard-display/bbccf251319bc907/1600x1200.jpg)

## Summary

Vestaboard Display is a high-fidelity split-flap animation component for Framer that recreates the iconic mechanical display board experience.

## Description

**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
    

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

-   All · #9837

## Details

- **Author**: Suman Debnath
- **Price**: $10.00
- **Published**: 2026-05-23
- **Updated**: 2026-05-23
- **Added**: 2026-05-04
- **Categories**: Text

## More like this

-   [Text Reveal Effect](/component/text-reveal-effect) — Lera · $4 — Text reveal effect over "ghost" layer.
-   [Soft Heading](/component/soft-heading) — Kaisa A · Free — Animated Soft Heading in 2 colors
-   [Curved Text Marquee](/component/curved-text-marquee) — Ahmet Loca · Free — Animated Bend
-   [Type Write Effect](/component/type-write-effect) — Russet Supply · Free — Animated Text & Interactive Typing