Tilt Card

A 3D tilt effect card on hover.

npx arupui add tilt-card
Preview

Tilt Card

Move your mouse over this card.

Usage

tilt-card.tsx
import { TiltCard } from "@/components/blocks/tilt-card"

<TiltCard>
  <h3>Content</h3>
</TiltCard>

Props

maxTilt
Type: numberDefault: 15
perspective
Type: numberDefault: 1000
glareEnable
Type: booleanDefault: true
Theme Editor

Theme

Radius0.5rem
Letter Spacing0em

Colors

light