Farigh UI Logo

Farigh UI

Source Code

cursor-testimonials-grid.tsx
1"use client";
2
3const testimonials = [
4  {
5    quote:
6      "It was night and day from one batch to another, adoption went from single digits to over 80%. It just spread like wildfire, all the best builders were using Cursor.",
7    avatar: "https://api.dicebear.com/7.x/avataaars/svg?seed=Diana",
8    name: "Diana Hu",
9    title: "General Partner, Y Combinator",
10  },
11  {
12    quote:
13      "The most useful AI tool that I currently pay for, hands down, is Cursor. It's fast, autocompletes what and where you need it to, handles brackets properly, sensible keyboard shortcuts, bring-your-own-model... everything is well put together.",
14    avatar: "https://api.dicebear.com/7.x/avataaars/svg?seed=shadcn",
15    name: "shadcn",
16    title: "Creator of shadcn/ui",
17  },
18  {
19    quote:
20      "The best LLM applications have an autonomy slider: you control their independence to give the AI. In Cursor, you can do Tab completion, Cmd+K for targeted edits, or you can let it rip with the full autonomy agentic version.",
21    avatar: "https://api.dicebear.com/7.x/avataaars/svg?seed=Andrei",
22    name: "Andrei Karpathy",
23    title: "CEO, Eureka Labs",
24  },
25  {
26    quote:
27      "Cursor quickly grew from hundreds to thousands of extremely enthusiastic Stripe employees. We spend more on R&D and software creation than any other undertaking, and there's significant economic outcomes when making that process more efficient and productive.",
28    avatar: "https://api.dicebear.com/7.x/avataaars/svg?seed=Patrick",
29    name: "Patrick Collison",
30    title: "Co-Founder & CEO, Stripe",
31  },
32  {
33    quote: "It's official.\n\nI hate vibe coding.\nI love Cursor tab coding.\n\nIt's wild.",
34    avatar: "https://api.dicebear.com/7.x/avataaars/svg?seed=Prime",
35    name: "ThePrimeagen",
36    title: "@ThePrimeagen",
37  },
38  {
39    quote:
40      "It's definitely becoming more fun to be a programmer. It's less about digging through pages and more about what you want to happen. We are at the 1% of what's possible, and it's in interactive experiences like Cursor where models like GPT-5 shine brightest.",
41    avatar: "https://api.dicebear.com/7.x/avataaars/svg?seed=Greg",
42    name: "Greg Brockman",
43    title: "President, OpenAI",
44  },
45];
46
47export const CursorTestimonialsGrid = () => {
48  return (
49    <div className="w-full min-h-screen bg-[#14120B] flex flex-col items-center justify-center p-8 md:p-16">
50      <div className="max-w-7xl w-full space-y-12">
51        {/* Heading */}
52        <h1 className="text-white text-4xl md:text-5xl lg:text-6xl font-medium text-center">
53          The new way to build software.
54        </h1>
55
56        {/* Testimonials Grid */}
57        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
58          {testimonials.map((testimonial, index) => (
59            <div
60              key={index}
61              className="bg-[#1B1913] rounded-2xl p-8 flex flex-col justify-between space-y-6 border border-[#2A2722]"
62            >
63              {/* Quote */}
64              <p className="text-white/90 text-base md:text-lg leading-relaxed whitespace-pre-line">
65                {testimonial.quote}
66              </p>
67
68              {/* Author Info */}
69              <div className="flex items-center gap-3">
70                <img
71                  src={testimonial.avatar}
72                  alt={testimonial.name}
73                  className="w-12 h-12 rounded-full bg-white/10"
74                />
75                <div>
76                  <p className="text-white font-medium text-sm">
77                    {testimonial.name}
78                  </p>
79                  <p className="text-white/50 text-sm">{testimonial.title}</p>
80                </div>
81              </div>
82            </div>
83          ))}
84        </div>
85      </div>
86    </div>
87  );
88};
89

Related

Flight Card - San Francisco - Free React component preview

Flight Card - San Francisco

Flight Card - New York - Free React component preview

Flight Card - New York

Simplified Pricing - Free React component preview

Simplified Pricing

Mental Pricing - Free React component preview

Mental Pricing