Hero 194 - SDK snippet with language tabsPro

Split hero with copy and install command on the left and a code window on the right whose tabs switch between TypeScript, Python and Go versions of the same call.

About Hero 194

Split hero with copy and install command on the left and a code window on the right whose tabs switch between TypeScript, Python and Go versions of the same call.

Hero 194 is a pro hero block for React, built on shadcn/ui and Tailwind CSS. It ships as 103 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.

  • code
  • sdk
  • developer
  • tabs
  • split

Installation

  1. Add the Chocolate UI registry to your components.json (see the installation guide).
  2. Run the shadcn CLI:
npx shadcn@latest add @chocolate/hero-194

Dependencies installed automatically: lucide-react.

Uses: button, reveal, use-copy, utils.

Usage

import Hero194 from "@/components/blocks/hero-194"

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

FAQ