text reveal animation

16 hand-coded CSS fade-in animations with live demos — pure-opacity hero fade with staggered delays, clip-path inset reveal, blur defocus, staggered grid cascade, scroll-triggered IntersectionObserver reveal, directional slide-fade up, scale-up zoom-in, scale-down zoom-in, rotateX perspective tilt, word-by-word split, skew sweep, radial clip-path mask reveal, greyscale-to-color saturate, rotateY flip card, glitch flash multi-step, and cascade letter drop. 13 pure CSS + 3 with a tiny vanilla JS snippet — no framework. animation-fill-mode forwards, prefers-reduced-motion honoured, MIT licensed.

22 hand-coded CSS transition effects covering every production motion pattern in 2026 — button hover transitions (9 polished variants: fill sweep, slide-up, neon glow, rotate, border draw, 3D depth, ripple, shimmer, split wipe), scroll-reveal animation, 3D flip card, text reveal with mask clip, image zoom on hover, background color crossfade, border draw animation, fade in/out, navigation menu hover, loading skeleton shimmer, modal open/close, page transitions (Next/Vue/Astro view-transition pattern), ripple effect on click, underline animation, animated number counter, 3D mousemove card tilt, glassmorphism hover, staggered IntersectionObserver list animation, cursor trail effect, magnetic button hover, split text reveal (GSAP-style), and animated progress bars. All GPU-accelerated via transform + opacity only (compositor-thread, no layout thrashing — INP-friendly), respect prefers-reduced-motion, and ship MIT-licensed with zero framework dependencies. 9 demos are 100% pure CSS; 13 use vanilla JavaScript for IntersectionObserver, mousemove, or click coordinates.

14 hand-coded CSS typewriter effects with live demos — canonical pure-CSS steps() + ch cursor, multi-line stagger, infinite word-swap loop, neon terminal prompt, clip-path reveal mask, SVG stroke-dashoffset handwriting, gradient highlight sweep, variable-font weight morph, per-character split stagger, vanilla-JS character injection, Matrix-rain scramble decode, RGB-channel glitch-on-type, syntax-highlighted code-editor typewriter, and scroll-triggered word reveal. 9 pure CSS (no JavaScript) + 5 with a tiny vanilla JS snippet — no framework. Modern @property + steps() techniques, prefers-reduced-motion honoured, MIT licensed.