sparkles icon
sparkles from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.
- Name
- sparkles
- Set
- IonIcons
- Style
- Regular
- Viewbox
- 512×512
- License
- MIT
2 other variants in IonIcons
The same icon in other sets
sparklesAkar IconssparklesEmoji One (Colored)sparklesFramework7 IconssparklesFluent EmojisparklesFluent Emoji FlatsparklesFluent Emoji High ContrastsparklesFirefox OS EmojisparklesHeroIconssparklesHuge IconssparklesLucidesparklesMajesticonssparkles-fillMingCute IconsparklesMyna UI IconssparklesNoto EmojisparklesOpenMojisparklesPixelarticonssparklesPrime IconssparklesStreamline EmojissparklesTabler IconssparklesTwitter Emoji
Use the sparkles icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M208 512a24.84 24.84 0 0 1-23.34-16l-39.84-103.6a16.06 16.06 0 0 0-9.19-9.19L32 343.34a25 25 0 0 1 0-46.68l103.6-39.84a16.06 16.06 0 0 0 9.19-9.19L184.66 144a25 25 0 0 1 46.68 0l39.84 103.6a16.06 16.06 0 0 0 9.19 9.19l103 39.63a25.49 25.49 0 0 1 16.63 24.1a24.82 24.82 0 0 1-16 22.82l-103.6 39.84a16.06 16.06 0 0 0-9.19 9.19L231.34 496A24.84 24.84 0 0 1 208 512M88 176a14.67 14.67 0 0 1-13.69-9.4l-16.86-43.84a7.28 7.28 0 0 0-4.21-4.21L9.4 101.69a14.67 14.67 0 0 1 0-27.38l43.84-16.86a7.3 7.3 0 0 0 4.21-4.21L74.16 9.79A15 15 0 0 1 86.23.11a14.67 14.67 0 0 1 15.46 9.29l16.86 43.84a7.3 7.3 0 0 0 4.21 4.21l43.84 16.86a14.67 14.67 0 0 1 0 27.38l-43.84 16.86a7.28 7.28 0 0 0-4.21 4.21l-16.86 43.84A14.67 14.67 0 0 1 88 176m312 80a16 16 0 0 1-14.93-10.26l-22.84-59.37a8 8 0 0 0-4.6-4.6l-59.37-22.84a16 16 0 0 1 0-29.86l59.37-22.84a8 8 0 0 0 4.6-4.6l22.67-58.95a16.45 16.45 0 0 1 13.17-10.57a16 16 0 0 1 16.86 10.15l22.84 59.37a8 8 0 0 0 4.6 4.6l59.37 22.84a16 16 0 0 1 0 29.86l-59.37 22.84a8 8 0 0 0-4.6 4.6l-22.84 59.37A16 16 0 0 1 400 256"/></svg>
React
import type { SVGProps } from "react";
export function IonSparkles(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M208 512a24.84 24.84 0 0 1-23.34-16l-39.84-103.6a16.06 16.06 0 0 0-9.19-9.19L32 343.34a25 25 0 0 1 0-46.68l103.6-39.84a16.06 16.06 0 0 0 9.19-9.19L184.66 144a25 25 0 0 1 46.68 0l39.84 103.6a16.06 16.06 0 0 0 9.19 9.19l103 39.63a25.49 25.49 0 0 1 16.63 24.1a24.82 24.82 0 0 1-16 22.82l-103.6 39.84a16.06 16.06 0 0 0-9.19 9.19L231.34 496A24.84 24.84 0 0 1 208 512M88 176a14.67 14.67 0 0 1-13.69-9.4l-16.86-43.84a7.28 7.28 0 0 0-4.21-4.21L9.4 101.69a14.67 14.67 0 0 1 0-27.38l43.84-16.86a7.3 7.3 0 0 0 4.21-4.21L74.16 9.79A15 15 0 0 1 86.23.11a14.67 14.67 0 0 1 15.46 9.29l16.86 43.84a7.3 7.3 0 0 0 4.21 4.21l43.84 16.86a14.67 14.67 0 0 1 0 27.38l-43.84 16.86a7.28 7.28 0 0 0-4.21 4.21l-16.86 43.84A14.67 14.67 0 0 1 88 176m312 80a16 16 0 0 1-14.93-10.26l-22.84-59.37a8 8 0 0 0-4.6-4.6l-59.37-22.84a16 16 0 0 1 0-29.86l59.37-22.84a8 8 0 0 0 4.6-4.6l22.67-58.95a16.45 16.45 0 0 1 13.17-10.57a16 16 0 0 1 16.86 10.15l22.84 59.37a8 8 0 0 0 4.6 4.6l59.37 22.84a16 16 0 0 1 0 29.86l-59.37 22.84a8 8 0 0 0-4.6 4.6l-22.84 59.37A16 16 0 0 1 400 256"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M208 512a24.84 24.84 0 0 1-23.34-16l-39.84-103.6a16.06 16.06 0 0 0-9.19-9.19L32 343.34a25 25 0 0 1 0-46.68l103.6-39.84a16.06 16.06 0 0 0 9.19-9.19L184.66 144a25 25 0 0 1 46.68 0l39.84 103.6a16.06 16.06 0 0 0 9.19 9.19l103 39.63a25.49 25.49 0 0 1 16.63 24.1a24.82 24.82 0 0 1-16 22.82l-103.6 39.84a16.06 16.06 0 0 0-9.19 9.19L231.34 496A24.84 24.84 0 0 1 208 512M88 176a14.67 14.67 0 0 1-13.69-9.4l-16.86-43.84a7.28 7.28 0 0 0-4.21-4.21L9.4 101.69a14.67 14.67 0 0 1 0-27.38l43.84-16.86a7.3 7.3 0 0 0 4.21-4.21L74.16 9.79A15 15 0 0 1 86.23.11a14.67 14.67 0 0 1 15.46 9.29l16.86 43.84a7.3 7.3 0 0 0 4.21 4.21l43.84 16.86a14.67 14.67 0 0 1 0 27.38l-43.84 16.86a7.28 7.28 0 0 0-4.21 4.21l-16.86 43.84A14.67 14.67 0 0 1 88 176m312 80a16 16 0 0 1-14.93-10.26l-22.84-59.37a8 8 0 0 0-4.6-4.6l-59.37-22.84a16 16 0 0 1 0-29.86l59.37-22.84a8 8 0 0 0 4.6-4.6l22.67-58.95a16.45 16.45 0 0 1 13.17-10.57a16 16 0 0 1 16.86 10.15l22.84 59.37a8 8 0 0 0 4.6 4.6l59.37 22.84a16 16 0 0 1 0 29.86l-59.37 22.84a8 8 0 0 0-4.6 4.6l-22.84 59.37A16 16 0 0 1 400 256"/></svg> </template>
CSS
.icon-sparkles {
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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M208%20512a24.84%2024.84%200%200%201-23.34-16l-39.84-103.6a16.06%2016.06%200%200%200-9.19-9.19L32%20343.34a25%2025%200%200%201%200-46.68l103.6-39.84a16.06%2016.06%200%200%200%209.19-9.19L184.66%20144a25%2025%200%200%201%2046.68%200l39.84%20103.6a16.06%2016.06%200%200%200%209.19%209.19l103%2039.63a25.49%2025.49%200%200%201%2016.63%2024.1a24.82%2024.82%200%200%201-16%2022.82l-103.6%2039.84a16.06%2016.06%200%200%200-9.19%209.19L231.34%20496A24.84%2024.84%200%200%201%20208%20512M88%20176a14.67%2014.67%200%200%201-13.69-9.4l-16.86-43.84a7.28%207.28%200%200%200-4.21-4.21L9.4%20101.69a14.67%2014.67%200%200%201%200-27.38l43.84-16.86a7.3%207.3%200%200%200%204.21-4.21L74.16%209.79A15%2015%200%200%201%2086.23.11a14.67%2014.67%200%200%201%2015.46%209.29l16.86%2043.84a7.3%207.3%200%200%200%204.21%204.21l43.84%2016.86a14.67%2014.67%200%200%201%200%2027.38l-43.84%2016.86a7.28%207.28%200%200%200-4.21%204.21l-16.86%2043.84A14.67%2014.67%200%200%201%2088%20176m312%2080a16%2016%200%200%201-14.93-10.26l-22.84-59.37a8%208%200%200%200-4.6-4.6l-59.37-22.84a16%2016%200%200%201%200-29.86l59.37-22.84a8%208%200%200%200%204.6-4.6l22.67-58.95a16.45%2016.45%200%200%201%2013.17-10.57a16%2016%200%200%201%2016.86%2010.15l22.84%2059.37a8%208%200%200%200%204.6%204.6l59.37%2022.84a16%2016%200%200%201%200%2029.86l-59.37%2022.84a8%208%200%200%200-4.6%204.6l-22.84%2059.37A16%2016%200%200%201%20400%20256%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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M208%20512a24.84%2024.84%200%200%201-23.34-16l-39.84-103.6a16.06%2016.06%200%200%200-9.19-9.19L32%20343.34a25%2025%200%200%201%200-46.68l103.6-39.84a16.06%2016.06%200%200%200%209.19-9.19L184.66%20144a25%2025%200%200%201%2046.68%200l39.84%20103.6a16.06%2016.06%200%200%200%209.19%209.19l103%2039.63a25.49%2025.49%200%200%201%2016.63%2024.1a24.82%2024.82%200%200%201-16%2022.82l-103.6%2039.84a16.06%2016.06%200%200%200-9.19%209.19L231.34%20496A24.84%2024.84%200%200%201%20208%20512M88%20176a14.67%2014.67%200%200%201-13.69-9.4l-16.86-43.84a7.28%207.28%200%200%200-4.21-4.21L9.4%20101.69a14.67%2014.67%200%200%201%200-27.38l43.84-16.86a7.3%207.3%200%200%200%204.21-4.21L74.16%209.79A15%2015%200%200%201%2086.23.11a14.67%2014.67%200%200%201%2015.46%209.29l16.86%2043.84a7.3%207.3%200%200%200%204.21%204.21l43.84%2016.86a14.67%2014.67%200%200%201%200%2027.38l-43.84%2016.86a7.28%207.28%200%200%200-4.21%204.21l-16.86%2043.84A14.67%2014.67%200%200%201%2088%20176m312%2080a16%2016%200%200%201-14.93-10.26l-22.84-59.37a8%208%200%200%200-4.6-4.6l-59.37-22.84a16%2016%200%200%201%200-29.86l59.37-22.84a8%208%200%200%200%204.6-4.6l22.67-58.95a16.45%2016.45%200%200%201%2013.17-10.57a16%2016%200%200%201%2016.86%2010.15l22.84%2059.37a8%208%200%200%200%204.6%204.6l59.37%2022.84a16%2016%200%200%201%200%2029.86l-59.37%2022.84a8%208%200%200%200-4.6%204.6l-22.84%2059.37A16%2016%200%200%201%20400%20256%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/sparkles.svg?color=%231a73e8&size=48
