star icon
star-outline from Eva Icons by Akveo · Outline · MIT Free for personal and commercial use.
- Name
- star-outline
- Set
- Eva Icons
- Style
- Outline
- Viewbox
- 24×24
- License
- MIT
1 other variant in Eva Icons
The same icon in other sets
starAkar Iconsstar-filledAnt Design IconsstarBootstrap IconsstarBoxIcons v2starBoxIcons v2 SolidstarCarbonstarEmoji One (Colored)starElement PlusstarFramework7 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 IconsstarHumbleicons
Use the star icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M17.56 21a1 1 0 0 1-.46-.11L12 18.22l-5.1 2.67a1 1 0 0 1-1.45-1.06l1-5.63l-4.12-4a1 1 0 0 1-.25-1a1 1 0 0 1 .81-.68l5.7-.83l2.51-5.13a1 1 0 0 1 1.8 0l2.54 5.12l5.7.83a1 1 0 0 1 .81.68a1 1 0 0 1-.25 1l-4.12 4l1 5.63a1 1 0 0 1-.4 1a1 1 0 0 1-.62.18M12 16.1a.9.9 0 0 1 .46.11l3.77 2l-.72-4.21a1 1 0 0 1 .29-.89l3-2.93l-4.2-.62a1 1 0 0 1-.71-.56L12 5.25L10.11 9a1 1 0 0 1-.75.54l-4.2.62l3 2.93a1 1 0 0 1 .29.89l-.72 4.16l3.77-2a.9.9 0 0 1 .5-.04"/></svg>
React
import type { SVGProps } from "react";
export function EvaStarOutline(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M17.56 21a1 1 0 0 1-.46-.11L12 18.22l-5.1 2.67a1 1 0 0 1-1.45-1.06l1-5.63l-4.12-4a1 1 0 0 1-.25-1a1 1 0 0 1 .81-.68l5.7-.83l2.51-5.13a1 1 0 0 1 1.8 0l2.54 5.12l5.7.83a1 1 0 0 1 .81.68a1 1 0 0 1-.25 1l-4.12 4l1 5.63a1 1 0 0 1-.4 1a1 1 0 0 1-.62.18M12 16.1a.9.9 0 0 1 .46.11l3.77 2l-.72-4.21a1 1 0 0 1 .29-.89l3-2.93l-4.2-.62a1 1 0 0 1-.71-.56L12 5.25L10.11 9a1 1 0 0 1-.75.54l-4.2.62l3 2.93a1 1 0 0 1 .29.89l-.72 4.16l3.77-2a.9.9 0 0 1 .5-.04"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M17.56 21a1 1 0 0 1-.46-.11L12 18.22l-5.1 2.67a1 1 0 0 1-1.45-1.06l1-5.63l-4.12-4a1 1 0 0 1-.25-1a1 1 0 0 1 .81-.68l5.7-.83l2.51-5.13a1 1 0 0 1 1.8 0l2.54 5.12l5.7.83a1 1 0 0 1 .81.68a1 1 0 0 1-.25 1l-4.12 4l1 5.63a1 1 0 0 1-.4 1a1 1 0 0 1-.62.18M12 16.1a.9.9 0 0 1 .46.11l3.77 2l-.72-4.21a1 1 0 0 1 .29-.89l3-2.93l-4.2-.62a1 1 0 0 1-.71-.56L12 5.25L10.11 9a1 1 0 0 1-.75.54l-4.2.62l3 2.93a1 1 0 0 1 .29.89l-.72 4.16l3.77-2a.9.9 0 0 1 .5-.04"/></svg> </template>
CSS
.icon-star-outline {
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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M17.56%2021a1%201%200%200%201-.46-.11L12%2018.22l-5.1%202.67a1%201%200%200%201-1.45-1.06l1-5.63l-4.12-4a1%201%200%200%201-.25-1a1%201%200%200%201%20.81-.68l5.7-.83l2.51-5.13a1%201%200%200%201%201.8%200l2.54%205.12l5.7.83a1%201%200%200%201%20.81.68a1%201%200%200%201-.25%201l-4.12%204l1%205.63a1%201%200%200%201-.4%201a1%201%200%200%201-.62.18M12%2016.1a.9.9%200%200%201%20.46.11l3.77%202l-.72-4.21a1%201%200%200%201%20.29-.89l3-2.93l-4.2-.62a1%201%200%200%201-.71-.56L12%205.25L10.11%209a1%201%200%200%201-.75.54l-4.2.62l3%202.93a1%201%200%200%201%20.29.89l-.72%204.16l3.77-2a.9.9%200%200%201%20.5-.04%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M17.56%2021a1%201%200%200%201-.46-.11L12%2018.22l-5.1%202.67a1%201%200%200%201-1.45-1.06l1-5.63l-4.12-4a1%201%200%200%201-.25-1a1%201%200%200%201%20.81-.68l5.7-.83l2.51-5.13a1%201%200%200%201%201.8%200l2.54%205.12l5.7.83a1%201%200%200%201%20.81.68a1%201%200%200%201-.25%201l-4.12%204l1%205.63a1%201%200%200%201-.4%201a1%201%200%200%201-.62.18M12%2016.1a.9.9%200%200%201%20.46.11l3.77%202l-.72-4.21a1%201%200%200%201%20.29-.89l3-2.93l-4.2-.62a1%201%200%200%201-.71-.56L12%205.25L10.11%209a1%201%200%200%201-.75.54l-4.2.62l3%202.93a1%201%200%200%201%20.29.89l-.72%204.16l3.77-2a.9.9%200%200%201%20.5-.04%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/eva/star-outline.svg?color=%231a73e8&size=48
