Feature 127 - Rating breakdown beside feature scoresPro

A review summary card with a big average, star row and animated distribution bars sits next to the features reviewers rate highest.

About Feature 127

A review summary card with a big average, star row and animated distribution bars sits next to the features reviewers rate highest.

Feature 127 is a feature block for React and Tailwind CSS, included in Chocolate UI Pro with motion animations that respect reduced-motion settings. It ships as 112 lines of TypeScript you own: every piece of copy is a prop with a sensible default, so you can drop it in and replace the content without touching the layout.

  • ratings
  • reviews
  • bars
  • social-proof

Installation

  1. Set up your project with npx chocolateui init and npx chocolateui login (see the installation guide).
  2. Run the Chocolate UI CLI:
npx chocolateui add feature-127

Dependencies installed automatically: lucide-react, motion.

Uses: reveal, utils.

Usage

import Feature127 from "@/components/blocks/feature-127"

export default function Page() {
  return <Feature127 />
}

FAQ