Make your AI a shadcn expert

Rating

Interactive star rating with hover preview and keyboard navigation for React

Rating preview

Scroll to load preview

Stars fill on hover and commit on click. Arrow keys navigate between ratings. Swap stars for hearts, thumbs, or any Lucide icon. Works controlled or uncontrolled. Includes a read-only mode for displaying existing ratings. Great for reviews, surveys, or any 1-5 scale input.

Install with AI

If you've connected the shadcn.io MCP server to Claude Code, Cursor, Windsurf, or any MCP-ready AI editor, prompt your agent to install this component for you — no copy-paste, no CLI:

use shadcnio to install the rating component into my project

FAQ

Was this page helpful?

Sign in to leave feedback.