round star icon
round-star from Google Material Icons by Material Design Authors · Baseline · Toggle · Apache-2.0 Free for personal and commercial use.
- Name
- round-star
- Set
- Google Material Icons
- Style
- Baseline
- Category
- Toggle
- Viewbox
- 24×24
- License
- Apache 2.0
1 other variant in Google Material Icons
More toggle icons from Google Material Icons
baseline-check-boxbaseline-check-box-outline-blankbaseline-indeterminate-check-boxbaseline-radio-button-checkedbaseline-radio-button-uncheckedbaseline-starbaseline-star-borderbaseline-star-border-purple500baseline-star-halfbaseline-star-purple500baseline-toggle-offbaseline-toggle-onoutline-check-boxoutline-check-box-outline-blankoutline-indeterminate-check-boxoutline-radio-button-checkedoutline-radio-button-uncheckedoutline-staroutline-star-borderoutline-star-border-purple500outline-star-halfoutline-star-purple500outline-toggle-offoutline-toggle-on
Use the round star icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m12 17.27l4.15 2.51c.76.46 1.69-.22 1.49-1.08l-1.1-4.72l3.67-3.18c.67-.58.31-1.68-.57-1.75l-4.83-.41l-1.89-4.46c-.34-.81-1.5-.81-1.84 0L9.19 8.63l-4.83.41c-.88.07-1.24 1.17-.57 1.75l3.67 3.18l-1.1 4.72c-.2.86.73 1.54 1.49 1.08z"/></svg>
React
import type { SVGProps } from "react";
export function IcRoundStar(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="m12 17.27l4.15 2.51c.76.46 1.69-.22 1.49-1.08l-1.1-4.72l3.67-3.18c.67-.58.31-1.68-.57-1.75l-4.83-.41l-1.89-4.46c-.34-.81-1.5-.81-1.84 0L9.19 8.63l-4.83.41c-.88.07-1.24 1.17-.57 1.75l3.67 3.18l-1.1 4.72c-.2.86.73 1.54 1.49 1.08z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m12 17.27l4.15 2.51c.76.46 1.69-.22 1.49-1.08l-1.1-4.72l3.67-3.18c.67-.58.31-1.68-.57-1.75l-4.83-.41l-1.89-4.46c-.34-.81-1.5-.81-1.84 0L9.19 8.63l-4.83.41c-.88.07-1.24 1.17-.57 1.75l3.67 3.18l-1.1 4.72c-.2.86.73 1.54 1.49 1.08z"/></svg> </template>
CSS
.icon-round-star {
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%22m12%2017.27l4.15%202.51c.76.46%201.69-.22%201.49-1.08l-1.1-4.72l3.67-3.18c.67-.58.31-1.68-.57-1.75l-4.83-.41l-1.89-4.46c-.34-.81-1.5-.81-1.84%200L9.19%208.63l-4.83.41c-.88.07-1.24%201.17-.57%201.75l3.67%203.18l-1.1%204.72c-.2.86.73%201.54%201.49%201.08z%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%22m12%2017.27l4.15%202.51c.76.46%201.69-.22%201.49-1.08l-1.1-4.72l3.67-3.18c.67-.58.31-1.68-.57-1.75l-4.83-.41l-1.89-4.46c-.34-.81-1.5-.81-1.84%200L9.19%208.63l-4.83.41c-.88.07-1.24%201.17-.57%201.75l3.67%203.18l-1.1%204.72c-.2.86.73%201.54%201.49%201.08z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ic/round-star.svg?color=%231a73e8&size=48
