Accordion Alert App Bar Avatar Badge Bar Chart Bottom Sheet Breadcrumbs Button Calendar Card Checkbox Chip Close Button Control Field Date Field Date Picker Date Range Picker Description Dialog Drop Down Field Error Hover Kbd Label Line Chart Link Button List Group Menu Number Field Number Stepper Number Value Popover Pressable Feedback Progress Bar Progress Button Progress Circle Radio Button Group Radio Group Range Calendar Rating Scroll Shadow Search Field Select Separator Sidebar Skeleton Slide Button Slider Social Auth Button Spinner Split View Status Tag Stepper Surface Swipe Action Switch Tabs Tag Tag Group Text Area Text Field Text Field Group Text Field OTP Text Field OTP Group Time Picker Toast Toggle Button Toggle Button Group Tooltip Trend Chip Widget

Rating

Live preview and documentation for the Rating component.

Preview

componentPreview.loading

About

Star rating (KasyRating). Display-only when onChanged is null; interactive (tappable) when set — tapping a star sets the whole rating.

value: can be fractional (e.g. 3.5) to show a partially-filled star in display mode; interactive taps always resolve to a whole number.
count: number of stars (default 5).
size: sm (18px) / md (24px, default) / lg (32px).
onChanged: null = read-only; set = interactive.
semanticLabel: accessibility label.

Note: partial fill is done by clipping the same outline star icon in two colors, since the icon set (Lucide) has no separate "filled star" version.

Last updated on 08/23/2026

Range Calendar

Live preview and documentation for the Range Calendar component.

Scroll Shadow

Live preview and documentation for the Scroll Shadow component.

On this page