Card 3D
Add perspective and interactive depth to a card.
Preview
Import
import { Card3D } from "@sigil-ui/components";Usage
<Card3D>
<div className="p-6">3D Card</div>
</Card3D>Props
| Prop | Type | Default | Description |
|---|---|---|---|
maxTilt | number | 15 | Maximum tilt angle in degrees. |
scale | number | 1.02 | Scale factor on hover. |
speed | number | 400 | Transition speed in ms. |
Token integration
| CSS Variable | Purpose |
|---|---|
--s-card-radius | Card radius |
--s-border | Border |
--s-surface | Surface |
--s-shadow-md | Shadow md |