Extruded Image Card

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.