#transform CSS effects

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

Live preview Tooltips

Star Grow Clip

Star-shaped tooltip that grows from a point above the trigger.

#hover #transform

Live preview Tooltips

Triangle Clip Bottom

Triangle-shaped tooltip pointer below the trigger.

#hover #transform

Live preview Tooltips

Triangle Clip Left

Triangle-shaped tooltip pointer to the left of the trigger.

#hover #transform

Live preview Tooltips

Triangle Clip Right

Triangle-shaped tooltip pointer to the right of the trigger.

#hover #transform

Live preview Tooltips

Triangle Clip Top

Triangle-shaped tooltip pointer above the trigger.

#hover #transform

Live preview Tooltips

Wave Edge Clip

Tooltip with a wavy bottom edge clip-path.

#hover #gradient #transform

Live preview Tooltips

Wedge Bottom Clip

Tooltip with a wedge-shaped bottom edge clip-path.

#hover #transform

Live preview Tooltips

Wedge Left Clip

Tooltip with a wedge-shaped left edge clip-path.

#hover #transform

Live preview Tooltips

Wedge Right Clip

Tooltip with a wedge-shaped right edge clip-path.

#hover #transform

Live preview Tooltips

Wedge Top Clip

Tooltip with a wedge-shaped top edge clip-path.

#hover #transform

Live preview Tooltips

Zigzag Edge Clip

Tooltip with a zigzag bottom edge clip-path.

#hover #transform

Live preview Tooltips

Clock Live

Clock display tooltip above the trigger.

#hover #animation #transform

Live preview Tooltips

CMD Prompt

Windows CMD prompt style tooltip above the trigger.

#hover #transform #shadow

Live preview Tooltips

Coach Mark

Coach mark tooltip pointing to a feature 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

Code Snippet

Tooltip with code snippet preview above the trigger.

#hover #transform #border

Live preview Tooltips

Code Syntax

Tooltip with syntax-highlighted code above the trigger.

#hover #transform #border

Live preview Tooltips

Comet Tail

Comet tail tooltip with trailing gradient streak.

#hover #gradient #transform

Live preview Tooltips

Commit Hash

Git commit hash tooltip above the trigger.

#hover #transform #border

Live preview Tooltips

Concrete Texture

Raw concrete texture tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Constellation

Tooltip with starry constellation above the trigger.

#hover #gradient #transform

Live preview Tooltips

Coral Sunset Pink

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

#hover #gradient #transform

Live preview Tooltips

Coral Warm

Warm coral tooltip with soft gradient above the trigger.

#hover #gradient #transform

Live preview Tooltips

Corner Bracket Bottom-Left

Tooltip with L-shaped corner brackets at the bottom-left.

#hover #transform #border

Live preview Tooltips

Corner Bracket Bottom-Right

Tooltip with L-shaped corner brackets at the bottom-right.

#hover #transform #border

Live preview Tooltips

Corner Bracket Top-Left

Tooltip with L-shaped corner brackets at the top-left.

#hover #transform #border

Live preview Tooltips

Corner Bracket Top-Right

Tooltip with L-shaped corner brackets at the top-right.

#hover #transform #border

Live preview Tooltips

Corners Bracket

Tooltip with corner brackets drawing in above the trigger.

#hover #transform #border

Live preview Tooltips

Cosmic Nebula

Cosmic nebula tooltip with swirling purple-blue star clouds.

#hover #gradient #transform

Live preview Tooltips

Cotton Candy

Pink cotton candy tooltip with sweet gradient above the trigger.

#hover #gradient #transform

Live preview Tooltips

Counter Rotate 3D

Tooltip that counter-rotates in 3D from opposite angles.

#hover #transform #border

Live preview Tooltips

Counter Up

Tooltip that counts up when shown above the trigger.

#hover #transform #border

Live preview Tooltips

Coupon Edge

Tooltip styled like a coupon with notched edges.

#hover #transform

Live preview Tooltips

Perforated Coupon

Tooltip styled like a perforated coupon with dashed divider.

#hover #gradient #transform

Live preview Tooltips

Crayon Texture

Crayon-waxy texture tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Cream Vanilla

Light cream tooltip with a soft vanilla-tinted background.

#hover #transform #shadow

Live preview Tooltips

Crimson Velvet

Deep crimson tooltip with a gold border accent above the trigger.

#hover #gradient #transform

Live preview Tooltips

Crinkle Paper

Crinkled paper texture tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Cross Hatch Background

Tooltip with a cross-hatched diagonal line background pattern.

#hover #gradient #transform

Live preview Tooltips

Crystal Spark

Crystal-like sparkling tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Cube Rotate

Tooltip rotates like a cube face above the trigger.

#hover #transform #border

Live preview Tooltips

Cube Rotate Left

Tooltip rotates in like a cube unfolding from the left.

#hover #transform #border

Live preview Tooltips

Cube Rotate Right

Tooltip rotates in like a cube unfolding from the right.

#hover #transform #border

Live preview Tooltips

Cursor Follow

Tooltip that follows the cursor above the trigger.

#hover #animation #transform

Live preview Tooltips

Cursor Spotlight

Tooltip with a radial spotlight mask highlighting the text.

#hover #gradient #transform

Live preview Tooltips

Cursor Trail Follow

Tooltip that smoothly follows the cursor with a delayed trail.

#hover #transform

Live preview Tooltips

Cursor Zoom

Tooltip that zooms in from a tiny dot at cursor position.

#hover #transform #border

Live preview Tooltips

Curtain Down

Tooltip reveals like a curtain dropping from above.

#hover #transform #border

Live preview Tooltips

Curtain Left

Tooltip reveals like a curtain opening to the left.

#hover #transform #border

Live preview Tooltips

Curtain Right

Tooltip reveals like a curtain opening to the right.

#hover #transform #border

Live preview Tooltips

Curtain Up

Tooltip reveals like a curtain rising above the trigger.

#hover #transform #border

Live preview Tooltips

Curve Path

Tooltip curves along a path into view above the trigger.

#hover #transform #border

Live preview Tooltips

Cyan Cyber

Cyberpunk cyan tooltip with neon glow above the trigger.

#hover #transform #shadow

Live preview Tooltips

Cyber Grid

Cyberpunk grid pattern tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Dark Top

Pure dark tooltip with sharp corners above the trigger.

#hover #transform #border

Live preview Tooltips

Dashed Border Bottom

Tooltip with a dashed border below the trigger.

#hover #transform #border

Live preview Tooltips

Dashed Border Left

Tooltip with a dashed border on the left side.

#hover #transform #border

Live preview Tooltips

Dashed Border Right

Tooltip with a dashed border on the right side.

#hover #transform #border

Live preview Tooltips

Dashed Border Top

Tooltip with a dashed border above the trigger.

#hover #transform #border

Live preview Tooltips

Date Picker

Date picker style tooltip above the trigger.

#hover #transform #shadow

Live preview Tooltips

Debug Info

Debug info style tooltip with values above the trigger.

#hover #transform #border

Live preview Tooltips

Deep Teal Pool

Teal tooltip with a subtle aqua gradient pool effect.

#hover #gradient #transform

Live preview Tooltips

Denim Fabric

Denim fabric texture tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Deploy Info

Deployment info tooltip above the trigger.

#hover #transform #shadow

Live preview Tooltips

Desert Dune

Sandy desert-dune tooltip with warm ochre tones.

#hover #gradient #transform

Live preview Tooltips

Diamond Clip

Tooltip reveals from a diamond shape above the trigger.

#hover #transform #border

Live preview Tooltips

Diamond Clip Left

Tooltip reveals via a diamond-shaped clip from the left.

#hover #transform #border

Live preview Tooltips

Diamond Clip Right

Tooltip reveals via a diamond-shaped clip from the right.

#hover #transform #border

Live preview Tooltips

Diamond Shine

Diamond-like sparkling tooltip above the trigger.

#hover #animation #gradient

Live preview Tooltips

Diploma Ribbon

Diploma tooltip with ribbon-tied parchment styling.

#hover #gradient #transform

Live preview Tooltips

Discount Tag

Discount tag tooltip with percentage above the trigger.

#hover #transform #shadow

Live preview Tooltips

Door Close

Tooltip opens like a door swinging down from the top.

#hover #transform #border

Live preview Tooltips

Door Left

Tooltip opens like a door hinged on the right side.

#hover #transform #border

Live preview Tooltips

Door Open

Tooltip swings open like a door above the trigger.

#hover #transform #border

Live preview Tooltips

Door Right

Tooltip opens like a door hinged on the left side.

#hover #transform #border

Live preview Tooltips

Dot Pattern Background

Tooltip with a dotted polka background pattern.

#hover #gradient #transform

Live preview Tooltips

Dotted Border Bottom

Tooltip with a dotted border below the trigger.

#hover #transform #border

Live preview Tooltips

Dotted Border Left

Tooltip with a dotted border on the left side.

#hover #transform #border

Live preview Tooltips

Dotted Border Right

Tooltip with a dotted border on the right side.

#hover #transform #border

Live preview Tooltips

Dotted Border Top

Tooltip with a dotted border above the trigger.

#hover #transform #border

Live preview Tooltips

Double Border Left

Tooltip with a double border on the left side.

#hover #transform #border

Live preview Tooltips

Double Border Right

Tooltip with a double border on the right side.

#hover #transform #border

Live preview Tooltips

Double Frame Bottom

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

#hover #transform #shadow

Live preview Tooltips

Double Frame Left

Tooltip with an outer double-frame border on the left.

#hover #transform #shadow

Live preview Tooltips

Double Frame Right

Tooltip with an outer double-frame border on the right.

#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

Draw Border Top

Tooltip border draws itself in above the trigger.

#hover #transform #border

Live preview Tooltips

Drop Down Top

Tooltip drops down from above with a gravity feel.

#hover #transform #border

Live preview Tooltips

Easter Egg

Colorful Easter egg tooltip with striped pattern.

#hover #gradient #transform

Live preview Tooltips

Elastic Bottom

Tooltip snaps in with an elastic overshoot below the trigger.

#hover #transform #border

Live preview Tooltips

Elastic Snap

Tooltip that snaps in with elastic bounce easing.

#hover #transform #border

Live preview Tooltips

Elastic Top

Tooltip snaps in with an elastic overshoot above the trigger.

#hover #transform #border

Live preview Tooltips

Electric Blue

Electric blue tooltip with bright glow above the trigger.

#hover #transform #shadow

Live preview Tooltips

Emerald Green

Emerald green gem tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Emerald Tip

Emerald green tooltip with subtle shimmer above the trigger.

#hover #gradient #transform

Live preview Tooltips

Error Stack

Error stack trace style tooltip above the trigger.

#hover #transform #shadow

Popular tags