About Approach

shadcn-io/about-approach

PaidBlock

An interactive approach stepper block for React and Next.js with horizontal phase navigation, split detail panel, deliverable cards, team badges, and cross-fade animations built with shadcn/ui and Tailwind CSS

Live preview

live · rendered by the registry

Rendered by shadcn-io on their own page — this is the component running, not a screenshot of it.

Install it

npx shadcn@latest add https://shadcn.io/r/about-approach.json

This registry’s item endpoint answers 401 — the command needs credentials from shadcn-io.

What it pulls in

npm packages

motion
lucide-react

Other registry items

badge

Files it writes

blocks/about/about-approach.tsx

More from shadcn-io

All 7,794 items

Same registry, same kind — the ones you would have found next
Component	Registry	Kind	Access	Installs
About Accessibility Pledgeabout-accessibility-pledge	shadcn-io	Blocks	Paid	2 deps
About Advisory Boardabout-advisory-board	shadcn-io	Blocks	Paid	2 deps
About Alternatingabout-alternating	shadcn-io	Blocks	Paid	2 deps
About Alumni Networkabout-alumni-network	shadcn-io	Blocks	Paid	2 deps
About Api Statsabout-api-stats	shadcn-io	Blocks	Paid	2 deps
About Architecture Overviewabout-architecture-overview	shadcn-io	Blocks	Paid	2 deps
About Awardsabout-awards	shadcn-io	Blocks	Paid	2 deps
About Before Afterabout-before-after	shadcn-io	Blocks	Paid	2 deps