Star Half icon
Used in general rating scenarios. The Star Half icon is part of Microsoft's Fluent UI System Icons, available here in filled and regular (outlined) styles on a 24 px grid. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
Use the Star Half icon in React
Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.
npm install @fluentui/react-icons
import { StarHalf24Regular, StarHalf24Filled } from "@fluentui/react-icons";
export function Example() {
return <StarHalf24Regular aria-label="Star Half" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_star_half_24_regular.svg" width="24" height="24" alt="Star Half"> Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.9993 2.34961C11.5175 2.34931 11.0356 2.60015 10.7878 3.10215L8.42988 7.87987L3.15735 8.64601C2.05005 8.80691 1.60791 10.1677 2.40916 10.9487L6.2244 14.6676L5.32374 19.9189C5.17402 20.7918 5.86803 21.5007 6.65504 21.5001C6.86293 21.5002 7.07736 21.4509 7.28448 21.342L11.9994 18.8632L16.7143 21.342C17.7047 21.8627 18.8622 21.0217 18.6731 19.9189L17.7724 14.6676L21.5877 10.9487C22.3889 10.1677 21.9468 8.80691 20.8395 8.64601L15.567 7.87987L13.209 3.10215C12.9617 2.601 12.4803 2.35016 11.9993 2.34961C11.9991 2.34961 11.9995 2.34961 11.9993 2.34961ZM12 17.3432V4.04175L14.2568 8.61443C14.4534 9.01288 14.8335 9.28904 15.2732 9.35294L20.323 10.0867L16.6689 13.6486C16.3508 13.9587 16.2056 14.4055 16.2807 14.8435L17.1433 19.8729L12.6266 17.4983C12.4305 17.3952 12.2153 17.3435 12 17.3432Z" fill="currentColor"/></svg>Use it from the SVG package
Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:
npm install @fluentui/svg-icons
import icon from "@fluentui/svg-icons/icons/star_half_24_regular.svg";Details
| Name | Star Half |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_star_half_24_regular.svg |
| Filled file | ic_fluent_star_half_24_filled.svg |
| React components | StarHalf24Regular, StarHalf24Filled |
| License | MIT (© Microsoft Corporation) |