Tilting Card

A smooth, physics-driven 3D tilt effect that brings components to life with dynamic motion.

3D TiltPhysics-drivenAdjustable depth
Basic
Features

3D Motion

Realistic 3D tilt effect based on cursor position.

Spring Physics

Smooth, organic movement with configurable stiffness.

Depth Control

Adjustable tilt intensity and perspective.

Installation
Works with npm, pnpm, yarn, and bun

$npx libravelui@latest add tilting-card

Anatomy
import { TiltingCard } from "@/components/ui/motion/tilting-card";<TiltingCard><div className="p-6 bg-card rounded-xl border">  Content</div></TiltingCard>
Testing Playground
Props

Loading types…

Edit on GitHub

Particles

An interactive particle system component for building lively, animated visual effects.

Bento Grid

A grid layout component for showcasing features or content in a bento box style.