sparkle icon

sparkle-24 from Octicons by GitHub · 24 · MIT Free for personal and commercial use.

Name
sparkle-24
Set
Octicons
Style
24
Viewbox
24×24
License
MIT

1 other variant in Octicons

sparkle-16

The same icon in other sets

sparkleCodiconssparkleEmoji One (Colored)sparkle-12-filledFluent UI System IconssparkleFluent EmojisparkleFluent Emoji FlatsparkleFluent Emoji High ContrastsparkleFirefox OS EmojisparkleHuge IconssparkleLucidesparkleNoto EmojisparkleOpenMojisparklePhosphorsparklePixelarticonssparkleTabler IconssparkleTwitter Emoji

Related icons in Octicons

sparkle-fill-16

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="M11.191.565c.275-.754 1.342-.753 1.618 0l1.918 5.238a5.83 5.83 0 0 0 3.47 3.47l5.237 1.918c.755.275.755 1.342 0 1.618l-5.237 1.918a5.83 5.83 0 0 0-3.47 3.47l-1.918 5.237c-.276.755-1.343.755-1.618 0l-1.918-5.237a5.83 5.83 0 0 0-3.47-3.47L.565 12.809c-.753-.276-.754-1.342 0-1.618l5.238-1.918a5.83 5.83 0 0 0 3.47-3.47zm-.505 5.756a7.34 7.34 0 0 1-4.365 4.365L2.73 12l3.591 1.315a7.33 7.33 0 0 1 4.365 4.365L12 21.269l1.315-3.589a7.33 7.33 0 0 1 4.365-4.365L21.269 12l-3.589-1.314a7.33 7.33 0 0 1-4.365-4.365L12 2.73z"/></svg>

React

import type { SVGProps } from "react";

export function OcticonSparkle24(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="M11.191.565c.275-.754 1.342-.753 1.618 0l1.918 5.238a5.83 5.83 0 0 0 3.47 3.47l5.237 1.918c.755.275.755 1.342 0 1.618l-5.237 1.918a5.83 5.83 0 0 0-3.47 3.47l-1.918 5.237c-.276.755-1.343.755-1.618 0l-1.918-5.237a5.83 5.83 0 0 0-3.47-3.47L.565 12.809c-.753-.276-.754-1.342 0-1.618l5.238-1.918a5.83 5.83 0 0 0 3.47-3.47zm-.505 5.756a7.34 7.34 0 0 1-4.365 4.365L2.73 12l3.591 1.315a7.33 7.33 0 0 1 4.365 4.365L12 21.269l1.315-3.589a7.33 7.33 0 0 1 4.365-4.365L21.269 12l-3.589-1.314a7.33 7.33 0 0 1-4.365-4.365L12 2.73z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M11.191.565c.275-.754 1.342-.753 1.618 0l1.918 5.238a5.83 5.83 0 0 0 3.47 3.47l5.237 1.918c.755.275.755 1.342 0 1.618l-5.237 1.918a5.83 5.83 0 0 0-3.47 3.47l-1.918 5.237c-.276.755-1.343.755-1.618 0l-1.918-5.237a5.83 5.83 0 0 0-3.47-3.47L.565 12.809c-.753-.276-.754-1.342 0-1.618l5.238-1.918a5.83 5.83 0 0 0 3.47-3.47zm-.505 5.756a7.34 7.34 0 0 1-4.365 4.365L2.73 12l3.591 1.315a7.33 7.33 0 0 1 4.365 4.365L12 21.269l1.315-3.589a7.33 7.33 0 0 1 4.365-4.365L21.269 12l-3.589-1.314a7.33 7.33 0 0 1-4.365-4.365L12 2.73z"/></svg>
</template>

CSS

.icon-sparkle-24 {
  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%22M11.191.565c.275-.754%201.342-.753%201.618%200l1.918%205.238a5.83%205.83%200%200%200%203.47%203.47l5.237%201.918c.755.275.755%201.342%200%201.618l-5.237%201.918a5.83%205.83%200%200%200-3.47%203.47l-1.918%205.237c-.276.755-1.343.755-1.618%200l-1.918-5.237a5.83%205.83%200%200%200-3.47-3.47L.565%2012.809c-.753-.276-.754-1.342%200-1.618l5.238-1.918a5.83%205.83%200%200%200%203.47-3.47zm-.505%205.756a7.34%207.34%200%200%201-4.365%204.365L2.73%2012l3.591%201.315a7.33%207.33%200%200%201%204.365%204.365L12%2021.269l1.315-3.589a7.33%207.33%200%200%201%204.365-4.365L21.269%2012l-3.589-1.314a7.33%207.33%200%200%201-4.365-4.365L12%202.73z%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%22M11.191.565c.275-.754%201.342-.753%201.618%200l1.918%205.238a5.83%205.83%200%200%200%203.47%203.47l5.237%201.918c.755.275.755%201.342%200%201.618l-5.237%201.918a5.83%205.83%200%200%200-3.47%203.47l-1.918%205.237c-.276.755-1.343.755-1.618%200l-1.918-5.237a5.83%205.83%200%200%200-3.47-3.47L.565%2012.809c-.753-.276-.754-1.342%200-1.618l5.238-1.918a5.83%205.83%200%200%200%203.47-3.47zm-.505%205.756a7.34%207.34%200%200%201-4.365%204.365L2.73%2012l3.591%201.315a7.33%207.33%200%200%201%204.365%204.365L12%2021.269l1.315-3.589a7.33%207.33%200%200%201%204.365-4.365L21.269%2012l-3.589-1.314a7.33%207.33%200%200%201-4.365-4.365L12%202.73z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/octicon/sparkle-24.svg?color=%231a73e8&size=48