Loading…
All Tailwind components
15 components · sorted by recently added · filtered by #animation
N
Tailwind
#music#player+3
Neon Music Player Widget
Compact music player with album art, animated equaliser bars, scrubber, elapsed/remaining time and play controls. Pure CSS keyframes drive the EQ pulse and the neon ring around the album art.
Maya
10
A
Tailwind
#terminal#code+3
Animated Terminal Demo
macOS-style terminal mockup with auto-playing typewriter lines, syntax-coloured tokens, and a blinking caret. Pure CSS animation timing.
GoSnippets AI
11
A
Tailwind
React#progress#skills+3
Animated Skill Progress Bars
Profile skill panel where each progress bar fills from 0 to its value with an eased animation. Each bar's gradient is tinted to match the skill level.
GoSnippets AI
00
C
Tailwind
React#sidebar#navigation+3
Collapsible Sidebar Navigation
Dashboard-style sidebar that smoothly collapses from a 240px expanded state to a 64px icon rail. Active item glow, hover highlight, group separators.
GoSnippets AI
00
H
Tailwind
#dashboard#stats+3
Holographic Stat Cards
Three iridescent stat cards with a slowly rotating conic-gradient sheen, sparkline preview and a delta badge. Drop-in for any dashboard hero.
GoSnippets AI
11
C
Tailwind
#404#error+3
Cosmic 404 — Lost in Space
Bold 404 page with a giant gradient numeral, floating planets, twinkling starfield and a primary CTA back to safety. Pure CSS animation.
GoSnippets AI
21
Sponsored
D
Tailwind
React#toggle#theme+3
Day / Night Theme Toggle
Animated theme switch with morphing sun → moon icon and a full-page palette transition. Click anywhere on the switch to toggle the demo card's vibe.
GoSnippets AI
00
S
Tailwind
React#testimonial#carousel+3
Smooth Testimonial Carousel
Auto-rotating testimonial slider with a soft cross-fade, gradient avatar rings and indicator dots. Pause on hover, manual nav via arrows or dots.
GoSnippets AI
00
L
Tailwind
React#notification#toast+3
Live Notifications Stack
Click the action button — notifications slide in from the top-right, stack with subtle scale, then dismiss themselves. Five tones, randomised on each click.
GoSnippets AI
00
A
Tailwind
React#pricing#toggle+3
Animated Pricing Toggle
Three-plan pricing layout with a monthly/yearly toggle. Price values cross-fade with a slide animation, popular plan glows, yearly savings banner.
GoSnippets AI
11
L
Tailwind
#form#signup+3
Liquid Glass Sign-Up Form
Glassmorphic sign-up form on a slowly morphing liquid blob background. Animated focus rings on inputs and a candy-gradient primary action.
GoSnippets AI
00
H
Tailwind
#bento#features+3
Holographic Feature Bento
Modern asymmetric bento grid with iridescent shimmer that sweeps across each card on hover. Six tiles, four sizes, all responsive.
GoSnippets AI
00
C
Tailwind
#hero#cyberpunk+3
Cyber Glitch Hero Section
Cyberpunk-flavoured hero with animated grid, scanline pass, rotating geometry, glitched gradient headline and a glowing neon primary CTA.
GoSnippets AI
00
P
Tailwind
React#dashboard#react+3
Featured
Pulse Stats — Animated React Dashboard
Interactive React stats panel on an aurora gradient. Click to randomise the three live counters — each animates a pulse ring driven by custom CSS keyframes, with hover glow on the card edges.
GoSnippets AI
10
A
Tailwind
#pricing#card+3
Featured
Aurora Glass Pricing Card
Glassmorphic pricing card sitting on an animated aurora gradient. Tailwind for layout and typography; custom CSS keyframes drive the shifting mesh + floating orbs.
GoSnippets AI
00