Wave Section Dividers
Pure CSS and inline SVG section dividers with wave, layered wave, curve and tilt shapes that inherit the next section's color and stretch to any width.
Effects & Animations
Visual effects and motion.
7 component(s)
Scroll Reveal Animations
Elements fade, slide, zoom or flip into view on scroll using IntersectionObserver and data-sr attributes, with stagger delays and reduced-motion support.
Animated Gradient Background
Pure CSS hero section with a slowly shifting multi-color gradient, drifting blurred blobs and a grain overlay, customizable through CSS variables.
Image Hover Effects
Six pure CSS image hover effects with captions: zoom, grayscale to color, sliding panel, tilt, blur and frame, also revealed by keyboard focus.
Animated Gradient Text
Pure CSS animated gradient text for headings using background-clip, with four palettes, a shine sweep variant, a CSS-only pause switch and a fallback color.
Typing Text Effect
Pure CSS typewriter effect with a blinking caret, using steps() and ch units on a monospace headline and a retro terminal window with replay.
Reading Progress Bar
Sticky Tailwind CSS reading progress bar with a gradient fill, clickable chapter markers, current section label, minutes left and a circular back-to-top indicator.