Scramble Text
0
Used by 0Scramble Text
Animate text with cinematic glitch reveals and interactive character-based hover effects.
KEY FEATURES
- — Multiple text reveal animation modes
- — Character-by-character glitch scrambling
- — Single-line and multi-line animations
- — Random reveal sequence
- — Interactive diffusion hover effect
- — Interactive wave hover effect
- — Custom glitch character sets
- — Optional flicker effects with color control
- — Replay and viewport trigger settings
- — Fully customizable easing and timing
- — Responsive typography controls
- — Extensive customization options
API Reference
All props map directly to the controls panel sliders and color pickers.
LAYOUT
PROP
TYPE
DEFAULT
DESCRIPTION
words
string
Crafted by Lander Studio to help founders ship faster with premium-quality Framer experiences.\nBuilt with scalability, motion, and conversion in mind.
Words prop.
font
font
{"fontFamily":"Inter","variant":"Bold","fontWeight":400,"fontSize":35,"lineHeight":"1em","letterSpacing":"0.05em","textAlign":"left"}
Font prop.
tag
enum
p
Tag prop.
ANIMATION
PROP
TYPE
DEFAULT
DESCRIPTION
enterAnimation
object
{"mode":"multiLine","restState":"hidden","replay":true,"position":"above","scrambleIntensity":100,"ease":{"type":"tween","stiffness":800,"damping":60,"mass":1,"duration":2,"ease":"linear"},"flickerEnabled":true,"flickerColor":"#333333","flickerIntensity":84,"flickerSpeed":10}
Enter Animation prop.
hoverAnimation
object
{"type":"diffusion","lines":"oneLine","radius":5,"collapse":false,"collapseTime":1,"glitchChars":"abcdefghijklmnopqrstuvwxyz","glitchShuffle":true,"flickerEnabled":false,"flickerColor":"#ff4400","flickerIntensity":50,"flickerSpeed":10,"waveEase":{"type":"tween","stiffness":800,"damping":60,"mass":1,"duration":1.5,"ease":"linear"},"waveShuffleLimitEnabled":false,"waveShuffleLimitValue":10}
Hover Animation prop.
COLORS
PROP
TYPE
DEFAULT
DESCRIPTION
color
color
#ffffff
Text Color prop.
