sunset icon
sunset-fill from MingCute Icon by MingCute Design · Fill · Apache-2.0 Free for personal and commercial use.
- Name
- sunset-fill
- Set
- MingCute Icon
- Style
- Fill
- Viewbox
- 24×24
- License
- Apache 2.0
1 other variant in MingCute Icon
The same icon in other sets
sunsetBootstrap IconssunsetCarbonsunsetEmoji One (Colored)sunsetElement PlussunsetFramework7 IconssunsetFeather IconssunsetFluent EmojisunsetFluent Emoji FlatsunsetFluent Emoji High ContrastsunsetHuge IconssunsetIconParksunsetIconPark OutlinesunsetIconPark SolidsunsetIconPark TwoTonesunsetLucidesunsetMyna UI IconssunsetNoto EmojisunsetOpenMojisunset-boldSolarsunsetTabler IconssunsetTwitter EmojisunsetUnicons
Use the sunset icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M12 1.879a1 1 0 0 1 1 1v2.706l.414-.414a1 1 0 1 1 1.414 1.414l-2.12 2.121a1 1 0 0 1-1.415 0L9.172 6.585a1 1 0 1 1 1.414-1.414l.414.414V2.879a1 1 0 0 1 1-1m5.657 7.05a1 1 0 0 1 1.414 1.415l-.707.707a1 1 0 1 1-1.414-1.414zM4.929 8.93a1 1 0 0 1 1.414 0l.707.707a1 1 0 1 1-1.414 1.414l-.707-.707a1 1 0 0 1 0-1.414m12.268 10.071a6 6 0 1 0-10.394 0H4a1 1 0 1 0 0 2h16a1 1 0 1 0 0-2zM2 16.001a1 1 0 0 1 1-1h1a1 1 0 1 1 0 2H3a1 1 0 0 1-1-1m17 0a1 1 0 0 1 1-1h1a1 1 0 1 1 0 2h-1a1 1 0 0 1-1-1" clip-rule="evenodd"/></svg>
React
import type { SVGProps } from "react";
export function MingcuteSunsetFill(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" fillRule="evenodd" d="M12 1.879a1 1 0 0 1 1 1v2.706l.414-.414a1 1 0 1 1 1.414 1.414l-2.12 2.121a1 1 0 0 1-1.415 0L9.172 6.585a1 1 0 1 1 1.414-1.414l.414.414V2.879a1 1 0 0 1 1-1m5.657 7.05a1 1 0 0 1 1.414 1.415l-.707.707a1 1 0 1 1-1.414-1.414zM4.929 8.93a1 1 0 0 1 1.414 0l.707.707a1 1 0 1 1-1.414 1.414l-.707-.707a1 1 0 0 1 0-1.414m12.268 10.071a6 6 0 1 0-10.394 0H4a1 1 0 1 0 0 2h16a1 1 0 1 0 0-2zM2 16.001a1 1 0 0 1 1-1h1a1 1 0 1 1 0 2H3a1 1 0 0 1-1-1m17 0a1 1 0 0 1 1-1h1a1 1 0 1 1 0 2h-1a1 1 0 0 1-1-1" clipRule="evenodd"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M12 1.879a1 1 0 0 1 1 1v2.706l.414-.414a1 1 0 1 1 1.414 1.414l-2.12 2.121a1 1 0 0 1-1.415 0L9.172 6.585a1 1 0 1 1 1.414-1.414l.414.414V2.879a1 1 0 0 1 1-1m5.657 7.05a1 1 0 0 1 1.414 1.415l-.707.707a1 1 0 1 1-1.414-1.414zM4.929 8.93a1 1 0 0 1 1.414 0l.707.707a1 1 0 1 1-1.414 1.414l-.707-.707a1 1 0 0 1 0-1.414m12.268 10.071a6 6 0 1 0-10.394 0H4a1 1 0 1 0 0 2h16a1 1 0 1 0 0-2zM2 16.001a1 1 0 0 1 1-1h1a1 1 0 1 1 0 2H3a1 1 0 0 1-1-1m17 0a1 1 0 0 1 1-1h1a1 1 0 1 1 0 2h-1a1 1 0 0 1-1-1" clip-rule="evenodd"/></svg> </template>
CSS
.icon-sunset-fill {
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%20fill-rule%3D%22evenodd%22%20d%3D%22M12%201.879a1%201%200%200%201%201%201v2.706l.414-.414a1%201%200%201%201%201.414%201.414l-2.12%202.121a1%201%200%200%201-1.415%200L9.172%206.585a1%201%200%201%201%201.414-1.414l.414.414V2.879a1%201%200%200%201%201-1m5.657%207.05a1%201%200%200%201%201.414%201.415l-.707.707a1%201%200%201%201-1.414-1.414zM4.929%208.93a1%201%200%200%201%201.414%200l.707.707a1%201%200%201%201-1.414%201.414l-.707-.707a1%201%200%200%201%200-1.414m12.268%2010.071a6%206%200%201%200-10.394%200H4a1%201%200%201%200%200%202h16a1%201%200%201%200%200-2zM2%2016.001a1%201%200%200%201%201-1h1a1%201%200%201%201%200%202H3a1%201%200%200%201-1-1m17%200a1%201%200%200%201%201-1h1a1%201%200%201%201%200%202h-1a1%201%200%200%201-1-1%22%20clip-rule%3D%22evenodd%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%20fill-rule%3D%22evenodd%22%20d%3D%22M12%201.879a1%201%200%200%201%201%201v2.706l.414-.414a1%201%200%201%201%201.414%201.414l-2.12%202.121a1%201%200%200%201-1.415%200L9.172%206.585a1%201%200%201%201%201.414-1.414l.414.414V2.879a1%201%200%200%201%201-1m5.657%207.05a1%201%200%200%201%201.414%201.415l-.707.707a1%201%200%201%201-1.414-1.414zM4.929%208.93a1%201%200%200%201%201.414%200l.707.707a1%201%200%201%201-1.414%201.414l-.707-.707a1%201%200%200%201%200-1.414m12.268%2010.071a6%206%200%201%200-10.394%200H4a1%201%200%201%200%200%202h16a1%201%200%201%200%200-2zM2%2016.001a1%201%200%200%201%201-1h1a1%201%200%201%201%200%202H3a1%201%200%200%201-1-1m17%200a1%201%200%200%201%201-1h1a1%201%200%201%201%200%202h-1a1%201%200%200%201-1-1%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/mingcute/sunset-fill.svg?color=%231a73e8&size=48
