star icon
star-bold from Phosphor by Phosphor Icons · Bold · MIT Free for personal and commercial use.
- Name
- star-bold
- Set
- Phosphor
- Style
- Bold
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
The same icon in other sets
starAkar Iconsstar-filledAnt Design IconsstarBootstrap IconsstarBoxIcons v2starBoxIcons v2 SolidstarCarbonstarEmoji One (Colored)starElement Plusstar-fillEva IconsstarFramework7 IconsstarFont Awesome 6 RegularstarFont Awesome 6 SolidstarFont Awesome RegularstarFont Awesome SolidstarFeather Iconsstar-outlineFlowbite Iconsstar-12-filledFluent UI System Iconsstar-16Fluent UI System Color IconsstarFluent EmojistarFluent Emoji FlatstarFluent Emoji High ContraststarFirefox OS EmojistarHeroIconsstarHuge Icons
Related icons in Phosphor
Use the star icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M243 96a20.33 20.33 0 0 0-17.74-14l-56.59-4.57l-21.84-52.81a20.36 20.36 0 0 0-37.66 0L87.35 77.44L30.76 82a20.45 20.45 0 0 0-11.66 35.88l43.18 37.24l-13.2 55.7A20.37 20.37 0 0 0 79.57 233L128 203.19L176.43 233a20.39 20.39 0 0 0 30.49-22.15l-13.2-55.7l43.18-37.24A20.43 20.43 0 0 0 243 96m-70.47 45.7a12 12 0 0 0-3.84 11.86L181.58 208l-47.29-29.08a12 12 0 0 0-12.58 0L74.42 208l12.89-54.4a12 12 0 0 0-3.84-11.86l-42.27-36.5l55.4-4.47a12 12 0 0 0 10.13-7.38L128 41.89l21.27 51.5a12 12 0 0 0 10.13 7.38l55.4 4.47Z"/></svg>
React
import type { SVGProps } from "react";
export function PhStarBold(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M243 96a20.33 20.33 0 0 0-17.74-14l-56.59-4.57l-21.84-52.81a20.36 20.36 0 0 0-37.66 0L87.35 77.44L30.76 82a20.45 20.45 0 0 0-11.66 35.88l43.18 37.24l-13.2 55.7A20.37 20.37 0 0 0 79.57 233L128 203.19L176.43 233a20.39 20.39 0 0 0 30.49-22.15l-13.2-55.7l43.18-37.24A20.43 20.43 0 0 0 243 96m-70.47 45.7a12 12 0 0 0-3.84 11.86L181.58 208l-47.29-29.08a12 12 0 0 0-12.58 0L74.42 208l12.89-54.4a12 12 0 0 0-3.84-11.86l-42.27-36.5l55.4-4.47a12 12 0 0 0 10.13-7.38L128 41.89l21.27 51.5a12 12 0 0 0 10.13 7.38l55.4 4.47Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M243 96a20.33 20.33 0 0 0-17.74-14l-56.59-4.57l-21.84-52.81a20.36 20.36 0 0 0-37.66 0L87.35 77.44L30.76 82a20.45 20.45 0 0 0-11.66 35.88l43.18 37.24l-13.2 55.7A20.37 20.37 0 0 0 79.57 233L128 203.19L176.43 233a20.39 20.39 0 0 0 30.49-22.15l-13.2-55.7l43.18-37.24A20.43 20.43 0 0 0 243 96m-70.47 45.7a12 12 0 0 0-3.84 11.86L181.58 208l-47.29-29.08a12 12 0 0 0-12.58 0L74.42 208l12.89-54.4a12 12 0 0 0-3.84-11.86l-42.27-36.5l55.4-4.47a12 12 0 0 0 10.13-7.38L128 41.89l21.27 51.5a12 12 0 0 0 10.13 7.38l55.4 4.47Z"/></svg> </template>
CSS
.icon-star-bold {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M243%2096a20.33%2020.33%200%200%200-17.74-14l-56.59-4.57l-21.84-52.81a20.36%2020.36%200%200%200-37.66%200L87.35%2077.44L30.76%2082a20.45%2020.45%200%200%200-11.66%2035.88l43.18%2037.24l-13.2%2055.7A20.37%2020.37%200%200%200%2079.57%20233L128%20203.19L176.43%20233a20.39%2020.39%200%200%200%2030.49-22.15l-13.2-55.7l43.18-37.24A20.43%2020.43%200%200%200%20243%2096m-70.47%2045.7a12%2012%200%200%200-3.84%2011.86L181.58%20208l-47.29-29.08a12%2012%200%200%200-12.58%200L74.42%20208l12.89-54.4a12%2012%200%200%200-3.84-11.86l-42.27-36.5l55.4-4.47a12%2012%200%200%200%2010.13-7.38L128%2041.89l21.27%2051.5a12%2012%200%200%200%2010.13%207.38l55.4%204.47Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M243%2096a20.33%2020.33%200%200%200-17.74-14l-56.59-4.57l-21.84-52.81a20.36%2020.36%200%200%200-37.66%200L87.35%2077.44L30.76%2082a20.45%2020.45%200%200%200-11.66%2035.88l43.18%2037.24l-13.2%2055.7A20.37%2020.37%200%200%200%2079.57%20233L128%20203.19L176.43%20233a20.39%2020.39%200%200%200%2030.49-22.15l-13.2-55.7l43.18-37.24A20.43%2020.43%200%200%200%20243%2096m-70.47%2045.7a12%2012%200%200%200-3.84%2011.86L181.58%20208l-47.29-29.08a12%2012%200%200%200-12.58%200L74.42%20208l12.89-54.4a12%2012%200%200%200-3.84-11.86l-42.27-36.5l55.4-4.47a12%2012%200%200%200%2010.13-7.38L128%2041.89l21.27%2051.5a12%2012%200%200%200%2010.13%207.38l55.4%204.47Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/star-bold.svg?color=%231a73e8&size=48
