Navigation: [/sitemap.md](/sitemap.md)

---
type: doc
title: Rating
description: A star rating component for displaying ratings visually.
---

```astro live props={{ name: 'rating' }}
---
import { Rating } from "@/components/ui/rating"
---

<div class="flex flex-col gap-4">
  <Rating value={5} />
  <Rating value={4} />
  <Rating value={3.5} />
  <Rating value={2} />
</div>
```

## Installation

```bash
npx shadcn@latest add @fulldev/rating
```

## Usage

```ts
import { Rating } from "@/components/ui/rating"
```

```astro
<Rating value={4.5} />
```

`Rating` defaults to `5` when no value is provided.

## Examples

```astro live
---
import { Rating } from "@/components/ui/rating"
---

<div class="flex flex-col gap-4">
  <Rating value={5} />
  <Rating value={3.5} />
  <Rating value={1} />
  <Rating />
</div>
```

## API Reference

See the [GitHub source code](https://github.com/fulldotdev/ui/tree/main/src/components/ui/rating) for more information on props.