Hero Block App Showcase

Showcase your mobile app elegantly. This React hero block features a clean phone mockup with your app screenshot, app store download buttons, and key feature highlights. Built entirely with shadcn/ui Button, Badge, and Card components—no complex 3D transforms or animations. The phone frame is pure CSS with rounded corners and a notch. Screenshots display inside the frame with proper aspect ratio. App store buttons use inline SVG icons. Perfect for mobile app landing pages, app launches, or any product with a mobile-first experience.

Hero Block App Showcase preview

Installation

npx shadcn@latest add https://www.shadcn.io/registry/hero-23.json

npx shadcn@latest add https://www.shadcn.io/registry/hero-23.json

pnpm dlx shadcn@latest add https://www.shadcn.io/registry/hero-23.json

bunx shadcn@latest add https://www.shadcn.io/registry/hero-23.json

Related Components

FAQ