Reviews Badge

Component

About

A simple Badge That illustrates the overall rating of your SaaS/Agency on specific product use cases.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Reviews Badge to your project and fits it to your theme.

Code

How Reviews Badge is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import ReviewsBadge from "@/components/ui/reviews-badge";

const reviews = [
    {
      id: 1,
      name: "Man 2",
      position: "CMO",
      companyName: "ActivationLed",
      image: null,
    },
    {
      id: 2,
      name: "Man 2",
      position: "Head of Growth",
      companyName: "ActivationLed",
      image: null,
    },
    {
      id: 3,
      name: "Woman 1",
      position: "Founder",
      companyName: "ActivationLed",
      image: null,
    },
    {
      id: 4,
      name: "Woman 2",
      position: "PLG Advisor",
      companyName: "ActivationLed",
      image: null,
    },
    {
      id: 5,
      name: "Woman 3",
      position: "Content Creator",
      companyName: "ActivationLed",
      image: null,
    },
];

export default function DemoOne() {
  return (
    <main className="min-h-screen w-screen bg-[#F0F0F0] flex items-center justify-center">
      <ReviewsBadge 
        reviews={reviews} style="stars" 
      /> 
    </main>
  )
}