Shadcn.io is not affiliated with official shadcn/ui
CTA Split Panel Tier Benefits
A split panel dark CTA for React and Next.js with a tier benefits list on the left, minimalist icon visual on the right, and ShadcnioButton action built with shadcn/ui and Tailwind CSS
Convert visitors with this split panel dark CTA for React and Next.js. Features an uppercase eyebrow, a two-line headline, a three-tier benefits list with checkmarks on the left, and a minimalist percent-sign icon visual on the right — all on a bg-foreground dark card with an inverted primary ShadcnioButton below the list. Built with TypeScript, ShadcnioButton from shadcn/ui, motion/react entrance animation, Lucide React icons, and Tailwind CSS. Perfect for partner program landings, tiered membership recruitment, reseller onboarding, and any conversion section where structured progression matters.
Related Components
Split Panel Dual Preview CTA
Split panel dark CTA with dual skeleton preview cards
Split Panel Crosshair Visual CTA
Split panel dark CTA with a crosshair target visual
Split Panel Device Mockup CTA
Split panel CTA with a device mockup visual
Split Panel Product Mockup CTA
Split panel CTA with a product UI mockup
Split Benefits Visual CTA
Split panel CTA with a benefits list beside a visual
Split Before After List CTA
Split panel CTA with a before and after comparison
FAQ
Was this page helpful?
Sign in to leave feedback.
Split Panel Terminal Cursor
A split panel dark CTA section for React and Next.js with terminal mockup visual, blinking cursor animation, traffic-light dots, monospace command line, and inverted primary ShadcnioButton built with shadcn/ui and Tailwind CSS
Split Panel Video Player Preview
A split panel dark CTA section for React and Next.js with a video player preview on the right, eyebrow label plus headline on the left, a bulleted feature trio, and an inverted primary ShadcnioButton built with shadcn/ui and Tailwind CSS