Flowbite Svelte: v0.46.14

Svelte: v5.0.0-next.179

SvelteKit: v2.5.18

Vite: v5.3.3

Rating

Get started with the rating component to show an aggregate of reviews and scores in the forms of stars or numbers. You can find multiple examples on this page including different styles, sizes, and variants of the rating component and other associated elements such as a comment or card. ## Setup Let's import all necessary components in the script tag. We import a heart, thumb-up, and smiley icons, but you can use any icons as you like. ## Default rating The default rating icon is a star. Set the total and rating props. The `id` prop is required. Use a unique name.

## Stars You can use the Star component with the `id` and `fillPercent` props.

## Rating with text If you also want to show a text near the stars you can use the `text` slot to add any text.

3.4 out of 5

## Rating count Aggregate more results by using this example to show the amount of reviews and the average score.

4.95

73 reviews

## Icon size and color ### Size and color The default icon size is `24`. Import your icon and set it in a icon props.

## AdvancedRating component Set the `total`,` rating`, and `ratings` prop for AdvancedRation component. Use the `rating` slot for Rating component with the `total` and `rating` props. Use the `globalText` slot for additional information.

3.72 out of 5

1,745 global ratings

5 star

70%

4 star

17%

3 star

2 star

1 star

## Different icon As we describe in the Rating component, you can change an icon in the Rating component.

3.8 out of 5

1,745 global ratings

5 star

70%

4 star

17%

3 star

2 star

1 star

## Score rating

8.7

Excellent

376 reviews

Read all reviews

Staff: 8.8

Comfort: 8.9

Free WiFi: 8.8

Facilities: 5.4

Value for money: 8.9

Cleanliness: 7

Location: 8

## Rating comment Use this component to show a single rating comment and its score alongside other components such as the user profile avatar, name, post date, and more.

Jese Leos Joined on August 2014

4.5 out of 5

Thinking to buy another one!

This is my third Invicta Pro Diver. They are just fantastic value for money. This one arrived yesterday and the first thing I did was set the time, popped on an identical strap from another Invicta and went in the shower with it to test the waterproofing.... No problems.

It is obviously not the same build quality as those very expensive watches. But that is like comparing a Citroën to a Ferrari. This watch was well under £100! An absolute bargain.

## Review content Use this component to show the review content from a user alongside the avatar, location, details, and the score inside a card element.

Jese Leos

Apartament with City View
3 nights December 2021
Family

Spotless, good appliances, excellent layout, host was genuinely nice and helpful.

8.79

The flat was spotless, very comfortable, and the host was amazing. I highly recommend this accommodation for anyone visiting Brasov city centre. It's quite a while since we are no longer using hotel facilities but self contained places. And the main reason is poor cleanliness and staff not being trained properly. This place exceeded our expectation and will return for sure.

It is obviously not the same build quality as those very expensive watches. But that is like comparing a Citroën to a Ferrari. This watch was well under £100! An absolute bargain.