Pro Objects Suite
Physical 3D live object with cinematic ignition intro, mobile gyroscope orientation, and specular sheen.
On This Page
Pro Objects Suite
LiveObject
Not a static card, but the live product itself. Plays a cinematic ignition intro with radial light streaks and alpha-silhouette RGB glitch. Transforms into a physical interactive object responding to desktop cursor or mobile gyroscope tilt.
npx nexoreui add live-object
Interactive Playground
Cybernetic Smartwatch
Configure Props
Accent Color#38bdf8
Max Tilt Angle30°
Perspective Depth1000px
Usage Examples
1. Cybernetic Smartwatch — Electric Neon
High-tech timepiece with electric blue streaks and synchronized specular surface sheen.
component.tsx
1
2. Aerospace Chronograph — Amber Luster
Warm gold and amber optical reflections gliding across satin-brushed titanium bezels.
component.tsx
1
3. Studio Acoustics — Rose Flame
Lustrous metallic reflections reacting dynamically to cursor and mobile gyroscope motion.
component.tsx
1
4. Carbon Sneaker — Emerald Matrix
High-energy athletic footwear with laser emerald ignition flash and fluid tilt physics.
component.tsx
1
API Reference (Props)
| Prop | Type | Default | Description |
|---|---|---|---|
| src | string | required | Transparent PNG image URL of the object or product silhouette. |
| accentColor | string | "#38bdf8" | Hex or RGB color driving the ignition flash, radial streaks, and RGB silhouette glitch. |
| autoplayIntro | boolean | true | Whether the ignition intro plays automatically upon entering viewport. |
| width | number | string | 440 | Outer stage width in pixels or CSS dimension. |
| height | number | string | 480 | Outer stage height in pixels or CSS dimension. |
| maxTilt | number | 30 | Maximum 3D tilt angle in degrees during cursor tracking or mobile gyroscope orientation. |
| perspective | number | 1000 | CSS 3D perspective distance in pixels for realistic depth. |
| ambientSweep | boolean | true | Subtle diagonal light beam sweep across background every 5-6s during idle state. |
| alt | string | "Live Object" | Accessibility image alt description. |