HTML Rating Stars Builder

You have a 4.5 rating to show on a product card, inside an email template, or in a small internal dashboard, and pulling an entire icon library for five symbols feels like overkill. Unicode already ships the star characters. The tedious part is working out how many render full, how many stay empty, and what to do with the half step in the middle.

Two fields drive it: the rating and the maximum. The integer part becomes filled stars, a fractional part of 0.5 or more becomes one half star, and whatever is left up to the maximum becomes empty stars. The output comes wrapped in a span carrying a title attribute in rating/max form, so hovering reveals the exact number. Nothing here is an image or an SVG, just text you can paste anywhere.

Three things worth checking. Use a dot as the decimal separator, since a comma makes the parse fall back to zero and the whole row renders empty. The rating is never clamped to the maximum, so 8 out of 5 happily returns eight filled stars. The half-star glyph is U+2BE8, a half black circle that plenty of font stacks do not carry, so preview it where it will actually ship. There is no copy button either, so select the block and hit Ctrl+C. Everything runs locally in your browser.