Split
Flap

The classic departure board aesthetic in pure web technology. CSS and JavaScript split-flap animations for digital signage. Multiple themes. Live RSS feed. Fullscreen mode. No dependencies.

LAB-04 · Digital Signage Live Demo CSS · JavaScript · No dependencies
Status Live demo — try it below

SF-01 /

Live Demo

Working split-flap display · CSS animations

Departures — Craig Stanley Studio — LAB-04

Row 1
Row 2
Row 3
Theme:
Mode:
Speed:
Message:

SF-02 /

Features

What it can do

01

Pure Web Tech

No canvas, no WebGL, no external libraries. CSS keyframe animations and vanilla JavaScript only. Runs in any modern browser on any hardware.

02

Three Themes

Classic dark (Copenhagen airport), warm amber (vintage Solari board), white reverse (modern station). Switch live without a page reload.

03

Configurable Speed

Slow (airport ambience), medium (station pace), or fast (live scoreboard). Each character tile animates independently with staggered timing.

04

Auto-Cycle Mode

Set and forget. Auto mode cycles through a set of demo messages every 5 seconds — ideal for kiosk and signage use with no interaction required.

05

M365 RSS Mode

Live mode fetches the Microsoft 365 release communications feed and cycles update titles through the board every 8 seconds. Real-time M365 change awareness, departure-board style.

06

Fullscreen Mode

One click fills the entire display. Tiles scale dynamically to fill the viewport — clean, controls-free, boardroom-ready. Works as a browser source in OBS for streaming.

07

Multi-Row Layout

Three independent rows update with staggered timing. RSS titles wrap automatically across all three rows for maximum information density.

08

Embeddable

Drop it into any HTML page. URL-configurable for quick deployment on kiosk screens. The mechanism is the message.

LAB-04 · Split Flap Screen · Live demo · The mechanism is the message.