React Split Panel Testimonial Block

React split panel testimonials with featured quote and secondary quotes using Next.js, shadcn/ui Avatar, and Tailwind CSS

Showcase customer voices with impact using this split panel testimonial block for React and Next.js. Features a prominent featured quote with QuoteIcon and author attribution alongside compact secondary testimonials in a two-column layout. Built with TypeScript, Next.js, shadcn/ui Avatar components, Framer Motion staggered animations, and Tailwind CSS. Perfect for SaaS landing pages, case study sections, and product marketing pages.

React Split Panel Testimonial Block preview

Scroll to load preview

Installation

Install

Pro block

npx shadcn@latest add https://www.shadcn.io/r/testimonials-split.json

npx shadcn@latest add https://www.shadcn.io/r/testimonials-split.json

pnpm dlx shadcn@latest add https://www.shadcn.io/r/testimonials-split.json

bunx shadcn@latest add https://www.shadcn.io/r/testimonials-split.json

Testimonials with Stats

Stats banner with customer testimonials

Video Testimonials

Video testimonial cards with play overlay

Testimonials Wall

Dense grid of customer reviews

Masonry Testimonials

Staggered height testimonial grid

Hero Blocks

Landing page hero sections

Feature Blocks

Feature showcase sections

FAQ

Last updated on March 24, 2026

Was this page helpful?

React Social Proof Bar Block

A React social proof bar with avatar stack, star rating, and reviews using Next.js, shadcn/ui, and Tailwind CSS

React Spotlight Testimonial Block

React spotlight testimonial with avatar, quote, and metrics using Next.js, shadcn/ui, and Tailwind CSS

React Split Panel Testimonial Block