The Vibeary — tag
hover
14 resources in The Vibeary tagged "hover" — tools, libraries and references pulled from across the library's shelves, each one checked by hand before it was added.
Gems in this collection
Hover.css
Collection of CSS3 hover effects — 2D transitions, background sweeps, icons, curls, speech bubbles — in CSS, Sass and LESS.
Hover3D.js
Minimal 3D hover effect that tilts an element and shifts inner layers based on cursor position, aimed at product cards.
hover-effect
WebGL library that displaces and blends two images on hover using a grayscale displacement map for liquid reveals.
Atropos
Touch-friendly 3D parallax hover component that separates layers by depth, with vanilla, React, Vue and Svelte builds.
pokemon-cards-css
Advanced CSS recreations of holographic, foil, galaxy and reverse-holo trading card finishes driven by pointer position.
webgl-mouseover-effects
Demo repository implementing interactive WebGL hover distortions on images driven by mouse velocity and displacement maps.
direction-reveal
Detects which edge the cursor entered or left an element from and reveals overlay content from that direction.
DistortedLinkEffects
Decorative link hover distortions built with SVG turbulence and displacement filters rather than canvas or WebGL.
puffin.js
Image hover library that reveals a second image through an animated organic mask following the cursor.
Tilt.js
Sub-4KB parallax tilt hover effect with glare, gyroscope support and per-axis limits, driven by data attributes.
btns
Collection of buttons with unusual hover effects, each implemented as isolated copy-paste HTML and CSS.
CSS Button Library
99 button hover effects in pure CSS with no JavaScript or dependencies; each snippet uses one colour token and respects prefers-reduced-motion.
RepetitionHoverEffect
Demo and source for a hover effect that stacks and scales repeated image layers with staggered motion.
Drift
Zoom-on-hover for product images with a detached pane, inline mode and no dependencies.