Skip to content

StarRating

Status: Stable

Displays a visual rating of a product, including a NerdWallet-specific rating. StarRatingInput allows users to interactively rate.

Variants

Default

NerdWallet

Interactive

Select your rating

Disabled

It’s OK

Props

<StarRating>

aria-label

string

Text to be used for assistive technology (like screen readers) to better guide users to what the context of this element means to the webpage. Defaults to the passed in rating label, then `rated ${rating} out of ${maxRating}`, but can be overriden here.

className

string

Deprecated
Class on the outer container element.
@deprecated

label

string

Label for the stars.

maxRating

= 5

number

Maximum star rating.

nerdwallet

boolean

Whether this is a "NerdWallet" rating, making the stars green.

rating

= 0

number

Current star rating.