Hero 185 - Laptop, tablet and phone trioPro

Centered copy above a CSS-drawn device family (a laptop flanked by an overlapping tablet on the left and a phone on the right) showing the same product across screens.

About Hero 185

Centered copy above a CSS-drawn device family (a laptop flanked by an overlapping tablet on the left and a phone on the right) showing the same product across screens.

Hero 185 is a hero block for React and Tailwind CSS, included in Chocolate UI Pro. It ships as 96 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.

  • devices
  • tri-image
  • laptop
  • tablet
  • phone
  • responsive

Installation

  1. Set up your project with npx chocolateui init and npx chocolateui login (see the installation guide).
  2. Run the Chocolate UI CLI:
npx chocolateui add hero-185

Dependencies installed automatically: lucide-react.

Uses: button, reveal, utils.

Usage

import Hero185 from "@/components/blocks/hero-185"

export default function Page() {
  return <Hero185 />
}

FAQ