# Shadcn Sizes

> Rating with size.

- Type: example, free and open source (MIT)
- Component: [Rating](https://reui.io/components/rating.md)
- Page: https://reui.io/components/rating/c-rating-5
- Docs (Base UI): https://reui.io/docs/components/base/rating.md
- Docs (Radix UI): https://reui.io/docs/components/radix/rating.md
- MCP: `get_example("c-rating-5")`
- Registry item: https://reui.io/r/styles/base-nova/c-rating-5.json
- Uses: Rating

## Best for

The sm, default and lg sizes stacked at the same score of 4 to compare star size and spacing

## When not to use

- A score the user sets by clicking a star: use [Editable](https://reui.io/components/rating/c-rating-4.md) (`get_example("c-rating-4")`)

## Install

```bash
npx shadcn@latest add @reui/c-rating-5
```

## About Shadcn Rating

### When to use

- Read only star scores at 3 sizes, with partial stars for averages such as 3.5 or 4.6
- Star inputs that collect a whole star score in feedback and written review forms
- Review summaries with a count bar per star level, and 5 step emoji scales for quick feedback

### When not to use

- A full product page section of buyer quotes, avatars and a ratings overview: use the [Review blocks](https://reui.io/blocks/ecommerce/review.md)
- A required score that keyboard and screen reader users must be able to set: use [Radio Group](https://reui.io/components/radio-group.md) (`get_component("radio-group")`)
- A score picked in half or finer steps rather than whole stars: use [Slider](https://reui.io/components/slider.md) (`get_component("slider")`)

### Agent notes

- An `editable` `Rating` takes pointer clicks only: each star is a `div` with an `onClick` and no role, tab stop or key handler
- Clicks send whole numbers from 1 to `maxRating` to `onRatingChange`; a decimal `rating` draws a partial star but cannot be picked
- `starClassName` styles the `showValue` number, not the stars; recolor stars from `className` through the `rating-star-filled` slot

Every ReUI item has a twin like this one; the index is https://reui.io/llms.txt. Agents with the ReUI MCP (https://reui.io/docs/mcp) get the same guidance from the getters named above.