Rating

Collect product scores, satisfaction signals, and read-only rating summaries with accessible radio semantics.

Usage Example

@rating.Rating(rating.Config{
    ID: "rating-default",
    Name: "rating",
    Value: 3,
    Label: "Product rating",
})

Emoji Rating

Switch to sentiment icons for feedback flows that should feel more conversational.

Emoji Rating

@rating.Rating(rating.Config{
    ID: "rating-emoji",
    Name: "sentiment",
    Value: 4,
    Style: rating.StyleEmoji,
    Label: "Satisfaction",
})

Sizes

Use SizeSM, SizeMD, SizeLG, or SizeXL to fit dense forms or larger feedback moments.

Size

sm md lg xl

Sizes

@rating.Rating(rating.Config{
    ID: "rating-size-md",
    Name: "rating-size-md",
    Value: 3,
    Size: rating.SizeMD,
    Label: "Medium",
    ShowLabel: true,
})

Disabled

Disabled ratings keep their selected value visible while blocking interaction.

Disabled

@rating.Rating(rating.Config{
    ID: "rating-disabled",
    Name: "disabled-rating",
    Value: 2,
    Disabled: true,
})

Read Only

ReadOnly renders the same visual language as a non-interactive summary.

Average rating

Read Only

@rating.Rating(rating.Config{
    ID: "rating-readonly",
    Value: 4,
    ReadOnly: true,
    Label: "Average rating",
    ShowLabel: true,
})

API Reference

Prop	Type	Default	Description
`ID`	`string`	`""`	Prefix for generated input IDs. Falls back to Name, then "rating".
`Name`	`string`	`""`	Radio group field name. Falls back to ID.
`Value`	`int`	`0`	Initially selected rating, clamped to 0..Max.
`Max`	`int`	`5`	Number of rating options.
`Label`	`string`	`"Rating"`	Accessible radiogroup label; visible when ShowLabel is true.
`ShowLabel`	`bool`	`false`	Renders the label above the control.
`Style`	`Style`	`StyleStars`	Visual style: "stars" or "emoji".
`Size`	`Size`	`SizeMD`	Icon size: "sm", "md", "lg", "xl".
`Disabled`	`bool`	`false`	Disables all radio inputs.
`ReadOnly`	`bool`	`false`	Renders a non-interactive rating summary.
`Attrs`	`templ.Attributes`	`nil`	Escape hatch applied last to the root element.
`Class`	`string`	`""`	Extra classes appended to the root element.

Range Palette