HTML five stars ranking

How to create a 5 star ranking with icons from Friconix.

I selected the following star and half star icons from Friconix:

You can simply have to join the stars to create the ranking you expect:

<div>
<i class="fi-xnsuxl-star-solid"></i>
<i class="fi-xnsuxl-star-solid"></i>
<i class="fi-xnsuxl-star-solid"></i>
<i class="fi-xwluxl-star-half-wide"></i>
<i class="fi-xwluxl-star-wide"></i>
</div>

Resultat sur JSFiddle

See also

• Add icons on your web pages
• 3D image carousel in pure JavaScript and CSS
• Draw a circle in a square in pure CSS with ::before
• CSS color table
• CSS styles for Rainbow code highlighter
• How to detect ad blockers on web sites?
• HTML drop-down list of citizenships.
• How Bézier curves are described in SVG paths
• How to check if a number is prime in JavaScript
• How to get list of subdirectories in PHP
• How to automatically scroll to the bottom of the page in Google Chrome
• How to send dynamic data using Ajax?
• How to slugify a string in JavaScript?
• How to slugify a string in PHP?
• How to sort a multidimensional array in PHP?
• In PHP, how to convert a date in French?
• Levenshtein distance in mySQL
• List of supported languages by Prism syntax highlighter
• Nice HTML checkbox
• PHP array of countries and citizenships.
• Pure CSS loader
• Replace HTML checkbox with images
• Simple SSE in PHP
• Sessions or cookies?

---