#shadow CSS effects

5,664 free, pure-CSS effects match the "shadow" tag. Each is copy-ready and needs no library or build step.

Live preview Navigation

Vertical Tab Circle Bg Active

Vertical tabs with a circular active background indicator.

#hover #transform #shadow

Live preview Navigation

Vertical Tab Color Shift

Vertical tabs that shift through accent colors on hover.

#hover #shadow

Live preview Navigation

Vertical Tab Flip Card

Vertical tabs that flip in 3D when active, revealing content.

#hover #transform #shadow

Live preview Navigation

Vertical Tab Neon Active Line

Vertical tabs with a pulsing neon active line indicator.

#hover #animation #transform

Live preview Navigation

Vertical Tab Rounded Soft

Soft rounded vertical tabs with gentle hover transitions.

#hover #shadow

Live preview Navigation

Vertical Tab Underline Slide

Vertical tab nav where the active underline slides between items.

#hover #transform #shadow

Live preview Progress

Glacier Wizard Progress

A wizard header with five numbered nodes sitting on one continuous rail that fills to the live step.

#wizard #steps #flexbox

Live preview Progress

Stark Dash Progress

A brutalist meter with a hard offset shadow, three pixel outlines and a dashed leading edge.

#brutalism #monospace #border

Live preview Progress

Valley Ticks Progress

Twelve rotated tick marks form a circular counter with eight of them lit around a centre count.

#transform #rotate #counter

Live preview Sliders

Pylon Shadow Depth

A standing block casts a shadow that keeps stretching and pulling back over its floor.

#slider #shadow #preview

Live preview Tabs

Frost Underline Tabs

A frosted tab bar where a glowing underline glides beneath the active label.

#transform #gradient #shadow

Live preview Tabs

Mica Hairline Tabs

Uppercase spaced labels over a single hairline that glides between them.

#typography #transform #shadow

Live preview Tabs

Orbit Neumorphic Tabs

Soft moulded keys press inward and a pale light keeps orbiting the chosen one.

#shadow #animation #conic-gradient

Live preview Tabs

Shaft Bottom Bar Tabs

The tab strip sits under the panel and a shaft pin rises into whichever is open.

#layout #transform #shadow

Live preview Tabs

Socket Privacy Tabs

Privacy levels shaped as sockets; the pin drops into the one you pick.

#animation #shadow #border

Live preview Tabs

Topaz Terminal Tabs

A small terminal window whose tab strip switches monospace panes with a blinking caret.

#animation #terminal #shadow

Live preview Text

Ballet Grace

Graceful ballet pink on text.

#animation #gradient #transform

Live preview Text

Blueberry Blue

Deep blue blueberry on text.

#animation #gradient #shadow

Live preview Text

Bounce Light Card

Bounce card reflected light.

#shadow

Live preview Text

Boxing Glove

Boxing glove punching on text.

#animation #transform #shadow

Live preview Text

Cards Shuffle

Shuffling playing cards on text.

#animation #transform #shadow

Live preview Text

Carnival Mask

Mardi Gras carnival mask on text.

#animation #gradient #shadow

Live preview Text

Cathedral Gothic

Gothic cathedral dark stone on text.

#animation #shadow #filter

Live preview Text

Chalk Board

Chalk text on dark board with dusty texture.

#shadow #filter

Live preview Text

Chess Bishop

Chess bishop on diagonal on text.

#animation #transform #shadow

Live preview Text

Chrome Metallic

Polished chrome metallic text with bright reflection and dark base.

#gradient #shadow #filter

Live preview Text

Cinema Projector

Cinema projector beam glow.

#gradient #shadow #filter

Live preview Text

Clamp Tritone

Three-hue clamped tritone layering.

#shadow

Live preview Text

Cloud Puff Drift

Puffy clouds drifting slowly across text.

#animation #transform #shadow

Live preview Text

Color Stack Layers

Layered color stack effect.

#shadow

Live preview Text

Compass Needle

Compass needle pointing direction on text.

#animation #transform #shadow

Live preview Text

Concert Hall

Grand concert hall on text.

#animation #gradient #shadow

Live preview Text

Cranberry Tart

Tart red cranberry on text.

#animation #transform #shadow

Live preview Text

CRT Monitor Curve

CRT monitor scanline curve.

#gradient #shadow

Live preview Text

Cymbal Crash

Loud cymbal crash burst on text.

#animation #transform #shadow

Live preview Text

Daffodil Trumpet

Yellow daffodil trumpet cup on text.

#animation #gradient #transform

Live preview Text

Dark Matter

Mysterious dark halo around faintly glowing text.

#animation #shadow

Live preview Text

Debossed Sunken

Sunken debossed text carved into surface.

#shadow

Live preview Text

Decrescendo Fade

Fading decrescendo volume on text.

#animation #transform #shadow

Live preview Text

Dew Drop

Glistening dewdrop sliding down text.

#animation #transform #shadow

Live preview Text

Prism Dispersion

Prismatic dispersion splitting light into spectra.

#shadow

Live preview Text

Drizzle Light

Light gentle drizzle over text.

#animation #gradient #shadow

Live preview Text

Edwardian Elegant

Edwardian elegant cream on text.

#animation #gradient #shadow

Live preview Text

Embossed Text

Subtly embossed text with a light top edge and dark bottom edge for depth.

#shadow #border

Live preview Text

Event Horizon

Dark ring of no return surrounding text.

#animation #gradient #transform

Live preview Text

Fire Text

Text painted with a flickering fire gradient in warm reds and yellows.

#gradient #animation #shadow

Live preview Text

Futuristic HUD

Sci-fi HUD display text with cyan glow and outline.

#shadow

Live preview Text

Glow Pulse Text

Soft pulsing glow ring around text that breathes in and out.

#animation #glow #shadow

Live preview Text

Ivy Climb

Climbing ivy vines on text.

#animation #transform #shadow

Live preview Text

Lens Flare Bright

Bright lens flare streaks.

#gradient #shadow #filter

Live preview Text

Leo Lion

Majestic maned Leo lion zodiac sign.

#animation #gradient #shadow

Live preview Text

Lotus Tranquil

Tranquil pink lotus on water text.

#animation #gradient #transform

Live preview Text

Mist Haze

Soft misty haze over distant text.

#animation #transform #shadow

Live preview Text

Neon Flicker Text

Layered text shadows imitate a neon sign whose tubes stutter before settling.

#animation #shadow #neon

Live preview Text

Neptune Blue

Deep blue ice giant Neptune.

#animation #gradient #shadow

Live preview Text

Noon Blaze

Blazing midday sun over text.

#animation #shadow #filter

Live preview Text

Paper Torn

Text on torn rough-edge paper with ink bleed.

#shadow #filter

Live preview Text

Paprika Red

Red paprika spice on text.

#animation #gradient #shadow

Live preview Text

Peony Lush

Lush full pink peony on text.

#animation #gradient #transform

Live preview Text

Pine Evergreen

Deep evergreen pine on text.

#animation #gradient #shadow

Live preview Text

Postal Stamp

Postal stamp text with perforated edge.

#shadow #filter

Live preview Text

Quasar Beam

Brilliant quasar beam sweeping across bright text.

#animation #gradient #shadow

Live preview Text

Red Giant Star

Swollen red giant star slowly expanding.

#animation #transform #shadow

Live preview Text

Retro 50s Diner

1950s diner chrome and red style.

#shadow

Live preview Text

Rhythm Pulse

Steady rhythm pulse on text.

#animation #transform #shadow

Live preview Text

Roman Column

Roman fluted column on text.

#animation #gradient #shadow

Live preview Text

Shadow Perspective Floor

Floor perspective reflection shadow.

#transform #shadow

Live preview Text

Sphere Shaded

Text filled with a radial highlight gradient giving a spherical metallic look.

#gradient #animation #shadow

Live preview Text

Strawberry Red

Sweet red strawberry on text.

#animation #gradient #transform

Live preview Text

Sustain Ring

Long sustained ringing note on text.

#animation #shadow #filter

Live preview Text

Treble Clef

Curving treble clef over text.

#animation #transform #shadow

Live preview Text

Treble Tinkle

High treble tinkle on text.

#animation #transform #shadow

Live preview Text

Tulip Cup

Cup-shaped tulip gradient on text.

#animation #gradient #transform

Live preview Text

Typewriter Mono Clean

Clean monospace typewriter.

#shadow

Live preview Text

Vintage Poster

Aged vintage poster text with muted sepia tones.

#shadow #filter

Live preview Text

Water Ripple

Text with a watery ripple distortion effect.

#animation #gradient #transform

Live preview Text

White Dwarf

Dense, hot white dwarf with intense glow.

#animation #shadow #filter

Live preview Text

Willow Weep

Weeping willow branches on text.

#animation #transform #shadow

Live preview Text

Y2K Bubble Gloss

Y2K glossy bubble text.

#gradient #shadow #filter

Live preview Tooltips

Aurora Borealis

Northern-lights aurora borealis gradient tooltip.

#hover #gradient #transform

Live preview Tooltips

Book Page

Book page tooltip with double-page book styling.

#hover #transform #shadow

Live preview Tooltips

Burnt Orange Glow

Warm burnt orange tooltip with a soft ambient glow.

#hover #transform #shadow

Live preview Tooltips

Carbon Fiber

Carbon fiber weave texture tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Code Line Numbers

Tooltip with line-numbered code above the trigger.

#hover #transform #shadow

Live preview Tooltips

Comet Tail

Comet tail tooltip with trailing gradient streak.

#hover #gradient #transform

Live preview Tooltips

Coral Sunset Pink

Warm coral-to-pink gradient tooltip evoking a sunset.

#hover #gradient #transform

Live preview Tooltips

Crystal Spark

Crystal-like sparkling tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Cyber Grid

Cyberpunk grid pattern tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Date Picker

Date picker style tooltip above the trigger.

#hover #transform #shadow

Live preview Tooltips

Denim Fabric

Denim fabric texture tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Double Frame Bottom

Tooltip with an outer double-frame border below the trigger.

#hover #transform #shadow

Live preview Tooltips

Double Frame Top

Tooltip with an outer double-frame border above the trigger.

#hover #transform #shadow

Live preview Tooltips

Error Stack

Error stack trace style tooltip above the trigger.

#hover #transform #shadow

Live preview Tooltips

Feature Card

Feature highlight card tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Glass Frost Cold

Cool-toned frosted glass tooltip with cold blue tint.

#hover #transform #shadow

Live preview Tooltips

Glass Iridescent

Iridescent glass tooltip with a rainbow shimmer overlay.

#hover #gradient #transform

Effects tagged #shadow

Popular tags