sh4dcnv2 · atlas
← libraries

@pacekit-gsap

A companion GSAP-powered animation component library from PaceKit, providing React components with smooth GSAP-driven interactions for production apps. The docs nav lists an AI Toolkit category (Modal Selector, Modal Ability Selector, AI Suggestions, Response Writer, Token Counter) alongside Text Effects (Reveal Text, Scramble Text, Squash Text, Bouncing Text, Draw Line Text, Mouse Wave Text, Dot Animation) and additional animated Blocks. Uses GSAP (GreenSock) rather than CSS transitions or Framer Motion. Tailwind CSS, TypeScript, shadcn CLI compatible. Free, MIT-licensed. Use for: adding high-quality GSAP-driven text animations and interactive UI effects to Next.js or React apps without building animation logic from scratch.

29 components react shadcn-cli MIT

Install this registry

shadcn (npm) npx shadcn@latest add https://gsap.pacekit.dev/r/registry.json
pnpm pnpm dlx shadcn@latest add https://gsap.pacekit.dev/r/registry.json
bun bunx shadcn@latest add https://gsap.pacekit.dev/r/registry.json
fetch registry curl -s https://gsap.pacekit.dev/r/registry.json

Components

29 total
index style
npx shadcn@latest add https://gsap.pacekit.dev/r/index.json
AI Suggestions ui

Get smart, real-time AI recommendations to refine and improve your work

npx shadcn@latest add https://gsap.pacekit.dev/r/ai-suggestions.json
Modal Selector ui

AI-focused model selector with preview, tooltips, and capability indicators built-in

npx shadcn@latest add https://gsap.pacekit.dev/r/ai-modal-selector.json
Modal Ability Selector ui

Compact selector for toggling abilities with icons and custom styles

npx shadcn@latest add https://gsap.pacekit.dev/r/ai-modal-ability-selector.json
Response Writer ui

An auto-scrolling text display that smoothly keeps the latest response always visible

npx shadcn@latest add https://gsap.pacekit.dev/r/ai-response-writer.json
Modal Ability Selector ui

Compact selector for toggling abilities with icons and custom styles

npx shadcn@latest add https://gsap.pacekit.dev/r/ai-token-counter.json
Reveal Text ui

A smooth text reveals animation where each heading reveals related content on interaction.

npx shadcn@latest add https://gsap.pacekit.dev/r/reveal-text.json
Scramble Text ui

A hover-triggered text effect that scrambles and restores characters with smooth motion

npx shadcn@latest add https://gsap.pacekit.dev/r/scramble-text.json
Squash Text ui

Characters bounce and squash into place with playful, dynamic energy.

npx shadcn@latest add https://gsap.pacekit.dev/r/squash-text.json
Bouncing Text ui

A playful animation where characters bounce in sequence across the text.

npx shadcn@latest add https://gsap.pacekit.dev/r/bouncing-text.json
Draw Line Text ui

A smooth text effect that draws characters as strokes and fills them in—perfect for headers and highlights.

npx shadcn@latest add https://gsap.pacekit.dev/r/draw-line-text.json
Mouse Wave Text ui

Creates a wave-like bounce effect on text as the mouse moves across

npx shadcn@latest add https://gsap.pacekit.dev/r/mouse-wave-text.json
Text Fall Button ui

A button with dynamic text that falls into place with a smooth, elastic motion on hover or click.

npx shadcn@latest add https://gsap.pacekit.dev/r/text-fall-button.json
Spring Button ui

A button that shrinks on press and springs back with bounce.

npx shadcn@latest add https://gsap.pacekit.dev/r/spring-button.json
Fillable Button ui

A button that fills with color on hover.

npx shadcn@latest add https://gsap.pacekit.dev/r/fillable-button.json
Swap ui

A flexible swap component that animates content changes with smooth customizable transition effects.

npx shadcn@latest add https://gsap.pacekit.dev/r/swap.json
Animated Stack ui

A smooth stacked card component that expands on hover and collapses with animation.

npx shadcn@latest add https://gsap.pacekit.dev/r/animated-stack.json
Layered Stack ui

An interactive component that dynamically layers elements, creating a visually engaging stacked animation effect.

npx shadcn@latest add https://gsap.pacekit.dev/r/layered-stack.json
Gradient Shadow ui

Smooth horizontal gradient flow, creating a subtle glowing hover shadow effect.

npx shadcn@latest add https://gsap.pacekit.dev/r/gradient-shadow.json
GitHub Star Counter ui

Display live GitHub star count for any public repository

npx shadcn@latest add https://gsap.pacekit.dev/r/github-star-counter.json
Profile Peek ui

Hover to peek profile with smooth reveal, right from the image.

npx shadcn@latest add https://gsap.pacekit.dev/r/profile-peek.json
Flip Reveal ui

Animated container that reveals or hides items using GSAP Flip transitions and keys.

npx shadcn@latest add https://gsap.pacekit.dev/r/flip-reveal.json
Reveal On Scroll ui

Animate content into view on scroll with effects like fade, slide, zoom, and blur.

npx shadcn@latest add https://gsap.pacekit.dev/r/reveal-on-scroll.json
Stagger on Scroll ui

Stagger elements into view with scroll-triggered fade, slide, zoom, or blur effects.

npx shadcn@latest add https://gsap.pacekit.dev/r/stagger-on-scroll.json
Liquid Cursor ui

A smooth, fluid cursor that follows your mouse with gentle stretch and bounce effects.

npx shadcn@latest add https://gsap.pacekit.dev/r/liquid-cursor.json
Liquid Glass ui

A smooth glass effect with subtle blur, ideal for UI highlights and overlays.

npx shadcn@latest add https://gsap.pacekit.dev/r/liquid-glass.json
Tilt Card ui

Interactive 3D tilt card that responds to cursor, adds depth and motion

npx shadcn@latest add https://gsap.pacekit.dev/r/tilt-card.json
Dot Loader ui

A compact 7x7 dot grid loader with smooth animation to visualize frame sequences or loading states in your app.

npx shadcn@latest add https://gsap.pacekit.dev/r/dot-loader.json
Dot Flow ui

Visually expressive status updates with animated dots and smooth sliding text transitions.

npx shadcn@latest add https://gsap.pacekit.dev/r/dot-flow.json