Imported library
3427 items in the library.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages. Sign in
Kind (scroll-effect, loader, features, skill)
Industry
Licence
Source repo
- Subscription
Apex scroll hero
Scroll Effect
Apple-product-page-style "Apex" hero whose 5-second F1 sunset film is scroll-scrubbed full-screen (scroll drives `video.currentTime`) with a synced speed/gear telemetry HUD.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Bloom nested squares
Loader
The shadcn "Bloom" NestedSquares component (25 violet-gradient squares scaling and rotating forever via Framer Motion) staged in a dark motion-specimen studio — a graticule plate, ambient glow, and a calibration rail of dials that retune the live component's ring count, period, stagger, growth, spin and culture.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
scrollcraft engine: zero-dependency scroll runtime driven by data-sc-* attributes (scrub video, pin, pan, flow acts; cues, drift, magnet), with a template page
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
MorphBackground - A scroll chapter whose background morphs between a warm and a cool palette by crossfading two stacked full-bleed gradient layers via opacity
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Three-plane scroll + pointer parallax with depth of field and aerial perspectiveSubscription
Three-plane scroll + pointer parallax with depth of field and aerial perspective
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Dependency-free scroll motion runtime (reveals, scroll-driven animation with IO fallback, magnetic buttons)Subscription
Dependency-free scroll motion runtime (reveals, scroll-driven animation with IO fallback, magnetic buttons)
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Parallax Depth-of-Field - Five mountain layers translate at different speeds; blur simulates camera depth-of-field
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Parallax Scrolling - Elements move at different speeds
Scroll Effect
Background slower, foreground faster — creating a 3D depth illusion.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Reverse-Scrolling Columns - A center column scrolls normally while two flanking columns scroll in reverse, looping infinitely
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Cover Card to Fixed Header - A full-page hero morphs into a compact fixed header
Scroll Effect
Every visual property scrubbed to a single progress value.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Fly-in Fly-out Contact List - Rows translate and fade through entry, active, and exit zones as you scroll
Scroll Effect
Bidirectional and continuous.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Stacking Cards - CSS Scroll-Driven Animations fan cards into a deck
Scroll Effect
Per-index sticky offset creates the visible peek tab.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
ScrollTrigger Animation - The onEnter / onLeave lifecycle demonstrated with vanilla JS
Scroll Effect
Four scroll trigger zones.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Scrub Animation - Scroll position is the playhead
Scroll Effect
A flight path doubles as its own timeline, seekable in either direction.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Pin Animation - An element freezes in place while the page scrolls beneath it
Scroll Effect
CSS sticky, no JavaScript pinning.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Snap Scrolling - CSS scroll-snap-type creates a paginated, magnetic feel
Scroll Effect
Mandatory, proximity, and none compared.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Scrollytelling - Fractional chapter progress drives continuous depth crossfades across six ocean-layer chapters
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Reveal on Scroll - Seven reveal techniques fired by IntersectionObserver at a configurable trigger line
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Stagger Reveal - Groups reveal with cascading delays
Scroll Effect
Forward, reverse, center-out, and random cascade directions.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Horizontal Scroll - Vertical scroll translates a horizontal panel strip
Scroll Effect
A tall pinned section provides the scroll budget.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Sticky Section - The whole section pins while its interior morphs through four states scrubbed to scroll positionSubscription
Sticky Section - The whole section pins while its interior morphs through four states scrubbed to scroll position
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Counter Animation - Numbers count 0 → target with easing on scroll entry
Scroll Effect
Four formats and configurable curve.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Progress Bar - Reading progress in three styles
Scroll Effect
Top bar, circular ring, and side rail — driven by scrollTop / scrollHeight.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Section Wipe - The next section slides over the current via sticky z-index stacking
Scroll Effect
Scale-down adds depth.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Zoom Into Image - clip-path expands from a framed card to full-bleed as you scroll
Scroll Effect
The portal effect.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Smooth (Inertia) Scroll - Wheel and touch input eased toward a target each frame
Scroll Effect
Weighted, gliding momentum instead of native jumps.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Scroll Velocity Skew - Content shears with scroll speed and springs straight when you stop
Scroll Effect
Motion mapped to velocity, not position.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
SVG Line Draw on Scroll - A winding route draws itself down the page via stroke-dashoffset, passing waypoints as you travel
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Scroll-Driven Background Color - The background blends between section palettes as you scroll, flipping text contrast on light stops
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Skeleton Loader - Pulsing placeholder blocks match the shape of real content
Loader
Reduces perceived wait time.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Shimmer Effect - Gradient sweep over skeleton placeholders
Loader
Gives the impression of data streaming in.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Loading Spinner - Six spinner variants from a single CSS color and speed
Loader
Ring, orbit, arc, bounce, pulse, square.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Progress Animation - Linear bar, circular ring, and stepped segments
Loader
All driven by a single percentage value.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Scroll-Driven 3D Rotation - CSS cube rotates through four choreographed stages as you scroll
Scroll Effect
The Apple product-page pattern.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - stratum-motion demoSubscription
stratum-motion demo
Scroll Effect
SSR-safe reveal presets, stagger, parallax, scroll scene and page transition.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Fetch with timeout loaderSubscription
Fetch with timeout loader
Loader
@reactzero/flow race example (WAAPI).
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Loading spinnerSubscription
Loading spinner
Loader
@reactzero/flow repeat example (WAAPI).
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Scroll progress barSubscription
Scroll progress bar
Scroll Effect
@reactzero/flow scroll example (WAAPI).
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Reveal on scrollSubscription
Reveal on scroll
Scroll Effect
@reactzero/flow scroll example (WAAPI).
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Storytelling scroll timelineSubscription
Storytelling scroll timeline
Scroll Effect
@reactzero/flow timeline example (WAAPI).
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Synced Motion recipe gallery - live previews and copyable markup for all sixty accessible GSAP recipes (reveals, stagger, split text, marquee, pinned sequence, parallax, page transitions, SVG draw ...)Subscription
Synced Motion recipe gallery - live previews and copyable markup for all sixty accessible GSAP recipes (reveals, stagger, split text, marquee, pinned sequence, parallax, page transitions, SVG draw ...)
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
scrollcraft engine (ai-ranking fork): zero-dependency data-sc-* scroll runtime, modified for the SEO build, with template page
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - ScrollParallax - anything, moved at a given scroll speed (React)Subscription
ScrollParallax - anything, moved at a given scroll speed (React)
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - StickyScrub - section that pins while you scroll and exposes its progress (React)Subscription
StickyScrub - section that pins while you scroll and exposes its progress (React)
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - CardStack - cards that pin one after another and settle into a stack (React)Subscription
CardStack - cards that pin one after another and settle into a stack (React)
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - ScrollProgress - bar that fills with the page or one article (React)Subscription
ScrollProgress - bar that fills with the page or one article (React)
Scroll Effect
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Scroll expansion heroSubscription
Scroll expansion hero
Scroll Effect
Integration of the ScrollExpandMedia hero into a shadcn-style codebase — a compact media card that hijacks the wheel/touch to unfurl into a full-bleed video or image as you scroll, with a splitting title, dissolving backdrop, and an editorial about-section that reveals on full expansion.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in