Feature Card Animate

Show Preview
Feature Card Animate

About Feature Card Animate

Features

  • 3D mouse-tracking tilt with perspective rotation on hover

  • Magnetic icons follow the cursor with distance-based falloff

  • Continuous conic-gradient orbit ring rotating behind the icons

  • Spring-eased hover scale on each icon (cubic-bezier overshoot)

  • Five swappable icon slots — drop in any logo or image

  • Bundled default brand icons (fallback when slots are empty)

  • Radial mask fade gracefully reveals the icon stage

  • Five-circle composition with sm / md / lg / md / sm size cadence

  • Hover state with enhanced inset glow and lifted drop shadow

  • Tilt, magnetic, and orbit each individually toggleable

  • All animation strengths, radii, and speeds fully tunable

  • Transform-only animations — no layout shifts

  • Responsive — desktop, tablet, mobile down to 320px

  • No dependencies

Property Controls

Content

  • Title — main heading text below the card

  • Description — supporting subtext

Icons

  • Icon 1 (small) · Icon 2 (medium) · Icon 3 (large) · Icon 4 (medium) · Icon 5 (small)

  • Each accepts a responsive image · falls back to the bundled brand SVG when empty

Tilt

  • 3D Tilt — toggle perspective rotation

  • Tilt Amount (0–20) — peak rotation in degrees