#border CSS effects

3,831 free, pure-CSS effects match the "border" tag. Each is copy-ready and needs no library or build step.

Live preview Hover

Border Rainbow Flow

Rainbow border flows on hover.

#hover #animation #gradient

Live preview Hover

Border Unwrap

Border unwraps from one side on hover.

#hover #border

Live preview Hover

Color Invert Pill

Pill swaps its background and text colors instantly on hover.

#hover #border #transform

Live preview Hover

Neon Static

Static neon glow on hover.

#hover #shadow #border

Live preview Hover

Onyx Black

Onyx deep black shine on hover.

#hover #gradient #shadow

Live preview Hover

Corner Border Draw

Four accent corner brackets draw inward on hover, framing the content.

#hover #border #transform

Live preview Hover

Curtain Open

Two colored curtains split apart horizontally to reveal content on hover.

#gradient #hover #shadow

Live preview Hover

Cyber Glitch

Cyberpunk RGB-split glitch with rapid clip-path jumps on hover.

#animation #hover #border

Live preview Hover

Dissolve to Dots

A dotted overlay fades in over the panel, dissolving the content into a dot matrix on hover.

#gradient #hover #border

Live preview Hover

Electric Cyan

Electric cyan outline crackles on hover.

#hover #shadow #border

Live preview Hover

Evaporate Up

Content floats upward with a vertical blur as if evaporating on hover.

#gradient #hover #border

Live preview Hover

Fade & Slide Up

Default label fades up and out while a new label fades up into place on hover.

#hover #border #transform

Live preview Hover

Flip 3D Card

Card-style 3D flip on hover.

#hover #transform #border

Live preview Hover

Flip 3D Door

Door-swing 3D flip on hover.

#hover #transform #border

Live preview Hover

Fold Corner

Corner folds over on hover.

#hover #border

Live preview Hover

3D Tilt Edge Frame

Frame tilts in 3D while edges highlight on hover.

#hover #transform #shadow

Live preview Hover

Arrow Corner Frame

Arrow-shaped accents point inward at each corner on hover.

#hover #transform #border

Live preview Hover

Bracket Loosen

Inner brackets loosen outward to release the element on hover.

#hover #transform #border

Live preview Hover

Bracket Snap

Two L-brackets snap together to form a frame on hover.

#hover #transform #border

Live preview Hover

Bracket Tighten

Outer brackets tighten inward to grip the element on hover.

#hover #transform #border

Live preview Hover

Cassette Flap Frame

Top flap opens like a cassette tape on hover.

#hover #transform #border

Live preview Hover

Chevron Trace Frame

Chevron pattern traces the border on hover.

#hover #gradient #transform

Live preview Hover

Fast Corner Trace

Single corner accent traces all four corners quickly on hover.

#hover #animation #transform

Live preview Hover

Corners Slide Frame

Four corner brackets slide inward from each edge on hover.

#hover #border

Live preview Hover

Cyber Corner Frame

Cyberpunk-style corner brackets with glow trace on hover.

#hover #transform #shadow

Live preview Hover

Dashes Crawl Frame

Dashed border marches around the element on hover.

#hover #animation #border

Live preview Hover

Dotted Crawl Frame

Dotted border slowly crawls around on hover.

#hover #animation #border

Live preview Hover

Double Trace Frame

Two borders trace around the element on hover.

#hover #transform #border

Live preview Hover

Fire Edge Frame

Burning ember effect glows along the edge on hover.

#hover #animation #shadow

Live preview Hover

Fold Out Frame

Frame panels fold outward like opening a box on hover.

#hover #transform #shadow

Live preview Hover

Glitch Corner Frame

Corners glitch and shift on hover.

#hover #animation #transform

Live preview Hover

Strong Glow Edge

Strong neon glow surrounds the element on hover.

#hover #shadow #border

Live preview Hover

Glow Pulse Edge

Edges pulse with glowing animation on hover.

#hover #animation #shadow

Live preview Hover

Ice Edge Frame

Crystalline ice frost forms on the edges on hover.

#hover #shadow #border

Live preview Hover

Magnetic Pull Frame

Frame magnetically follows the cursor on hover.

#hover #transform #shadow

Live preview Hover

Origami Corner Frame

Origami paper folds unfold at corners on hover.

#hover #border

Live preview Hover

Rotate Square Frame

Outer square frame rotates around the element on hover.

#hover #animation #transform

Live preview Hover

Scale Edge Frame

Border scales from outside inward to frame the element on hover.

#hover #transform #border

Live preview Hover

Sticker Lift Frame

Sticker-style frame lifts and peels on hover.

#hover #transform #border

Live preview Hover

Stripes Slide Frame

Diagonal stripes slide across the border on hover.

#hover #gradient #border

Live preview Hover

Twist Corner Frame

Corners twist into place with 3D rotation on hover.

#hover #transform #border

Live preview Hover

VHS Trace Frame

VHS tracking distortion lines trace the border on hover.

#hover #animation #gradient

Live preview Hover

Wavy Line Frame

Wavy line undulates around the border on hover.

#hover #shadow #border

Live preview Hover

Zipper Open Frame

Zipper teeth separate as frame opens on hover.

#hover #gradient #border

Live preview Hover

Frost Freeze

Icy crystal pattern forms over the panel with a frosted blue tint on hover.

#gradient #hover #shadow

Live preview Hover

Glow Border

A neon border glow softens and brightens on hover.

#glow #hover #shadow

Live preview Hover

Gradient Sweep

A diagonal gradient band sweeps across the button on hover.

#gradient #hover #border

Live preview Hover

Grain Texture Reveal

A subtle film-grain noise texture fades in over the panel on hover.

#hover #border #transform

Live preview Hover

Halo Ring

A glowing halo ring expands on hover.

#hover #transform #shadow

Live preview Hover

Image Zoom Overlay

Image scales up gently while a dark overlay fades in with a caption.

#gradient #hover #border

Live preview Hover

Implode

Content shrinks toward a central point with a vortex glow on hover.

#gradient #hover #border

Live preview Hover

Letter-Spacing Expand

Text loosens its letter-spacing and inverts color on hover.

#hover #border

Live preview Hover

Lift Card Shadow

Card lifts upward with a soft, diffuse shadow on hover.

#hover #shadow #border

Live preview Hover

Magnetic Button

Button translates toward the cursor for a magnetic pull feel.

#gradient #hover #shadow

Live preview Hover

Melt Drip

Button melts downward with drooping corners and a falling drip on hover.

#gradient #hover #border

Live preview Hover

Mosaic Tile Flip

A 3x3 grid of small tiles flips in 3D in a staggered wave on hover.

#gradient #hover #3d

Live preview Hover

Motion Smear

Label smears horizontally with a directional blur as if caught mid-motion on hover.

#gradient #hover #border

Live preview Hover

Neon Pink Glow

Hot pink neon glow surrounds on hover.

#hover #shadow #border

Live preview Hover

Orbit Circle

Circular orbital path on hover.

#hover #border

Live preview Hover

Orbit Ellipse

Elliptical orbit on hover.

#hover #border

Live preview Hover

Spiral In Particles

Particles spiral inward toward the element on hover.

#hover #animation #transform

Live preview Hover

Pixel Grid Light

A fine grid of pixel dots lights up across the panel on hover.

#gradient #hover #shadow

Live preview Hover

Push Reveal

Top label pushes up and out, pulling a second label up from below on hover.

#hover #border #transform

Live preview Hover

Reflection Glass

Frosted glass reflection on hover.

#hover #gradient #transform

Live preview Hover

Rim Light Edge

Bright rim light traces edges on hover.

#hover #shadow #border

Live preview Hover

Ripple Pulse

An expanding ring ripples outward from the button on hover.

#gradient #hover #border

Live preview Hover

Rotate 3D Book

Book-opening flip on hover.

#hover #transform #border

Live preview Hover

Rotate 3D Box

Box lid flip open on hover.

#hover #transform #border

Live preview Hover

Rotate 3D Card

Playing card 3D flip on hover.

#hover #transform #border

Live preview Hover

Rotate 3D Crate

Crate lid swings open on hover.

#hover #transform #border

Live preview Hover

Rotate 3D Door

Door-swing rotation on hover.

#hover #transform #border

Live preview Hover

Rotate 3D Envelope

Envelope flap fold on hover.

#hover #transform #border

Live preview Hover

Rotate 3D Page

Page-turn 3D flip on hover.

#hover #transform #border

Live preview Hover

Scale + Blur Background

Background scales up and blurs while a foreground panel focuses in.

#gradient #hover #shadow

Live preview Hover

Scanline Sweep

A bright CRT scanline sweeps vertically down the panel on hover.

#gradient #animation #hover

Live preview Hover

Shadow Clone

Two blurred echo clones offset diagonally behind the button on hover.

#gradient #hover #shadow

Live preview Hover

Shatter Glass

Shatters into glass shards on hover.

#hover #gradient #transform

Live preview Hover

Shine Line Sweep

A bright shine band sweeps diagonally across the icon button.

#gradient #hover #border

Live preview Hover

Shutter Close

Four triangular shutter blades sweep in from the corners to close over the panel on hover.

#gradient #hover #shadow

Live preview Hover

Skew Tilt Button

Button skews horizontally on hover for a playful tilt.

#gradient #hover #shadow

Live preview Hover

Slide Reveal Overlay

A colored panel slides up from below, swapping the label text color.

#gradient #hover #border

Live preview Hover

Cursor Spotlight

A radial spotlight follows the cursor across the surface on hover.

#gradient #hover #border

Live preview Hover

Stars Burst

Tiny stars burst outward on hover.

#hover #animation #transform

Live preview Hover

Static Noise

TV static noise overlay fills the panel with rapid random flicker on hover.

#animation #hover #border

Live preview Hover

Teleport Poof

Button puffs out into a smoke ring and reappears with a flash on hover.

#animation #hover #border

Live preview Hover

TV Turn Off

Panel collapses to a thin horizontal line then fades like an old TV switching off.

#gradient #hover #border

Live preview Hover

Vanish

Content vanishes into a blur haze while a smoke cloud puffs outward on hover.

#gradient #hover #border

Live preview Hover

Venetian Tilt

Vertical venetian blind slats rotate in 3D to let light through on hover.

#gradient #hover #3d

Live preview Hover

Zoom Blur

Content zooms in with a radial blur, simulating a dolly zoom on hover.

#gradient #hover #shadow

Live preview Loaders

Antenna Signal

Antenna with signal waves.

#animation #transform #border

Live preview Loaders

Arc Bounce Swing

Arc swinging like a pendulum and bouncing.

#animation #transform #border

Live preview Loaders

Arc Sweep

Arc sweeping around a center point.

#animation #transform #border

Live preview Loaders

Arcade Token

Arcade token spinning in air.

#animation #gradient #transform

Live preview Loaders

Archery Bow

Bow drawing arrow back.

#animation #gradient #transform

Live preview Loaders

Arrow Bounce

Arrow bouncing up and down with shadow.

#animation #transform #border

Live preview Loaders

Arrow Stream

Three arrows streaming forward in sequence.

#animation #transform #border

Popular tags