Sparkles アイコン
reicon:sparkles
Sparkles アイコン(reicon:sparkles)は、Reicon セットの無料 SVG アイコンです。 24 × 24 のグリッドで描かれています。 Reicon icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="currentColor"><path d="M18.818 2.086c.207-.63.311-.946.466-1.03a.45.45 0 0 1 .432 0c.155.084.259.4.466 1.03l.315.959c.042.126.063.19.098.242a.5.5 0 0 0 .118.118c.053.035.116.056.242.098l.959.315c.63.207.946.311 1.03.466a.45.45 0 0 1 0 .432c-.084.155-.4.259-1.03.466l-.959.315c-.126.042-.19.063-.242.098a.5.5 0 0 0-.118.118c-.035.053-.056.116-.098.242l-.315.959c-.207.63-.311.946-.466 1.03a.45.45 0 0 1-.432 0c-.155-.084-.259-.4-.466-1.03l-.315-.959c-.042-.126-.063-.19-.098-.242a.5.5 0 0 0-.118-.118c-.053-.035-.116-.056-.242-.098l-.959-.315c-.63-.207-.946-.311-1.03-.466a.45.45 0 0 1 0-.432c.084-.155.4-.259 1.03-.466l.959-.315c.126-.042.19-.063.242-.098a.5.5 0 0 0 .118-.118c.035-.053.056-.116.098-.242z"/><path fill-rule="evenodd" d="M9.085 3.484a1.9 1.9 0 0 1 1.83 0c.45.247.7.74.88 1.165c.195.462.403 1.094.66 1.875l.822 2.5c.12.366.141.407.16.433a.4.4 0 0 0 .106.107c.026.018.067.038.433.159l2.5.822c.781.257 1.413.465 1.875.66c.425.18.918.43 1.165.88c.312.57.312 1.26 0 1.83c-.247.45-.74.7-1.165.88c-.462.195-1.094.403-1.875.66l-2.5.822c-.366.12-.407.141-.434.16a.4.4 0 0 0-.106.105c-.018.027-.038.068-.159.434l-.822 2.5c-.257.781-.465 1.413-.66 1.875c-.18.425-.43.918-.88 1.165c-.57.312-1.26.312-1.83 0c-.45-.247-.7-.74-.88-1.165c-.195-.462-.403-1.094-.66-1.875l-.822-2.5c-.12-.366-.141-.407-.16-.433a.4.4 0 0 0-.106-.107c-.026-.018-.067-.038-.433-.159l-2.5-.822c-.781-.257-1.413-.465-1.875-.66c-.425-.18-.918-.43-1.165-.88a1.9 1.9 0 0 1 0-1.83c.247-.45.74-.7 1.165-.88c.462-.195 1.094-.403 1.875-.66l2.5-.822c.366-.12.407-.141.433-.16a.4.4 0 0 0 .107-.106c.018-.026.038-.067.159-.433l.822-2.5c.257-.781.465-1.413.66-1.875c.18-.425.43-.918.88-1.165m.736 1.308l-.005.007c-.02.026-.1.13-.23.435c-.168.397-.356.97-.627 1.794l-.811 2.465l-.02.061c-.086.263-.171.523-.325.748a1.9 1.9 0 0 1-.5.501c-.226.154-.486.239-.749.325l-.061.02l-2.465.81c-.825.272-1.397.46-1.794.629c-.305.129-.41.209-.435.229l-.007.005a.4.4 0 0 0 0 .358l.007.005c.026.02.13.1.435.23c.397.168.97.356 1.794.627l2.465.811l.061.02c.263.086.523.171.748.325c.197.134.367.304.501.5c.154.226.239.486.325.749l.02.061l.81 2.465c.272.825.46 1.397.629 1.794c.129.305.209.41.229.435l.005.007a.4.4 0 0 0 .36-.003l.003-.004c.02-.026.1-.13.23-.435c.168-.397.356-.97.627-1.794l.811-2.465l.02-.061c.086-.263.171-.523.325-.748c.134-.197.304-.367.5-.501c.226-.154.487-.239.749-.325l.061-.02l2.465-.81c.825-.272 1.397-.46 1.794-.629c.305-.129.41-.209.435-.229l.007-.005a.4.4 0 0 0 0-.358l-.007-.005c-.026-.02-.13-.1-.435-.23c-.397-.168-.97-.356-1.794-.627l-2.465-.811l-.061-.02c-.262-.086-.523-.171-.748-.325a1.9 1.9 0 0 1-.501-.5c-.154-.226-.239-.486-.325-.749l-.02-.061l-.81-2.465c-.272-.825-.46-1.397-.629-1.794c-.129-.305-.209-.41-.229-.435l-.005-.007a.4.4 0 0 0-.358 0" clip-rule="evenodd"/><path d="M19.346 18.04c-.111.06-.185.286-.333.736l-.225.685c-.03.09-.045.135-.07.172a.3.3 0 0 1-.085.085c-.037.025-.082.04-.172.07l-.685.225c-.45.148-.676.222-.737.333a.32.32 0 0 0 0 .308c.061.111.287.185.737.333l.685.225c.09.03.135.045.172.07a.3.3 0 0 1 .085.085c.025.037.04.082.07.172l.225.685c.148.45.222.676.333.737a.32.32 0 0 0 .308 0c.111-.061.185-.287.333-.737l.225-.685c.03-.09.045-.135.07-.172a.3.3 0 0 1 .085-.085c.037-.025.082-.04.172-.07l.685-.225c.45-.148.676-.222.737-.333a.32.32 0 0 0 0-.308c-.061-.111-.287-.185-.737-.333l-.685-.225c-.09-.03-.135-.045-.172-.07a.3.3 0 0 1-.085-.085c-.025-.037-.04-.082-.07-.172l-.225-.685c-.148-.45-.222-.676-.333-.737a.32.32 0 0 0-.308 0"/></g></svg>Sparkles アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="reicon:sparkles" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="reicon:sparkles" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="reicon:sparkles" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[reicon--sparkles]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/reicon -->
<div class="i-reicon:sparkles"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="reicon:sparkles"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/reicon/sparkles.svg" alt="Sparkles アイコン" width="24" height="24">Reicon の関連アイコン
他のアイコンセットの Sparkles アイコン
Sparkles アイコン のよくある質問
Sparkles アイコンは商用利用でも無料ですか?
はい。Reicon icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Sparkles アイコンを使うには?
@iconify/react をインストールして <Icon icon="reicon:sparkles" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Sparkles アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/reicon/sparkles.svg" alt="Sparkles アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。