STANDALONE SVG CSS-ONLY STAR RATING COMPONENT

Author:

  • Damián Muti
  • May 24, 2017

Made with:

  • HTML / CSS (SCSS)

About the code:

This is a CSS-only component that dynamically generates each of the SVG icons to be used as background images for each of the stars. For the rating value to be displayed, data-rating-value HTML attribute must be updated and calculated rounding every 0.25 to reflect the proper rating.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: –

Download Demo and Code