Extruded Image Card

Image card with hover extrusion motion

About this component An interactive image card component featuring a smooth hover-based extrusion effect with gradient depth. Designed to feel tactile and intentional, while remaining flexible and easy to customize. Features Hover-based extrusion interaction Gradient depth with 1–4 customizable colors Adjustable extrusion depth, direction, and offset for subtle refinement Image fit options: Cover, Contain, Fill Image card corner radius control Optional name and title Name and title alignment control Text reveal modes: Always, Staggered, Together Text shadow and color controls Image scale on hover Extrusion animation timing and easing controls Disable extrusion interaction on mobile Made for “Meet the Team” sections on corporate or startup websites. Speaker or guest lineups for conferences and events. Portfolios or agency sites to showcase collaborators or clients. Product landing pages or presentations require an interactive profile display.

Image card with hover extrusion motion