4f:I[707087,["/_next/static/immutable/chunks/2985g-hklwiee.js","/_next/static/immutable/chunks/0qkc3dps_9x_i.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3thksmxn95rly.js","/_next/static/immutable/chunks/15bpbjna9-vr3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/0agonoz1szsjm.js","/_next/static/immutable/chunks/1ynd3dcge2kn1.js","/_next/static/immutable/chunks/0krdn-21gkgjt.js","/_next/static/immutable/chunks/0n9w9riw96l80.js","/_next/static/immutable/chunks/0w75qangey2ys.js","/_next/static/immutable/chunks/1tge7vcvsb70s.js","/_next/static/immutable/chunks/35ju_ac0ysz07.js"],"RegistryDependencies"] 50:I[512940,["/_next/static/immutable/chunks/2985g-hklwiee.js","/_next/static/immutable/chunks/0qkc3dps_9x_i.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3thksmxn95rly.js","/_next/static/immutable/chunks/15bpbjna9-vr3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/0agonoz1szsjm.js","/_next/static/immutable/chunks/1ynd3dcge2kn1.js","/_next/static/immutable/chunks/0krdn-21gkgjt.js","/_next/static/immutable/chunks/0n9w9riw96l80.js","/_next/static/immutable/chunks/0w75qangey2ys.js","/_next/static/immutable/chunks/1tge7vcvsb70s.js","/_next/static/immutable/chunks/35ju_ac0ysz07.js"],"Installation"] 51:I[314491,["/_next/static/immutable/chunks/2985g-hklwiee.js","/_next/static/immutable/chunks/0qkc3dps_9x_i.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3thksmxn95rly.js","/_next/static/immutable/chunks/15bpbjna9-vr3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/0agonoz1szsjm.js","/_next/static/immutable/chunks/1ynd3dcge2kn1.js","/_next/static/immutable/chunks/0krdn-21gkgjt.js","/_next/static/immutable/chunks/0n9w9riw96l80.js","/_next/static/immutable/chunks/0w75qangey2ys.js","/_next/static/immutable/chunks/1tge7vcvsb70s.js","/_next/static/immutable/chunks/35ju_ac0ysz07.js"],"FilesView"] 52:T1745,"use client"; import React from "react"; import Image from "next/image"; import { cn } from "@/lib/utils"; import { motion, Variants } from "motion/react"; interface Testimonial { name: string; role: string; image: string; quote: string; className: string; imageBorderColor: string; } const testimonials: Testimonial[] = [ { name: "Sarah Chen", role: "CEO of DataFlow Technologies", image: "https://assets.solaceui.com/solaceui-member-five.png", quote: "SolaceUI transformed our design workflow. What used to take weeks now takes days, and our product consistency has never been better.", className: "lg:col-span-1 lg:row-span-2 bg-(--color-primary) text-white border-transparent", imageBorderColor: "border-black", }, { name: "Marcus Rodriguez", role: "CEO of Quantum Labs", image: "https://assets.solaceui.com/solaceui-member-one.png", quote: "We've tried every UI framework out there. SolaceUI is the first that actually delivers. Our time-to-market improved by 40%", className: "lg:col-span-1 bg-white dark:bg-black border border-neutral-300 dark:border-neutral-600 text-black dark:text-white", imageBorderColor: "border-(--color-primary)", }, { name: "Oilivia Koe", role: "CEO of Nexus Digital", image: "https://assets.solaceui.com/solaceui-member-six.png", quote: "SolaceUI has become non-negotiable in our tech stack. It's elegant, powerful, and scaled beautifully with us from seed to Series B", className: "lg:col-span-1 lg:row-span-2 bg-black dark:bg-white text-white dark:text-black border-transparent ", imageBorderColor: "border-(--color-primary)", }, { name: "David Kim", role: "CEO of Streamline Software", image: "https://assets.solaceui.com/solaceui-member-two.png", quote: "Perfect balance between flexibility and structure. Our design system went from scattered mess to cohesive asset. ROI was evident in Q1.", className: "lg:col-span-1 bg-white dark:bg-black border border-neutral-300 dark:border-neutral-600 text-black dark:text-white", imageBorderColor: "border-(--color-primary)", }, { name: "James Mitchell", role: "CEO of Visionary Apps", image: "https://assets.solaceui.com/solaceui-member-four.png", quote: "The accessibility features are built-in, not bolted-on. It's rare to find a tool that makes both designers and developers genuinely happy", className: "lg:col-span-1 bg-black dark:bg-white text-white dark:text-black border-neutral-800", imageBorderColor: "border-(--color-primary)", }, { name: "Amara Okonkwo", role: "CEO of Horizon Platforms", image: "https://assets.solaceui.com/solaceui-member-three.png", quote: "We migrated our entire product in under three months. The performance improvements alone justified the switch. Highly recommend", className: "lg:col-span-2 bg-(--color-primary) text-white border-transparent", imageBorderColor: "border-black", }, ]; export default function Testimonial1() { const containerVariants = { hidden: { opacity: 0 }, visible: { opacity: 1, transition: { staggerChildren: 0.1, }, }, }; const itemVariants: Variants = { hidden: { opacity: 0, y: 20, filter: "blur(4px)" }, visible: { opacity: 1, y: 0, filter: "blur(0px)", transition: { duration: 0.4, ease: "easeOut" as const, }, }, }; return (

Trusted By The Best People

{testimonials.map((testimonial, index) => (

{testimonial.quote}

{testimonial.name}

{testimonial.role}

))}

); } 4b:["$","div",null,{"className":"flex flex-col gap-12","children":[["$","div",null,{"className":"pt-10 flex flex-col gap-4","children":[["$","ul",null,{"className":"flex gap-2 flex-wrap","children":[["$","li","motion",{"children":["$","a",null,{"href":"https://www.npmjs.com/package/motion","target":"_blank","rel":"noopener noreferrer","className":"rounded-md border p-2 text-sm flex items-center gap-1 ","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"text-xs font-medium","children":"motion"}]]}]}]]}],["$","$L4f",null,{"registryDependencies":[]}]]}],["$","$L50",null,{"sourceUrl":"https://www.solaceui.com/r/testimonial-section-1.json","proxyUrl":"https://shadcnregistry.com/r/solaceui/testimonial-section-1","itemId":"@solaceui/testimonial-section-1"}],["$","section",null,{"className":"flex flex-col gap-4","id":"files","children":[["$","h2",null,{"className":"text-lg md:text-2xl font-bold font-mono","children":"Files"}],["$","$L51",null,{"files":[{"path":"src/registry/blocks/testimonial-section/one/index.tsx","content":"$52","type":"registry:component","target":"components/testimonial-section-1.tsx"}]}]]}],"$L53"]}]

Testimonial Section 1

Installation

Files

components

Styles