---
title: "Sleek 3D Tilt Card — Free Framer component · Best of Framer"
description: "Free Framer component · by Studio NECTXRZ™ · Cards. Smooth 3D hover with spotlight"
canonical: "https://framer.elliotli.dev/component/sleek-3d-tilt-card"
---

[Home](/)/[Components](/components)/[Cards](/components/category/cards)/Sleek 3D Tilt Card

# Sleek 3D Tilt Card

Smooth 3D hover with spotlight

[View on Framer](https://framer.com/marketplace/components/sleek-3d-tilt-card/?via=elliot-li)

![Sleek 3D Tilt Card preview image 1](https://framer.elliotli.dev/og/component/sleek-3d-tilt-card/8cf0bbb5dc1bd2b9/1600x1200.jpg)

## Summary

Smooth 3D hover with spotlight

## Description

**Sleek Tilt Card is a premium 3D tilt panel for Framer.**

Subtle tilt with tuned spring dynamics, smooth ambient spotlight, and absolute zero performance drag. Drop it in, customize the theme, and instantly elevate your layout.

**Interaction and motion**

-   **3D Hover Tilt:** The card tilts fluidly following your cursor using custom physics (mass 0.8 / stiffness 180) for a heavy, premium tactile feel.
    
-   **Ambient Spotlight:** A subtle radial gradient automatically tracks the pointer, adding dynamic depth.
    
-   **Mobile Touch Isolation:** Disables pointer tilt on touch displays to perfectly preserve native page scrolling.
    
-   **SSR & Canvas Safe (Static Isolation):** Architected with strict static/dynamic separation. Zero editor lag on the canvas, full 3D depth in production.
    

**Design & Features**

-   **Smart Theming System:** Instant Dark, Light, or Custom brand color presets.
    
-   **Adjustable Shadow Intensity:** Fine-tune shadow depth from subtle ambient elevation to dramatic 3D presence (0–100% slider).
    
-   **Fluid & Responsive:** Drops seamlessly into any Stack or Grid layout and auto-scales.
    
-   **High-Fidelity Accents:** Optional tags, spotlight glow, and animated arrow micro-interactions on hover.
    

**Customization controls**

Use the component controls to customize Theme mode, Card background, Border color, Accent & Text colors, Spotlight glow, 3D tilt power, Corner radius, Shadow intensity (0–100%), and content visibility (tags/arrows).

**Best for**

Use Sleek Tilt Card for SaaS landing pages, pricing tables, feature highlights, portfolio showcases, and any modern digital product that needs premium micro-interactions with minimal configuration.

## Rank history [How rankings work →](/terms#rankings)

-   All · #1470

## Details

- **Author**: Studio NECTXRZ™
- **Published**: 2026-09-08
- **Updated**: 2026-10-12
- **Added**: 2026-09-08
- **Categories**: Cards

## More like this

-   [Particle Team Cards](/component/particle-team-cards) — Frame Native · Free — Portraits that move as particles
-   [Card Swap](/component/card-swap) — Antoine Lacombled · $9 — A 3D card stack you can fling
-   [Overlay Reveal Card](/component/overlay-reveal-card) — Pentaclay · Free — Project Card With Hover Overlay
-   [Deckshift](/component/deckshift) — BeyondPixel · $15 — Interactive Stacked Focus Cards
