Shadcn.io is not affiliated with official shadcn/ui
About Two Column
A split-panel about block for React and Next.js with company narrative prose on the left, 6 stacked vertical metrics on the right, divide-x separator, and entrance animations from respective sides built with shadcn/ui and Tailwind CSS
Tell your company story alongside proof points with this split-panel about block for React and Next.js. Features a left column with multi-paragraph company narrative and founding context, a right column with 6 vertically stacked key metrics using tabular-nums formatting, a clean divide-x visual separator, and directional entrance animations from respective sides. Built with TypeScript, shadcn/ui Separator component, motion/react directional animations, and Tailwind CSS. Perfect for company overview pages, investor relations sections, and startup pitch landing pages.
Related Components
By The Numbers
Key company statistics overview
Stats Large
Large format statistics display
Mission
Company mission statement
Story Centered
Centered narrative company story
Counters Row
Animated counter statistics row
Bold Statement
Bold headline company statement
FAQ
Was this page helpful?
Sign in to leave feedback.
Transparency Report
A quarterly transparency metrics table block for React and Next.js with 8 financial and operational rows, Q1-Q4 columns, year-over-year change indicators, sortable headers, and color-coded performance signals built with shadcn/ui and Tailwind CSS
Use Cases
A bento grid use cases block for React and Next.js with asymmetric industry cards, customer count badges, key metric highlights, feature lists, and staggered entrance animations built with shadcn/ui and Tailwind CSS