Sonic Text

About this Component

Fully responsive, interactive text for Framer: Per-letter hover animations, plays lightweight WebAudio—no audio files needed.

Instructions:

Features:

• Per-letter hover effects: None, Blink, Jump, or Shape (filled rounded block) with smooth spring/bounce transitions.

• Full Font control: Typeface, size, weight, line height, letter spacing, alignment — all via Framer’s Font control.• Color styling: Base color + hover color, plus separate text color inside Shape mode.

• Built-in sound palette (WebAudio): Keycap Tick, Pixel Pop, Pop, Glass Ping, Chime, Wood Click, Water Plop, Laser Blip, Whoosh Micro, Crackle Cluster, Birdsong, Blackbird, Pianino, Air Bell — no audio files needed.

• Sound tuning: Volume, throttle (anti-spam), and stereo spread per letter; instant audition from the picker.

• On-canvas Effect Picker: Clickable pills to try hover modes and sounds; toggle on/off from props.

• Letter layout control: Adjustable per-letter gap and optional pointer cursor.

• Performance-friendly: Lightweight WebAudio synths, throttled triggers, and a master dynamics compressor.

Tip: Set Auto Demo to No. It was turned on just to showcase the action on the Marketplace