Imported library

v0.1 · Phase 0

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

Has preview (81)Clear filters

Kind (skill, loader, other, carousel)

Mood

dark (57)light (31)playful (8)calm (4)bold (10)luxury (3)minimal (55)techy (16)organic (1)futuristic (3)editorial (14)

Industry

saas (7)ai (4)agency (4)portfolio (5)ecommerce (1)gaming (1)fashion (2)media (6)general (95)developer-tools (16)

Style

brutalist (1)gradient (32)neon (1)monochrome (17)3d (10)illustration (2)photographic (5)typographic (14)parallax (5)particles (1)video (12)terminal (2)

Licence

MIT (117)CC0-1.0 (12)Apache-2.0 (1)

Source repo

xiyu519/MotionVault (19)matinmonshizadeh/animation-handbook (15)superdesigndev/superdesign-prompts (12)educlopez/smoothui (10)motiondesignlv/ReactZero-flow (10)yojahny55/cinematic-scroll-kit (9)imMamdouhaboammar/creative-agent-pack (8)davidjerleke/embla-carousel (5)ridelink0/ultimate-frontend-skills (5)cosscom/coss (4)nolimits4web/swiper (4)codse/animata (3)mantinedev/ui.mantine.dev (3)studygeorge/parallax-fx (3)dimeloper/motion-site-kit (2)ui-layouts/uilayouts (2)Black-Line-Ops/scroll-scrub-hero (1)codrops/3DCarousel (1)codrops/FullscreenScroll (1)codrops/GlitchyGrid (1)codrops/SlideshowAnimations (1)danhnm1203/scrollytelling (1)Dhyey2907/claude-skill-scroll-cinema (1)JasonOracle/agnes-scroll-world (1)prantikmedhi/scroll-earth (1)pulkitxm/claude-directory (1)shadcn-ui/ui (1)SyntaxUI/syntaxui (1)tech-maxara/cineritual (1)TommyChryst/claude-web-animations (1)untitleduico/react (1)vb-tyagi/snake-smooth-scroll-UI-animation-skill (1)

Page 1 of 3 · 130 items · 48 on this page

2 across

Bloom nested squares
Loader
Subscription
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
scrollytelling agent skill and Claude Code plugin: look at the footage, write beats, scaffold, encode and verify a scroll-scrubbed page
scrollytelling agent skill and Claude Code plugin: look at the footage, write beats, scaffold, encode and verify a scroll-scrubbed page
Skill
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
scroll-scrub-hero: agent skill that turns one photo (or an idea) into a scroll-scrubbed transformation hero via storyboard, keyframes, Kling tweens and WebP frames
scroll-scrub-hero: agent skill that turns one photo (or an idea) into a scroll-scrubbed transformation hero via storyboard, keyframes, Kling tweens and WebP frames
Skill
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
CLAUDE.md web design operating manual: two-pass screenshot verification, parallel execution, design quality rules
CLAUDE.md web design operating manual: two-pass screenshot verification, parallel execution, design quality rules
Skill
Free sample
Visual research skill - render real sites and read them as pictures for references and moodboards
Visual research skill - render real sites and read them as pictures for references and moodboards
Skill
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Section: index - table of contents with dot leaders
Component
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Section: manifesto - eyebrow + two-line serif statement + one narrow paragraph
Component
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Section: faq - accordion, native details/summary
Component
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
playwright-cli skill (Microsoft) - drive a real browser from the terminal for agents
playwright-cli skill (Microsoft) - drive a real browser from the terminal for agents
Skill
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Cinematic Scroll Kit master methodology (AGENTS.md + GUIDE.md)
Cinematic Scroll Kit master methodology (AGENTS.md + GUIDE.md)
Skill
Free sample
Narrative from brand (250-400 word brand story in two voices)
Narrative from brand (250-400 word brand story in two voices)
Skill
Free sample
Storyboard from narrative (6-10 scenes with start/end frame prompts for AI video)
Storyboard from narrative (6-10 scenes with start/end frame prompts for AI video)
Skill
Free sample
Video preprocessing (all-keyframe encode + 9:16 mobile reframes with ffmpeg)
Video preprocessing (all-keyframe encode + 9:16 mobile reframes with ffmpeg)
Skill
Free sample
Build cinematic scroll site (continuous-reel scroll-scrub site generator)
Build cinematic scroll site (continuous-reel scroll-scrub site generator)
Skill
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Adaptive mobile strategy (autoplay-loop substitution, scrims, reduced motion)
Adaptive mobile strategy (autoplay-loop substitution, scrims, reduced motion)
Skill
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Scroll-scrub rendering (video.currentTime vs WebCodecs vs image-sequence decision tree)
Scroll-scrub rendering (video.currentTime vs WebCodecs vs image-sequence decision tree)
Skill
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Portable slash-commands: /cinematic-site (full pipeline) and /storyboard
Portable slash-commands: /cinematic-site (full pipeline) and /storyboard
Skill
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Skeleton Loader - Pulsing placeholder blocks match the shape of real content
Loader
Subscription
Reduces perceived wait time.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Shimmer Effect - Gradient sweep over skeleton placeholders
Loader
Subscription
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
Loading Spinner - Six spinner variants from a single CSS color and speed
Loader
Subscription
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
Progress Animation - Linear bar, circular ring, and stepped segments
Loader
Subscription
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
Checkmark Draw - SVG path draws progressively on success
Component
Subscription
Stroke-dashoffset animates from full length to zero.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Notification Badge Pulse - Dot on icon pulses to draw peripheral attention
Component
Subscription
Scale, halo, or both.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Tooltip Reveal - Info box fades in after a 300ms delay
Component
Subscription
Long enough to avoid triggering on mouse pass-through.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Drawer / Panel Slide - Off-canvas panel slides from edge
Component
Subscription
Ease-out open, ease-in close. Backdrop dismisses.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Modal Expand - Modal scales from the trigger button's position
Component
Subscription
Transform-origin set to where you clicked.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Accordion Open/Close - Height animates between 0 and auto
Component
Subscription
JS measured height vs CSS grid-template-rows compared.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Toast Notification - Notification cards slide in from a corner, stack, and auto-dismiss with a progress bar
Component
Subscription
Swipe or click to dismiss.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Pull to Refresh - Dragging past the top reveals a spinner that fills with distance; release past the threshold to refresh
Component
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
2.5D / Pseudo-3D - Seven depth layers parallax at different rates
Component
Subscription
Mouse-driven or auto-panning camera.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Cloth Simulation - Verlet integration + distance constraints
Component
Subscription
Draggable flag responds to gravity and wind.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Morphing Blob - Metaball circles fused by an SVG blur-plus-contrast filter melt like liquid
Component
Subscription
The blob drifts and a droplet chases the pointer.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
CineRitual agent skills - create site, generate video prompts, process video, customise theme, deploy
CineRitual agent skills - create site, generate video prompts, process video, customise theme, deploy
Skill
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Accessibility-aware animation demo
Accessibility-aware animation demo
Component
Subscription
@reactzero/flow composition example (WAAPI).
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Modal with backdrop
Modal with backdrop
Component
Subscription
@reactzero/flow composition example (WAAPI).
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Competing animations (race)
Competing animations (race)
Component
Subscription
@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
Fetch with timeout loader
Fetch with timeout loader
Loader
Subscription
@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
Heartbeat monitor loop
Heartbeat monitor loop
Component
Subscription
@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
Loading spinner
Loading spinner
Loader
Subscription
@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
Pulsing notification
Pulsing notification
Component
Subscription
@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
Toast cascade
Toast cascade
Component
Subscription
@reactzero/flow sequence example (WAAPI).
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Auto-dismiss toast
Auto-dismiss toast
Component
Subscription
@reactzero/flow timeout example (WAAPI).
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Countdown timer
Countdown timer
Component
Subscription
@reactzero/flow timeout example (WAAPI).
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
scroll-cinema - Claude skill for scroll-scrubbed 'camera path' sites (pinned stages, aperture opens, dolly, 3D card entries, stacked panels, masked text reveals) in vanilla JS + CSS custom properties
Skill
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Scroll Earth - agent skill that builds a cinematic scroll-scrubbed landing page: Imagen stills -> Veo clips -> rendered-frame connector clips -> portable scrub engine
Skill
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
motion-website - agent skill for building scroll-scrubbed frame-sequence and WebGL motion sites with a CI-enforced performance budget (engine selection, frame pipeline, scroll engine, page kit, QA)
motion-website - agent skill for building scroll-scrubbed frame-sequence and WebGL motion sites with a CI-enforced performance budget (engine selection, frame pipeline, scroll engine, page kit, QA)
Skill
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
Page kit - 34 composable section families (hero-cinematic, stat-stack, work-rail, visual-chapters, image-comparison, project-index, ...) with a planner, four complete page recipes (studio, product, hospitality, exhibition) and a catalog/preview UI
Component
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in
creative-web-experiences - router skill that classifies an interactive 3D web brief into one of eight modes (image-sequence, video-seeking, 2.5D, realtime-3D, geospatial, volumetric, WebXR, hybrid) with 18 references
creative-web-experiences - router skill that classifies an interactive 3D web brief into one of eight modes (image-sequence, video-seeking, 2.5D, realtime-3D, geospatial, volumetric, WebXR, hybrid) with 18 references
Skill
Subscription
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in

Page 1 of 3 · 130 items · 48 on this page