Profile Cards 3D: Premium Interactions Component by Aidan Looker

Profile cards with a cinematic hover reveal and smooth 3D flip animation. Feature team members, creators, or key profiles with five built-in themes, three back-face content types, social link integration, and full typographic control.

What is Profile Cards 3D?

Profile Cards 3D is a premium interactive card component that combines a hover-triggered image reveal with a buttery 3D flip animation. On the front, a profile image expands from an inset frame to full-bleed on hover, revealing name, bio, stats, and a CTA over a cinematic gradient. On the back, display additional info, an image, or an embedded video. Ideal for team pages, creator spotlights, speaker lineups, and portfolio showcases.

Core Features

Hover reveal effect with adaptive gradient overlay and smooth image expansion
3D card flip triggered by click or hover, with configurable speed and easing
Three back-face content modes: rich info panel, full-bleed image, or embedded video (YouTube, Vimeo, direct URL)
Five theme presets — Light, Dark, Midnight, Frost — plus a fully custom palette with eight colour controls
Integrated social links for X, LinkedIn, Instagram, Dribbble, GitHub, and YouTube
Clickable CTA button with Framer Link support
Verified badge, dual stat counters with accessible labels, and independent font controls
Keyboard accessible with ARIA labels and prefers-reduced-motion support

Controls inside Framer

Front Content

Profile photo (responsive image)
Name, role, and bio text
Verified badge toggle
Two configurable stat values with accessible labels
CTA button text and link

Back Content

Back type selector: Image, Video, or Info
Back image upload (responsive image)
Video URL field (YouTube, Vimeo, or direct)
Info panel: title, description, location, website with link, comma-separated skill tags
Six social link fields (X, LinkedIn, Instagram, Dribbble, GitHub, YouTube)

Style

Theme preset: Light, Dark, Midnight, Frost, Custom
Border radius control (0–40px)
Custom colour palette: background, text, secondary, accent, badge, CTA background, CTA text, stat icons

Animation

Flip trigger: Click or Hover
Flip speed (300–1200ms)
Hover reveal speed (200–1000ms)

Typography

Independent font controls for name, bio, stats, and CTA

Default size

376 x 407 px — resizable on canvas.

Best use cases

Team and about pages — present each member with depth beyond a static headshot
Creator and influencer profiles — showcase follower counts, portfolios, and social links in one interactive card
Speaker and event lineups — flip to reveal bios, topics, or intro videos
Portfolio showcases — use the image or video back face to highlight featured work

Profile Cards 3D turns a static headshot grid into an interactive experience that keeps visitors engaged and exploring.