LibraryCSSÜcretsiz Saf CSS Efekt Kütüphanesi

İpuçları — 600 Ücretsiz CSS Efekti

Balon ipuçları, açılır bilgi kutuları ve oklar.

Tümü saf CSS — kütüphane, derleme adımı veya JavaScript gerekmez. Kodu kopyalamak ve tarayıcı içi editörde denemek için ücretsiz üyelik yeterli.

Canlı incele Tooltips

3D Cube Spin

Tooltip that spins in 3D like a tumbling cube above the trigger.

#hover #transform #border

Canlı incele Tooltips

3D Fold Origami

Tooltip that unfolds in 3D like an origami paper fold.

#hover #transform #border

Canlı incele Tooltips

Curve Arrow Top

Tooltip with a curved swooping connector above the trigger.

#hover #transform #border

Canlı incele Tooltips

Mono Dark

Monospace dark tooltip with terminal feel above the trigger.

#hover #transform #border

Canlı incele Tooltips

Pulse Throb

Tooltip that throbs with a gentle pulse animation on hover.

#hover #animation #transform

Canlı incele Tooltips

Rotate Left

Tooltip rotates in from the left with a spin animation.

#hover #transform #border

Canlı incele Tooltips

3D Perspective Zoom

Tooltip that zooms in with a 3D perspective tilt effect.

#hover #transform #border

Canlı incele Tooltips

3D Popout

Tooltip that pops out toward the viewer in 3D perspective.

#hover #transform #border

Canlı incele Tooltips

3D Rotate X

Tooltip that rotates fully on the X axis to appear above the trigger.

#hover #transform #border

Canlı incele Tooltips

3D Rotate Y

Tooltip that rotates fully on the Y axis to appear above the trigger.

#hover #transform #border

Canlı incele Tooltips

3D Tilt X

Tooltip that tilts on the X axis as it appears above the trigger.

#hover #transform #border

Canlı incele Tooltips

3D Tilt Y

Tooltip that tilts on the Y axis as it appears above the trigger.

#hover #transform #border

Canlı incele Tooltips

3D Top

Tooltip with 3D depth shadow above the trigger.

#hover #transform #shadow

Canlı incele Tooltips

Alien UFO

Alien UFO tooltip with saucer-shape clip-path.

#hover #gradient #transform

Canlı incele Tooltips

Amber Warning

Amber warning tooltip with attention glow above the trigger.

#hover #transform #shadow

Canlı incele Tooltips

Amethyst Purple

Amethyst purple gem tooltip above the trigger.

#hover #gradient #transform

Canlı incele Tooltips

Chevron Arrow

Tooltip with chevron-style arrow pointing to trigger.

#hover #transform #border

Canlı incele Tooltips

Arrow Clip

Tooltip reveals with an arrow clip-path above the trigger.

#hover #transform #border

Canlı incele Tooltips

Cross Arrow Bottom

Tooltip with a plus-shaped cross indicator pointing up.

#hover #transform

Canlı incele Tooltips

Cross Arrow Top

Tooltip with a plus-shaped cross indicator pointing down.

#hover #transform

Canlı incele Tooltips

Dashed Arrow Bottom

Tooltip below the trigger connected by a dashed line with arrow.

#hover #transform #border

Canlı incele Tooltips

Dashed Arrow Left

Tooltip to the left of the trigger with a dashed connector.

#hover #transform #border

Canlı incele Tooltips

Dashed Arrow Right

Tooltip to the right of the trigger with a dashed connector.

#hover #transform #border

Canlı incele Tooltips

Dashed Arrow Top

Tooltip connected to the trigger by a dashed line with arrow.

#hover #transform #border

Canlı incele Tooltips

Diamond Arrow Bottom

Tooltip with a diamond-shaped pointer pointing up.

#hover #transform

Canlı incele Tooltips

Diamond Arrow Left

Tooltip with a diamond-shaped pointer on the left side.

#hover #transform

Canlı incele Tooltips

Diamond Arrow Right

Tooltip with a diamond-shaped pointer on the right side.

#hover #transform

Canlı incele Tooltips

Diamond Arrow Top

Tooltip with a diamond-shaped pointer pointing down.

#hover #transform

Canlı incele Tooltips

Dot Arrow

Tooltip connected by a small dot above the trigger.

#hover #transform

Canlı incele Tooltips

Dot Pulse Arrow

Tooltip with a pulsing dot indicator above the trigger.

#hover #animation #transform

Canlı incele Tooltips

Double Arrow Bottom

Tooltip with stacked double-chevron arrow pointing up.

#hover #transform #border

Canlı incele Tooltips

Double Arrow Left

Tooltip with stacked double-chevron arrow pointing right.

#hover #transform #border

Canlı incele Tooltips

Double Arrow Right

Tooltip with stacked double-chevron arrow pointing left.

#hover #transform #border

Canlı incele Tooltips

Double Arrow Top

Tooltip with a stacked double-chevron arrow pointing down.

#hover #transform #border

Canlı incele Tooltips

Heart Arrow Bottom

Tooltip with a heart-shaped pointer below the trigger.

#hover #transform

Canlı incele Tooltips

Heart Arrow Top

Tooltip with a heart-shaped pointer above the trigger.

#hover #transform

Canlı incele Tooltips

Line Arrow

Tooltip connected by a thin line above the trigger.

#hover #transform

Canlı incele Tooltips

Line Horizontal Arrow

Tooltip connected by a solid horizontal line indicator on the right.

#hover #transform

Canlı incele Tooltips

Line Vertical Arrow

Tooltip connected by a solid vertical line indicator above.

#hover #transform

Canlı incele Tooltips

No Arrow

Clean tooltip without any arrow above the trigger.

#hover #transform

Canlı incele Tooltips

Rounded Arrow Bottom

Tooltip with a rounded pill-shaped arrow nub pointing up.

#hover #transform

Canlı incele Tooltips

Rounded Arrow Left

Tooltip with rounded pill-shaped arrow nub on the left side.

#hover #transform

Canlı incele Tooltips

Rounded Arrow Right

Tooltip with rounded pill-shaped arrow nub on the right side.

#hover #transform

Canlı incele Tooltips

Rounded Arrow Top

Tooltip with a rounded pill-shaped arrow nub pointing down.

#hover #transform

Canlı incele Tooltips

Square Arrow Bottom

Tooltip with a sharp square-cut arrow pointing up.

#hover #transform

Canlı incele Tooltips

Square Arrow Left

Tooltip with a sharp square-cut arrow pointing right.

#hover #transform

Canlı incele Tooltips

Square Arrow Right

Tooltip with a sharp square-cut arrow pointing left.

#hover #transform

Canlı incele Tooltips

Square Arrow Top

Tooltip with a sharp square-cut arrow pointing down.

#hover #transform

Canlı incele Tooltips

Star Arrow Bottom

Tooltip with a star-shaped pointer below the trigger.

#hover #transform

Canlı incele Tooltips

Star Arrow Top

Tooltip with a star-shaped pointer above the trigger.

#hover #transform

Canlı incele Tooltips

Triangle Arrow Top

Tooltip with prominent triangle arrow above the trigger.

#hover #transform #border

Canlı incele Tooltips

Aurora Borealis

Northern-lights aurora borealis gradient tooltip.

#hover #gradient #transform

Canlı incele Tooltips

Aurora Tip

Aurora borealis gradient tooltip above the trigger.

#hover #animation #gradient

Canlı incele Tooltips

Autumn Leaf

Warm autumn-leaf tooltip in fall colors.

#hover #gradient #transform

Canlı incele Tooltips

Badge Count

Tooltip with notification badge count above the trigger.

#hover #transform #border

Canlı incele Tooltips

Bash Shell

Bash shell style tooltip above the trigger.

#hover #transform #shadow

Canlı incele Tooltips

BG Aurora

Tooltip with aurora gradient background above the trigger.

#hover #animation #gradient

Canlı incele Tooltips

BG Conic

Tooltip with a conic gradient spin above the trigger.

#hover #animation #gradient

Canlı incele Tooltips

BG Dots

Tooltip with dotted pattern background above the trigger.

#hover #gradient #transform

Canlı incele Tooltips

BG Fill

Tooltip background fills up from below above the trigger.

#hover #gradient #transform

Canlı incele Tooltips

BG Gradient Anim

Tooltip with animated gradient background above the trigger.

#hover #animation #gradient

Canlı incele Tooltips

BG Grid

Tooltip with grid pattern background above the trigger.

#hover #gradient #transform

Canlı incele Tooltips

BG Mesh

Tooltip with mesh gradient background above the trigger.

#hover #gradient #transform

Canlı incele Tooltips

BG Noise

Tooltip with subtle noise texture above the trigger.

#hover #transform #border

Canlı incele Tooltips

BG Plasma

Tooltip with plasma gradient background above the trigger.

#hover #gradient #transform

Canlı incele Tooltips

BG Radial

Tooltip background radiates from center above the trigger.

#hover #gradient #transform

Canlı incele Tooltips

BG Stripes

Tooltip with diagonal stripes pattern above the trigger.

#hover #gradient #transform

Canlı incele Tooltips

BG Sweep

Tooltip with a sweeping background gradient above the trigger.

#hover #gradient #transform

Canlı incele Tooltips

Birthday Cake

Birthday cake tooltip with candle glow above the trigger.

#hover #gradient #transform

Canlı incele Tooltips

Black Hole Vortex

Black hole vortex tooltip with deep dark center glow.

#hover #gradient #transform

Canlı incele Tooltips

Blinds Open

Tooltip reveals like venetian blinds opening above the trigger.

#hover #transform #border

Canlı incele Tooltips

Blinds Vertical

Tooltip reveals like vertical window blinds opening.

#hover #gradient #transform

Canlı incele Tooltips

Blue Info

Blue info tooltip with subtle glow above the trigger.

#hover #transform #shadow

Canlı incele Tooltips

Blur In

Tooltip sharpens from a blur into view above the trigger.

#hover #transform #border

Canlı incele Tooltips

Blush Rose

Soft blush-pink tooltip with a gentle rose glow.

#hover #transform #shadow

Canlı incele Tooltips

Book Page

Book page tooltip with double-page book styling.

#hover #transform #shadow

Canlı incele Tooltips

Border Beam

Tooltip with animated beam border above the trigger.

#hover #animation #gradient

Canlı incele Tooltips

Bottom Left Corner

Tooltip appears at the bottom-left corner of the trigger.

#hover #transform #border

Canlı incele Tooltips

Bottom Right Corner

Tooltip appears at the bottom-right corner of the trigger.

#hover #transform #border

Canlı incele Tooltips

Bounce Bottom

Tooltip bounces up from below the trigger.

#hover #transform #border

Canlı incele Tooltips

Bounce Left

Tooltip bounces in from the left with an overshoot easing.

#hover #transform #border

Canlı incele Tooltips

Bounce Loading

Bouncing dots loading tooltip above the trigger.

#hover #animation #transform

Canlı incele Tooltips

Bounce Right

Tooltip bounces in from the right side of the trigger.

#hover #transform #border

Canlı incele Tooltips

Bounce Top

Tooltip bounces down on hover above the trigger.

#hover #transform #border

Canlı incele Tooltips

Branch Name

Git branch name tooltip above the trigger.

#hover #transform #border

Canlı incele Tooltips

Bronze Rust

Bronze rust tooltip with warm earthy tones above the trigger.

#hover #gradient #transform

Canlı incele Tooltips

Brutalist Top

Bold brutalist tooltip with hard shadow above the trigger.

#hover #transform #shadow

Canlı incele Tooltips

Build Status

Build status badge tooltip above the trigger.

#hover #transform #border

Canlı incele Tooltips

Burnt Orange Glow

Warm burnt orange tooltip with a soft ambient glow.

#hover #transform #shadow

Canlı incele Tooltips

Calendar Event

Calendar event tooltip above the trigger.

#hover #transform #shadow

Canlı incele Tooltips

Canvas Paint

Canvas paint texture tooltip above the trigger.

#hover #gradient #transform

Canlı incele Tooltips

Carbon Fiber

Carbon fiber weave texture tooltip above the trigger.

#hover #gradient #transform

Canlı incele Tooltips

Card Hover

Card-like tooltip that lifts up on hover above the trigger.

#hover #gradient #transform

Canlı incele Tooltips

Cardboard Rough

Rough cardboard texture tooltip above the trigger.

#hover #gradient #transform