# animation CSS effects

Live preview Buttons

Orbit Arc

Orbiting planet button with a sweeping arc.

#hover #animation #gradient

Live preview Buttons

Periwinkle

Soft periwinkle-blue button with a gentle pulse.

Live preview Buttons

Phoenix Flame

Rebirth button with rising orange flames.

Live preview Buttons

Pink Lemonade

Refreshing pink and yellow swirl.

Live preview Buttons

Plasma Field

Electric purple plasma with shifting hues.

#hover #animation #gradient

Live preview Buttons

Pulsar

Pulsar button with a rhythmic energy pulse.

Live preview Buttons

Quantum Field

Tech-blue button with vibrating quantum field.

Live preview Buttons

Quasar Burst

Cosmic quasar with radial energy burst.

Live preview Buttons

Radar Sweep

Dark scope button with a rotating radar sweep.

Live preview Buttons

Radioactive Glow

Toxic green button with pulsing hazard glow.

#animation #hover #border

Live preview Buttons

Rainbow Hover Button

Plain button whose background cycles through the rainbow on hover.

Live preview Buttons

Ripple Ring Button

Concentric rings pulse outward from the button edge while the pointer rests on it.

#hover #animation #transform

Live preview Buttons

Rubber Band Button

Teal button that wobbles elastically like a rubber band on hover.

#animation #hover #shadow

Live preview Buttons

Salmon Run

Upstream salmon-pink button with motion lines.

#animation #shadow #border

Live preview Buttons

Scanner Line

Black-green button with scanning beam line.

Live preview Buttons

Scuba Dive

Deep dive blue with rising bubble particles.

#animation #hover #border

Live preview Buttons

Shake Button

Red alert button that shakes rapidly while hovered, then inverts on click.

Live preview Buttons

Silk Sheen

Soft silk button with diagonal moving sheen.

Live preview Buttons

Sherbet Swirl

Creamy orange-raspberry sherbet swirl.

Live preview Buttons

Soft Shimmer

Pastel button with a soft shimmer overlay.

Live preview Buttons

Snake Border Button

A single bright emerald arc travels continuously around the perimeter.

Live preview Buttons

Snowfall Drift

Frosted button with snowflakes drifting down.

#animation #shadow #border

Live preview Buttons

Sonar Ping

Sonar pings radiating outward in teal.

Live preview Buttons

Spring Up Button

Orange button that springs up with overshoot easing on hover.

#animation #hover #shadow

Live preview Buttons

Static Noise

Old TV static noise on a black button.

#hover #animation #border

Live preview Buttons

Stitched Outline Button

A dashed stitch line sits inside the button and creeps around it on hover.

Live preview Buttons

Taffy Pull

Stretched pink-yellow taffy with swirls.

Live preview Buttons

Teal Wave

Soft teal button with horizontal wave motion.

Live preview Buttons

Tempest Storm

Stormy blue-purple with lightning flicker.

Live preview Buttons

Thunder Clap

Yellow lightning bolt flash on dark sky.

Live preview Buttons

Tidal Pull

Moon-pulled tidal button with vertical wave.

Live preview Buttons

Tornado Spin

Spinning tornado of gray-blue clouds.

Live preview Buttons

Tremor Shake

Brown earth button with subtle tremor shake.

#animation #hover #border

Live preview Buttons

Typewriter Button

Monospace button with a blinking cursor; types out its label on hover.

Live preview Buttons

Unicorn Magic

Pastel rainbow swirl with sparkles.

Live preview Buttons

Vacuum Void

Empty black void button with subtle pulse.

Live preview Buttons

Vapor Mist

Translucent vapor mist rising from button.

#hover #animation #gradient

Live preview Buttons

Vortex Sea

Sea-vortex button with a spiraling deep blue.

Live preview Buttons

Whirlpool Spin

Blue whirlpool spiral that spins.

Live preview Buttons

Whisper Soft

Almost-white button with breath-soft pulse.

#gradient #animation #glow

Achievement Badge

Game achievement unlocked card with a glowing medal, ribbon and an XP reward.

All-Access Pass

All-access pass with a holographic stripe, bold tiers, and a rotating shimmer.

Anniversary Card

Anniversary card with golden confetti, interlocking rings, and elegant serif.

Apology Card

Apology card with a wilted flower, muted tones, and a humble message.

Baby Shower Card

Baby shower card with a soft pastel palette, teddy, and a tiny feet motif.

Backstage Pass

Laminated backstage pass with a clip, spinning holographic seal and band info.

#gradient #animation #3d

Birthday Card

Birthday card with a cake illustration, candles, balloons, and a banner message.

Board Game Card

Board game card with a dice icon, turn indicator, and a player score panel.

Bon Voyage Card

Bon voyage card with a plane trail, dashed route line, and suitcase icon.

Cashback Card

Cashback offer card with a coin stack icon, percentage, and a claim button.

#gradient #animation #shadow

Cassette Tape

Retro cassette tape card with spinning reels, a window and a printed label.

Mixtape Cassette Card

Mixtape cassette card with spinning reels, handwritten label, and side A/B.

CD Cover Card

CD jewel case card with a disc peeking out and album tracklist.

Bar Chart Card

Bar chart card with labeled bars, a baseline axis, and a title with total.

Collector Card

Sleeved collector card with a numbered holographic stamp and a centered figure.

Compass Card

Compass card with a rotating needle, cardinal points, and a brass finish.

Concert Poster Card

Concert poster card with bold typography, starburst rays, and a date banner.

Congratulations Card

Congratulations card with confetti burst, stars, and bold celebratory typography.

#gradient #animation #glow

Conic Glow Border

Card with a rotating conic-gradient border that glows around the edges.

Game Controller Card

Game controller product card with a controller silhouette and spec list.

Counter Card

Animated counter card with rolling digits, a label, and a small delta.

Crypto Wallet Card

Crypto card with a bitcoin glyph, balance, and an animated blockchain hash strip.

Cyberpunk Card

Neon-drenched cyberpunk card with corner brackets, scan lines and a glitch hover effect.

Dialog Box Card

RPG dialog box card with a portrait, scrolling text, and a continue arrow.

Download Progress Card

Download progress card with file name, size, and bar.

Early Bird Card

Early bird offer card with a sunrise gradient, bird glyph, and countdown timer.

Epic Frame Card

Epic-tier purple card with a charged arcane frame and crackling edge energy.

Error 404 Card

404 error card with a glitchy number, lost-in-space motif, and a home button.

Exclusive Member Card

Members-only exclusive card with a deep navy gradient, monogram, and emboss feel.

Face ID Card

Face ID card with face scan frame and status text.

Fingerprint Unlock Card

Fingerprint unlock card with icon, label, and ripple.

Flash Sale Card

Flash sale card with lightning bolt accents, a yellow flash banner, and timer.

Game Over Card

Game over card with glitchy red text, static lines, and a retry button.

Get Well Card

Get well card with a thermometer, pill capsule, and a soothing pastel palette.

Glitch Card

Card with an animated RGB-split glitch effect on its title that fires on hover.

Goodbye Card

Farewell card with a waving flag, dotted trail, and a heartfelt sign-off.

#gradient #animation #border

Animated Gradient Border

Card with a continuously animated multi-color gradient border using a mask technique.

#animation #gradient #border

Masked Gradient Card

An animated angle drives a gradient that is masked to a one pixel border ring.

Graduation Card

Graduation card with a cap and tassel, diploma, and a class-year stamp.

Heartbeat Pulse Card

Heartbeat monitor card with animated EKG line and BPM reading.

Holiday Special Card

Holiday special card with falling snow, evergreen border, and a wreath badge.

Holographic Card

Iridescent holographic card that shimmers with a moving rainbow gradient on hover.

Hydration Bottle Card

Hydration tracker with animated water bottle fill level.

#animation #transform #shadow

Last Chance Card

Last chance card with a pulsing red alert banner, sand timer, and urgent CTA.

Legendary Aura Card

Legendary card with a rotating golden aura, ornate corners, and a hero portrait.

Level Up Card

Level-up celebration card with a burst of rays, big level number, and confetti.

#gradient #animation #shadow

Driver License

Driver license card with a photo, personal info fields and an animated hologram strip.

Location Pin Card

Map location card with a pin marker, address, distance, and a get-directions link.

Mana Bar Card

Mana bar card with a glowing blue fill, shimmer animation, and a numeric label.

Meditation Bell Card

Meditation session card with breathing circle and timer.

#animation #transform #shadow

Mini-Map Card

Game mini-map card with terrain tiles, a player arrow, and quest markers.

#gradient #animation #shadow

Music Player

Compact music player card with album art, an animated progress bar and playback controls.

Mystic Rune Card

Mystic card with a slowly rotating rune circle and a glowing central sigil.