component
Info Cards 3D
By Aidan Looker
Details
- Aidan LookerAuthor
- componentType
- $9.00Price
- 2026-05-12Published
- 2026-06-13Updated
- 2026-05-02Added
- CardsCategories
Summary
What is Info Cards 3D?
Description
What is Info Cards 3D? Info Cards 3D is a configurable grid of interactive service cards built for showcasing offerings, features, or capabilities on any Framer site. Each card features a 3D flip interaction triggered by a dedicated button, a cursor-tracked radial colour reveal on hover, and staggered back-face content animations. Ideal for agency service pages, SaaS feature sections, portfolio highlights, and product overviews. Core Features 3D Y-axis card flip with spring physics, triggered by a dedicated plus/close button Cursor-tracked radial circle reveal that expands from the exact hover entry point Staggered back-face content animation with title, description, and slide-fill CTA button 30 built-in line-art icons plus custom image upload support for complete brand flexibility Floating icon animation with decorative sparkle accents on the front face Responsive grid layout with configurable columns (1-6), gap, and left/center/right alignment Controls inside Framer Cards Icon — choose from 30 presets or upload a custom image Title — front-face heading text Description — back-face body copy Button Text — CTA label on the back face Button Link — native Framer link picker with full page/URL/section support Layout Columns — 1 to 6 column grid Gap — spacing between cards Alignment — left, center, or right positioning Colors Card Background — front-face fill colour Hover / Back Background — radial reveal and back-face colour Icon — icon stroke colour Text — front-face text colour Accent — hover text, back-face text, and CTA colour Card Style Corner Radius — card border radius Padding — internal card spacing Animation Flip Speed — slow, medium, or fast spring timing Hover Transition — speed of text colour inversion on hover Stagger Content — toggle staggered back-face content entrance Typography Font — custom font family and weight via Framer font picker Best use cases Agency and studio service pages with 3-6 core offerings SaaS and product feature grids that need interactive depth Portfolio or capability showcases requiring visual engagement Landing page sections where hover interaction drives exploration Each card is self-contained with its own flip state, hover tracking, and animation. Questions or custom requests? We design and build custom Framer components. Get in touch at contact@teampixel.com.au .
Introduction
3D flip cards with hover effects.
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #3730