Team Cards with Grayscale to Color Photo Hover
Pure CSS team section where grayscale portraits turn to full color, zoom in slightly and reveal social links on hover or keyboard focus.
Tag: hover-effect
Components tagged with "hover-effect".
11 component(s)
Custom Cursor Follower
Smooth custom cursor with a dot and an eased ring that grows on links, shows a label over cards and inverts the headline, in CSS and vanilla JS.
Link Underline Effects
Six animated link underline styles in pure CSS (slide, center, highlighter, ink fill, line swap and wave) that also work on links that wrap.
Feature Cards with Hover Glow
Dark pure CSS feature grid whose card borders and backgrounds light up with a colored glow that follows the mouse pointer.
Icon Sidebar that Expands on Hover
Pure CSS icon rail that widens to reveal labels, section headings and a profile on hover or keyboard focus, with an active link and badge.
Image Hover Effects
Six pure CSS image hover effects with captions: zoom, grayscale to color, sliding panel, tilt, blur and frame, also revealed by keyboard focus.
Pricing Cards with Hover
Three pure CSS pricing cards with hover lift and a featured plan that has a spinning conic-gradient border, glow and Most popular badge.
Product Card with Quick Actions
Responsive product card grid where hover or focus reveals wishlist, quick view and add-to-cart actions, with star ratings and a native quick view dialog.
Masonry Image Gallery
Pure CSS masonry image gallery using multi-column layout, with hover and focus captions that slide up over each photo. No JavaScript needed.
Cards with Hover Lift
Pure CSS blog card grid where each card lifts with a deeper shadow and zooms its image on hover or keyboard focus.
3D Flip Card
Three pure CSS 3D flip cards that turn on hover, keyboard focus or tap to reveal details and a link on the back.