React Rating

  • Enable your users to leave a rating and modify the values they've chosen with this accessible and customizable Rating component.
  • Part of the KendoReact library along with 100+ professional UI components built with React for React, from the ground up.
  • Get started quickly with our award-winning support, detailed documentation, interactive demos and instructor-led training.
  • Overview

    The React Rating UI component allows users to leave a rating in a digestible, visual way. It enables React applications to display rating values that users can choose and update through the component's interface. With its built-in support for partial steps, the KendoReact Rating can accommodate round, half or partial rating values, such as a 4.9-star rating. The React Rating component works well by itself or integrated into other React UI components, such as the KendoReact Data Grid.

    See React Rating demo

    React Rating Component
  • Configuration Options

    Thanks to a large set of configuration options, the KendoReact Rating component can meet any design requirement when it comes to rating capabilities within an application. You can define aspects like precision, which allows for partial values to be displayed, labels, which appear alongside icons representing the current rating, and interactivity, which controls if the React Rating component is enabled or disabled.

    See React Rating Precision demo

    React Rating Component Precision
  • Forms Support

    The KendoReact Rating component can be integrated with any HTML form, added to the KendoReact Form component and works with any third-party library that targets building forms with React.

    See React Rating Forms Support demo

    React Rating Component Forms Support
  • Customization

    Each item of the KendoReact Rating component can be customized and styled to fit your app design. This lets React developers customize aspects like the icon used to display the current and maximum rating value. You can completely override the rendering of each item to enable scenarios such as a color gradient showing a low rating in red and a higher rating in green.

    See React Rating Customization demo

    React Rating Component Customization
  • Controlled Mode

    The KendoReact Rating component supports both uncontrolled (the default) and controlled modes. You can add the React Rating component into any React application and follow the appropriate mode for said application without having to do extensive customization.

    See React Rating Controlled Mode demo

  • Keyboard Navigation

    With the built-in keyboard navigation, users can interact with the KendoReact Rating component using just their keyboard.

    See React Rating Keyboard Navigation demo

  • Accessibility

    One of the core aspects of KendoReact is compliance with accessibility standards. The KendoReact team understands how important accessibility is for the web and this drives the team to make accessibility integral to every component. The KendoReact Rating supports Section 508, Keyboard Navigation, and WCAG 2.0 compliance with a AAA rating.

    See React Rating Accessibility demo

    React Accessibility - KendoReact

All KendoReact Components

waves bg

Next Steps

Visit Our Demos

See KendoReact in action and check out how much it can do out-of-the-box.

See Pricing

Buy an individual license for KendoReact, or treat yourself to Kendo UI, our complete JavaScript bundle.

Start Free Trial

Try KendoReact with dedicated technical support.