component
Glare Card
By Ahmet Loca
Details
- Ahmet LocaAuthor
- componentType
- 2026-05-29Published
- 2026-07-27Updated
- 2026-05-15Added
- CardsCategories
Summary
Glare Card is a 3D hover card component for Framer with cursor-reactive tilt animation and multi-style glare effects.
Description
MORE FRAMER COMPONENTS LIKE THIS ✦ Browse +38 FREE + 85 premium components: https://frameze.com/components ✦ Card Bundle: https://frameze.com/components/category/card?ref=bundles GlareCard — 3D Tilt Card with Dynamic Glare Effect Glare Card is a 3D hover card component for Framer with cursor-reactive tilt animation and multi-style glare effects. The card responds to mouse movement with smooth spring-based 3D rotation, creating a realistic depth illusion that makes your UI feel physical and interactive. At the core is a real-time tilt system that rotates the card along both X and Y axes based on cursor position — giving the impression that light and perspective are reacting to the user in real time. GlareCard includes three distinct glare modes, each creating a completely different visual atmosphere. Diamond mode generates sharp facet-like light spikes that radiate from the cursor, simulating the prismatic reflections of a cut gemstone. Holographic mode produces smooth hue-shifting color sweeps that change based on cursor angle, recreating the iridescent effect of a holographic foil card. Aurora mode creates soft flowing waves of purple, teal, and green light across the card surface, evoking the organic movement of the northern lights. _______________________________________________________________ Donation: https://ahmetloca.dub.link/donation if it saves you time, a small tip is always appreciated. _______________________________________________________________ Key Features Interactive 3D tilt card animation with spring physics Three glare styles: Diamond, Holographic, Aurora Cursor-reactive conic gradient overlay effects Real-time light direction and glare simulation Optional title and subtitle text layer Fully customizable background image High performance CSS-based rendering — no external dependencies Best For Product showcase cards Portfolio project previews Creative agency websites NFT and digital art galleries Landing page hero cards
Introduction
3D Tilt Card with Glare Effect
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #4262