#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 Cards

Punnett Square Card

Punnett square card with allele combinations and offspring ratios.

#shadow

Live preview Cards

Recent Card

Recently-viewed card with a clock badge, faded thumbnail, and a timestamp.

#gradient #transform #shadow

Live preview Cards

Highway Rest Stop Card

Highway rest stop card with amenities, fuel, and food options.

#gradient #shadow #border

Live preview Cards

Ribbon Award Card

Ribbon award card with a rosette, dangling tails, and a center medallion.

#gradient #transform #shadow

Live preview Cards

Souvenir Magnet Fridge Card

Fridge souvenir magnet card with destination name and magnetic backing.

#gradient #transform #shadow

Live preview Cards

Sticky Note

Yellow sticky note with tape on top, a checklist and a curled bottom corner.

#gradient #3d #shadow

Live preview Cards

Teacher Profile Bio Card

Teacher bio card with avatar, name, subject, and contact info.

#gradient #shadow #border

Live preview Cards

Tennis Set Card

Tennis match card with player names and current set scores.

#gradient #shadow #border

Live preview Cards

Time Zone Card

World clock card with timezone, current time, and offset.

#gradient #shadow #border

Live preview Cards

Train Pass Card

Train pass card with a route diagram, class badge, and a seat assignment.

#gradient #transform #shadow

Live preview Cards

Troll Card

Troll card with regeneration and claw attack.

#gradient #shadow #border

Live preview Cards

Valentine Card

Valentine card with heart icon and love message.

#gradient #shadow #border

Live preview Cards

Vegan Meal Card

Vegan meal card with green accent and plant-based label.

#gradient #shadow #border

Live preview Cards

Visa Stamp Card

Passport visa stamp card with an angled ink stamp and entry/exit details.

#gradient #transform #shadow

Live preview Cards

Wardrobe Outfit Card

Wardrobe outfit card with clothing items and occasion label.

#gradient #shadow

Live preview Cards

Water Cycle Card

Water cycle card with evaporation, condensation, and precipitation.

#gradient #shadow #border

Live preview Cards

Snow Weather Card

Snowy weather card with drifting snowflakes over a frosty pale-blue field.

#animation #gradient #transform

Live preview Cards

Weather Today Card

Today's weather widget with temperature, condition, and high/low.

#gradient #shadow #border

Live preview Cards

Webinar Link Card

Digital webinar card with join button, countdown, and online indicator.

#gradient #shadow

Live preview Cards

Wine Cellar Bottle Card

Wine cellar bottle card with vintage, region, rating, and storage position.

#gradient #transform #shadow

Live preview Cards

Wine List Card

Wine list card with vintage, region, and varietal.

#gradient #shadow #border

Live preview Cards

Wizard Card

Wizard card with pointy hat, spell book, and mana.

#gradient #shadow #border

Live preview Cards

Workout Set Card

Workout set tracker with exercise, sets, reps, weight, and progress bar.

#gradient #transform #shadow

Live preview Cards

Workout Split Day Card

Weekly workout split showing day focus and exercise list.

#gradient #shadow #border

Live preview Cards

Event Wristband

Fabric event wristband with patterned weave, a clasp, and day-stamp text.

#gradient #transform #shadow

Live preview Cards

Yoga Asana Card

Yoga pose card with sanskrit name, difficulty, and duration.

#gradient #shadow

Live preview Cards

Yu-Gi-Oh Card

Yu-Gi-Oh style monster card with ATK/DEF and star level.

#gradient #shadow #border

Live preview Checkboxes

Acai Toggle

An acai spins purple when checked.

#animation #transform #shadow

Live preview Checkboxes

Affogato Toggle

An affogato slides in brown when checked.

#transform #shadow #filter

Live preview Checkboxes

Agate Banded Stone

An agate stone with concentric bands glows when checked.

#gradient #shadow #border

Live preview Checkboxes

Agua Fresca Toggle

An agua fresca slides in blue when checked.

#transform #shadow #filter

Live preview Checkboxes

Alarm Clock Toggle

An alarm clock shakes red when checked.

#animation #transform #shadow

Live preview Checkboxes

Albatross Toggle

An albatross glows sky-blue when checked.

#transform #shadow #filter

Live preview Checkboxes

Ambulance Toggle

An ambulance pulses red when checked.

#animation #transform #shadow

Live preview Checkboxes

Amethyst Purple Gem

A purple amethyst crystal sparkles when checked.

#gradient #shadow #border

Live preview Checkboxes

Ant March Toggle

An ant wiggles with a dark glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Aurora Glow Toggle

A box that glows with shifting aurora gradients when checked.

#animation #gradient #transform

Live preview Checkboxes

Balloon Float Toggle

A balloon floats with a red glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Banana Peel Toggle

A banana peel rotates yellow on check.

#transform #shadow #filter

Live preview Checkboxes

Bank Toggle

A bank scales in gold when checked.

#transform #shadow #filter

Live preview Checkboxes

Baseball Toggle

A baseball bounces white on check.

#animation #transform #shadow

Live preview Checkboxes

Bat Fly Toggle

A bat flutters with a dark glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Beamed Sixteenths Toggle

Beamed sixteenth notes scale in teal when checked.

#transform #shadow #filter

Live preview Checkboxes

Bedbug Toggle

A bedbug rotates red on check.

#transform #shadow #filter

Live preview Checkboxes

Coin Flip Toggle

A coin spins gold when checked.

#transform #shadow #filter

Live preview Checkboxes

Dragonfly Toggle

A dragonfly slides in blue when checked.

#transform #shadow #filter

Live preview Checkboxes

Duck Toggle

A duck flips orange when checked.

#transform #shadow #filter

Live preview Checkboxes

Emerald Green Gem

A step-cut emerald shows deep green facets when checked.

#gradient #shadow #border

Live preview Checkboxes

Falcon Toggle

A falcon shakes brown when checked.

#animation #transform #shadow

Live preview Checkboxes

Fig Toggle

A fig fades in purple when checked.

#transform #shadow #filter

Live preview Checkboxes

Giraffe Tall Toggle

A giraffe brightens with a yellow glow when checked.

#transform #shadow #filter

Live preview Checkboxes

Glassmorphism Rose

A frosted glass effect with rose tint and checkmark when checked.

#transform #shadow #border

Live preview Checkboxes

Has-Selector Select All

The parent row reads its children through :has() and reports partial or full.

#border #shadow #transform

Live preview Checkboxes

Jasper Spotted Stone

A red jasper stone with speckled pattern appears when checked.

#gradient #shadow #border

Live preview Checkboxes

Leaf Grow Toggle

A leaf emoji grows in from a small scale with a green glow when checked.

#shadow #transform #filter

Live preview Checkboxes

Leaf Miner Toggle

A leaf miner flips green when checked.

#transform #shadow #filter

Live preview Checkboxes

Long Drum Toggle

A long drum shakes in orange when checked.

#animation #transform #shadow

Live preview Checkboxes

Motorcycle Toggle

A motorcycle bounces in with cool glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Number 1 Toggle

Number 1 scales up blue when checked.

#transform #shadow #filter

Live preview Checkboxes

Paw Print Toggle

A grayscale paw-print emoji fills in and pads down with a warm glow when toggled on.

#shadow #transform #filter

Live preview Checkboxes

Plug Power Toggle

A plug glows yellow when checked.

#transform #shadow #filter

Live preview Checkboxes

Plum Toggle

A plum flips purple when checked.

#transform #shadow #filter

Live preview Checkboxes

Quarter Note Toggle

A quarter note symbol fades in blue when checked.

#transform #shadow #filter

Live preview Checkboxes

Scissors Cut Toggle

Scissors snip with a gray glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Sun Brighten Toggle

A dim sun emoji brightens and slowly rotates with a warm yellow glow when checked.

#animation #shadow #transform

Live preview Checkboxes

Sunset Dusk Toggle

A sunset glows warm when checked.

#transform #shadow #filter

Live preview Checkboxes

Minus Math Symbol Toggle

A minus math symbol that turns red when checked.

#transform #shadow #filter

Live preview Checkboxes

Omega Symbol Toggle

The Greek omega letter fades violet when checked.

#shadow #filter

Live preview Checkboxes

Theta Symbol Toggle

The Greek theta letter scales pink when checked.

#transform #shadow #filter

Live preview Checkboxes

Glass Texture Toggle

A frosted glass texture with blue tint when checked.

#gradient #transform #shadow

Live preview Checkboxes

Storm Crash Toggle

A thunderstorm shakes yellow when checked.

#animation #transform #shadow

Live preview Checkboxes

Tornado Spin Toggle

A tornado spins gray when checked.

#transform #shadow #filter

Live preview Checkboxes

Willet Toggle

A willet flips gray when checked.

#transform #shadow #filter

Live preview Forms

Glowing Background Input

Background glows brightly on focus, color seeping outward.

#gradient #shadow #border

Live preview Forms

Gradient Background Input

Input with an animated gradient background that shifts on focus.

#gradient #shadow #border

Live preview Forms

Mesh Background Input

Input with a vibrant mesh gradient background.

#gradient #shadow #border

Live preview Forms

Neon Background Input

Dark input with neon glow background on focus.

#gradient #shadow #border

Live preview Forms

Sunken Input

Deeply sunken input that appears pressed into surface.

#shadow #border

Live preview Forms

3D Border Input

Skeuomorphic 3D raised border that depresses on focus.

#transform #shadow #border

Live preview Forms

Ice Border Input

Icy frosted border with crystalline shimmer.

#shadow #border

Live preview Forms

Inset Border Input

Sunken inset border that pops out on focus.

#shadow #border

Live preview Forms

Retro Terminal Border

Old terminal-style input with chunky inset border.

#shadow #border

Live preview Forms

Curve Floating Label

Label arcs upward in a curved path using transform-origin trick.

#transform #shadow #border

Live preview Forms

Cyan Accent Floating Label

Crisp cyan-themed floating label input.

#transform #shadow #border

Live preview Forms

Emerald Accent Floating Label

Calm emerald-themed floating label for signup forms.

#transform #shadow #border

Live preview Forms

iOS Style Floating Label

Clean iOS-style input with rounded corners and subtle floating label.

#shadow #border

Live preview Forms

Floating Label Slide Up

Classic floating label that slides up when the input is focused or filled.

#transform #shadow #border

Live preview Forms

Violet Accent Floating Label

Violet-themed floating label input with soft glow.

#transform #shadow #border

Live preview Forms

Animating Icon Input

Input whose left icon bounces when input is focused.

#animation #transform #shadow

Popular tags