Hero 260 - Isometric layered screenshot stackPro
Split hero with three screenshots laid flat in isometric 3D that lift apart into labelled layers on load and spread further on hover.
About Hero 260
Split hero with three screenshots laid flat in isometric 3D that lift apart into labelled layers on load and spread further on hover.
Hero 260 is a hero block for React and Tailwind CSS, included in Chocolate UI Pro with motion animations that respect reduced-motion settings. It ships as 101 lines of TypeScript you own: every piece of copy is a prop with a sensible default, so you can drop it in and replace the content without touching the layout.
- 3d
- isometric
- perspective
- layers
- screenshots
- split
Installation
- Set up your project with
npx chocolateui initandnpx chocolateui login(see the installation guide). - Run the Chocolate UI CLI:
npx chocolateui add hero-260Dependencies installed automatically: lucide-react, motion.
Uses: button, motion-presets, reveal, use-reduced-motion, utils.
Usage
import Hero260 from "@/components/blocks/hero-260"
export default function Page() {
return <Hero260 />
}