React Card and Bento Grid Components

A 3D perspective tilt card — the card tilts with the cursor, a glare sweeps across its surface, it springs back on leave, and content can float up with translateZ.

A horizontally squeezing expand gallery — panels change their share of the space on hover or keyboard focus, while the rest collapse and dim.

A bento-box grid layout — cards reveal with a stagger, and on hover the focused card lifts while the rest dim slightly.

An interactive card that leaves a trail of fading image afterimages along the cursor's path, with in-place fade and drift variants.

A hover card whose overlay slides in from the side the cursor entered, with cover and push variants.

Click a card to morph it seamlessly into a centered detail panel via shared layout; only one card in a group is expanded at a time.

A draggable stacked card deck — flick a card out in any of four directions, the next one fills in automatically, with infinite loop or draw-until-empty modes.

A cursor spotlight card — a border glow and a fainter background bloom track the cursor together and fade out on leave, with each card in a row staying independent.

An infinitely pannable portfolio canvas that scatters cards across a boundless space, with drag (including momentum), keyboard panning, and one-click recentering.

A 3D flip card that rotates around the X or Y axis to reveal its front and back, supporting hover, click, and fully controlled use.

A card that reveals encrypted noise and a gradient on hover.

A card grid effect where hovering focuses one card while the rest blur and fade out.

A highlight background that slides to the card under the cursor on hover.

A glowing beam that travels around a container's border, used to highlight a card, a pricing plan, or the currently selected item.

A jittering electric-current border that glows, distorting its stroke with SVG noise displacement so the energy bleeds outward from the outline.

A card with a glowing neon gradient border, its edge flowing with a rotating conic gradient that bleeds outward as a halo.

Cards swap positions and stacking order with layout animation, the front card arcing around to the back to form a 3D deck that breathes.

A card that reveals its content through a pixel dissolve

An ID badge on a lanyard that swings in 3D with momentum — drag it, let go, and it settles naturally like a pendulum.

A card displaying a tweet (avatar / handle / content) with a reveal animation and interactive like and repost actions.

A glassmorphic surface with live distortion, refraction, specular highlights, and pointer tilt.

A responsive masonry layout with animated reflow, cards gliding into place as the column count and the data change.

A grayscale card grid that regains color locally under a spotlight as the cursor passes over it.

A gradient 3D product pin that unfolds on hover — the card leans back to expose a floating capsule label and a radar-ripple beam.

A ring of icons or avatars circling a round orbit, stackable into multiple orbits with reverse directions and different speeds.

An interactive 3D tag / icon sphere cloud that spins on its own and can be dragged to rotate.

A 3D image gallery projected as a ring / hemisphere that can be dragged to rotate, auto-rotates, and keeps its momentum.

A three.js-style 3D model orbit viewer

A tilted 3D grid marquee wall, with multiple columns scrolling infinitely in alternating directions.

A rainbow holographic-sheen card that shifts with the cursor angle, with 3D tilt.

A ticket card with a perforated dotted line and side notches; click to tear off the stub.

A corner peels up like a sticker on hover to expose what is underneath, and can be dragged off entirely.

A wall of Polaroid photos scattered at random angles that straighten and lift on hover.

Drag to tear the paper open and expose the content beneath, with a jagged tear edge and paper confetti.

A postage-stamp frame React component whose scalloped perforations are computed with a pure CSS clip-path; wraps an image or any content, with a caption row and an optional SVG postmark overlay that fades in on hover.

A foil finish that wraps any content: five gradient layers with blend modes shift their sheen with scroll progress and pointer position, without any tilt.

A pixel-art UI trio — a stepped-border card, a pixel button that sinks on press, and a block-by-block progress bar, all drawn with box-shadow and CSS.