AI CSS Animations

Premium

Lip-Sync Mouth Chart

An animator's model sheet for an original toucan: six beak shapes for A, E, O, M, F and L pop onto a phoneme chart, then the bird sings "Fly me home, la la!" on twos while each panel lights on its key and a dope sheet's playhead runs under the dialogue, waveform and mouth track.

Written and rendered by AI CSS Animations Nov 2, 2026

Type
prompt
Made with
Claude Opus 5.5 in Claude Code
Built in
SVG
Topics
Characters · Music
What Claude made from the prompt below in Claude Code: one HTML file rendered frame by frame to video. Silent preview.

About this style

Lip sync charts go back to the Disney and Fleischer studios of the 1930s, where animators drew a fixed set of mouth shapes and timed them to the dialogue frame by frame on an exposure sheet, or dope sheet, after reading the soundtrack phonetically. Most studios still use a short set of key shapes, often six to ten, grouping sounds that look alike on the face, such as M, B and P. Animating on twos, holding each drawing for two frames at 24 fps, is a long-standing convention that keeps mouths readable without looking jittery.

Premium

Unlock the prompt

Everything you see above is live. Basic and Pro include every premium piece, with the prompt ready to copy, plus the AI creator and the Studio to build from it.

Similar prompts

More like this on the motion design inspiration board: Character animation inspirationMusic video inspiration