Basic Rating Indicator
Rating Indicator With Different Max Value
Disabled Rating Indicator
OverviewThe rating indicator is used to display a specific number of icons that are used to rate an item. Additionally, it is also used to display the average and overall ratings.
UsageThe reccomended number of icons is between 5 and 7.
Responsive BehaviorYou can change the size of the Rating Indicator by changing its
<ui5-rating-indicator style="font-size: 3rem;"></ui5-rating-indicator>
ES6 Module Import
You can use both properties and attributes with the same effect. The name of each attribute is listed below the name of the property, if different.
Note: A disabled
ui5-rating-indicatoris completely noninteractive.
Note: A read-only
ui5-rating-indicatoris not editable, but still provides visual feedback upon user interaction.
Note: If you set a number which is not round, it would be shown as follows:
- 1.0 - 1.2 -> 1
- 1.3 - 1.7 -> 1.5
- 1.8 - 1.9 -> 2
This Web Component fires semantic events upon user interaction. You can bind to these events with the standard DOM APIs, such as