• Docs
  • Components
  • Rating

Rating - Aspect UI

The Rating component enables users to provide feedback using a star or icon-based scale. It supports half-stars, tooltips, read-only states, and custom icons.

Table of Contents#

Rating Props#


PropTypeDefaultDescription
maxRatingnumber5Maximum number of rating stars.
initialRatingnumber0Initial rating value.
sizenumber24Size of each star icon in pixels.
onChange(event: React.ChangeEvent<HTMLInputElement>, rating: number) => void-Callback fired when the rating changes.
starColorstring'color-mix(in oklab, var(--color-primary) 50%, transparent)'Color of the filled stars.
hoverColorstring'var(--color-primary)'Color of stars on hover.
unratedColorstring'var(--color-bg)'Color of unrated (empty) stars.
ratingTextsstring[]defaultRatingTextsText labels for each rating value.
readOnlybooleanfalseIf true, disables rating changes (read-only mode).
iconReactNode-Custom icon to use instead of default star.
classNamestring''Additional CSS classes for the rating component container.