FloatingCard3D
A flat card floating in 3D space that tilts toward the cursor with spring smoothing. The surface uses --background with --border edges. Overlay real H
A flat card floating in 3D space that tilts toward the cursor with spring smoothing. The surface uses --background with --border edges. Overlay real HTML via drei <Html>.
Customize
Props
| Prop | Type | Default | Description |
|---|---|---|---|
tiltStrength | number | 15 | Max tilt in degrees. |
children | ReactNode | — | HTML overlaid on the card via drei <Html>. |
className | string | — | Classes for the wrapper element (set its height here). |
theme | "auto" | "light" | "dark" | "auto" | Color source. auto reads the live shadcn theme. |
tiltStrengthnumberMax tilt in degrees.
15childrenReactNodeHTML overlaid on the card via drei <Html>.
—classNamestringClasses for the wrapper element (set its height here).
—theme"auto" | "light" | "dark"Color source. auto reads the live shadcn theme.
"auto"ProductViewer
A polished rounded volume with orbit controls. Hovering slows the auto-rotation. The material picks up --primary as an emissive tint.
Text3D
Extruded, slowly floating 3D text rendered with drei <Text3D>, colored with --primary. Defaults to a typeface served from the jsDelivr npm mirror; pas