sparkle icon
sparkle-fill from Keyline Icons by Keyline Icons · Fill · MIT Free for personal and commercial use.
- Name
- sparkle-fill
- Set
- Keyline Icons
- Style
- Fill
- Viewbox
- 24×24
- License
- MIT
7 other variants in Keyline Icons
The same icon in other sets
sparkleCodiconssparkleEmoji One (Colored)sparkle-12-filledFluent UI System IconssparkleFluent EmojisparkleFluent Emoji FlatsparkleFluent Emoji High ContrastsparkleFirefox OS EmojisparkleHuge IconssparkleLucidesparkleNoto Emojisparkle-16OcticonssparkleOpenMojisparklePhosphorsparklePixelarticonssparkleTabler IconssparkleTwitter Emoji
Use the sparkle icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M13.3954 2.9497L15.4809 8.2374C15.5317 8.3663 15.6337 8.4683 15.7626 8.5191L21.0503 10.6046C21.6234 10.8306 22 11.384 22 12C22 12.616 21.6234 13.1694 21.0503 13.3954L15.7626 15.4809C15.6337 15.5317 15.5317 15.6337 15.4809 15.7626L13.3954 21.0503C13.1694 21.6234 12.616 22 12 22C11.384 22 10.8306 21.6234 10.6046 21.0503L8.5191 15.7626C8.4683 15.6337 8.3663 15.5317 8.2374 15.4809L2.9497 13.3954C2.3766 13.1694 2 12.616 2 12C2 11.384 2.3766 10.8306 2.9497 10.6046L8.2374 8.5191C8.3663 8.4683 8.4683 8.3663 8.5191 8.2374L10.6046 2.9497C10.8306 2.3766 11.384 2 12 2C12.616 2 13.1694 2.3766 13.3954 2.9497Z"/></svg>
React
import type { SVGProps } from "react";
export function KeylineIconsSparkleFill(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="M13.3954 2.9497L15.4809 8.2374C15.5317 8.3663 15.6337 8.4683 15.7626 8.5191L21.0503 10.6046C21.6234 10.8306 22 11.384 22 12C22 12.616 21.6234 13.1694 21.0503 13.3954L15.7626 15.4809C15.6337 15.5317 15.5317 15.6337 15.4809 15.7626L13.3954 21.0503C13.1694 21.6234 12.616 22 12 22C11.384 22 10.8306 21.6234 10.6046 21.0503L8.5191 15.7626C8.4683 15.6337 8.3663 15.5317 8.2374 15.4809L2.9497 13.3954C2.3766 13.1694 2 12.616 2 12C2 11.384 2.3766 10.8306 2.9497 10.6046L8.2374 8.5191C8.3663 8.4683 8.4683 8.3663 8.5191 8.2374L10.6046 2.9497C10.8306 2.3766 11.384 2 12 2C12.616 2 13.1694 2.3766 13.3954 2.9497Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M13.3954 2.9497L15.4809 8.2374C15.5317 8.3663 15.6337 8.4683 15.7626 8.5191L21.0503 10.6046C21.6234 10.8306 22 11.384 22 12C22 12.616 21.6234 13.1694 21.0503 13.3954L15.7626 15.4809C15.6337 15.5317 15.5317 15.6337 15.4809 15.7626L13.3954 21.0503C13.1694 21.6234 12.616 22 12 22C11.384 22 10.8306 21.6234 10.6046 21.0503L8.5191 15.7626C8.4683 15.6337 8.3663 15.5317 8.2374 15.4809L2.9497 13.3954C2.3766 13.1694 2 12.616 2 12C2 11.384 2.3766 10.8306 2.9497 10.6046L8.2374 8.5191C8.3663 8.4683 8.4683 8.3663 8.5191 8.2374L10.6046 2.9497C10.8306 2.3766 11.384 2 12 2C12.616 2 13.1694 2.3766 13.3954 2.9497Z"/></svg> </template>
CSS
.icon-sparkle-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%20d%3D%22M13.3954%202.9497L15.4809%208.2374C15.5317%208.3663%2015.6337%208.4683%2015.7626%208.5191L21.0503%2010.6046C21.6234%2010.8306%2022%2011.384%2022%2012C22%2012.616%2021.6234%2013.1694%2021.0503%2013.3954L15.7626%2015.4809C15.6337%2015.5317%2015.5317%2015.6337%2015.4809%2015.7626L13.3954%2021.0503C13.1694%2021.6234%2012.616%2022%2012%2022C11.384%2022%2010.8306%2021.6234%2010.6046%2021.0503L8.5191%2015.7626C8.4683%2015.6337%208.3663%2015.5317%208.2374%2015.4809L2.9497%2013.3954C2.3766%2013.1694%202%2012.616%202%2012C2%2011.384%202.3766%2010.8306%202.9497%2010.6046L8.2374%208.5191C8.3663%208.4683%208.4683%208.3663%208.5191%208.2374L10.6046%202.9497C10.8306%202.3766%2011.384%202%2012%202C12.616%202%2013.1694%202.3766%2013.3954%202.9497Z%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%22M13.3954%202.9497L15.4809%208.2374C15.5317%208.3663%2015.6337%208.4683%2015.7626%208.5191L21.0503%2010.6046C21.6234%2010.8306%2022%2011.384%2022%2012C22%2012.616%2021.6234%2013.1694%2021.0503%2013.3954L15.7626%2015.4809C15.6337%2015.5317%2015.5317%2015.6337%2015.4809%2015.7626L13.3954%2021.0503C13.1694%2021.6234%2012.616%2022%2012%2022C11.384%2022%2010.8306%2021.6234%2010.6046%2021.0503L8.5191%2015.7626C8.4683%2015.6337%208.3663%2015.5317%208.2374%2015.4809L2.9497%2013.3954C2.3766%2013.1694%202%2012.616%202%2012C2%2011.384%202.3766%2010.8306%202.9497%2010.6046L8.2374%208.5191C8.3663%208.4683%208.4683%208.3663%208.5191%208.2374L10.6046%202.9497C10.8306%202.3766%2011.384%202%2012%202C12.616%202%2013.1694%202.3766%2013.3954%202.9497Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/keyline-icons/sparkle-fill.svg?color=%231a73e8&size=48
