Device Mockup 8 - Thin laptop sweeps in from the sidePro
A two-column header with headline on the left and copy plus CTA on the right, above a thin laptop that sweeps in from off-screen with a 3D turn and lands centered over a spec strip. Use it for a desktop or web app launch where lightness and speed are the message.
About Device Mockup 8
A two-column header with headline on the left and copy plus CTA on the right, above a thin laptop that sweeps in from off-screen with a 3D turn and lands centered over a spec strip. Use it for a desktop or web app launch where lightness and speed are the message.
Device Mockup 8 is a device mockup block for React and Tailwind CSS, included in Chocolate UI Pro with motion animations that respect reduced-motion settings. It ships as 95 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.
- mockup
- laptop
- sweep
- launch
- specs
- entrance
Installation
- Set up your project with
npx chocolateui initandnpx chocolateui login(see the installation guide). - Run the Chocolate UI CLI:
npx chocolateui add device-mockup-08Dependencies installed automatically: motion.
Uses: button, device-frame, reveal, use-reduced-motion, utils.
Usage
import DeviceMockup08 from "@/components/blocks/device-mockup-08"
export default function Page() {
return <DeviceMockup08 />
}