Snowflake Line アイコン
clarity:snowflake-line
Snowflake Line アイコン(clarity:snowflake-line)は、Clarity セットの無料 SVG アイコンです(作者: VMware)。 36 × 36 のグリッドで描かれています。 Clarity icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="36" height="36" viewBox="0 0 36 36"><path fill="currentColor" d="M18.05 33.61a1 1 0 0 1-1-1V3.37a1 1 0 1 1 1.95 0v29.26a1 1 0 0 1-.95.98" class="clr-i-outline clr-i-outline-path-1"/><path fill="currentColor" d="m18.06 10.07l-3.54-3.53a1 1 0 0 1 0-1.41a1 1 0 0 1 1.41 0l2.13 2.12l2.12-2.12a1 1 0 0 1 1.41 0a1 1 0 0 1 0 1.41Z" class="clr-i-outline clr-i-outline-path-2"/><path fill="currentColor" d="M20.85 31.17a1 1 0 0 1-.7-.29L18 28.76l-2.1 2.12a1 1 0 0 1-1.41 0a1 1 0 0 1 0-1.42L18 25.93l3.54 3.53a1 1 0 0 1 0 1.42a1 1 0 0 1-.69.29" class="clr-i-outline clr-i-outline-path-3"/><path fill="currentColor" d="M30.92 26.5a1 1 0 0 1-.5-.13l-26-15A1 1 0 0 1 4.07 10a1 1 0 0 1 1.37-.36l26 15a1 1 0 0 1-.5 1.87Z" class="clr-i-outline clr-i-outline-path-4"/><path fill="currentColor" d="M6 15.37a1 1 0 0 1-.26-2l2.9-.78l-.8-2.86a1 1 0 1 1 1.93-.52l1.3 4.79l-4.83 1.33a.8.8 0 0 1-.24.04" class="clr-i-outline clr-i-outline-path-5"/><path fill="currentColor" d="M27.05 27.54a1 1 0 0 1-1-.75L24.8 22l4.82-1.3a1 1 0 1 1 .52 1.93l-2.9.78l.78 2.9a1 1 0 0 1-.71 1.22a.8.8 0 0 1-.26.01" class="clr-i-outline clr-i-outline-path-6"/><path fill="currentColor" d="M4.94 26.5a1 1 0 0 1-.5-1.87l26-15a1 1 0 0 1 1.36.36a1 1 0 0 1-.36 1.37l-26 15a1 1 0 0 1-.5.14" class="clr-i-outline clr-i-outline-path-7"/><path fill="currentColor" d="M8.81 27.54a.8.8 0 0 1-.26 0a1 1 0 0 1-.71-1.22l.78-2.9l-2.9-.78A1 1 0 0 1 5 21.38a1 1 0 0 1 1.23-.71L11.07 22l-1.3 4.82a1 1 0 0 1-.96.72" class="clr-i-outline clr-i-outline-path-8"/><path fill="currentColor" d="M29.88 15.37a.8.8 0 0 1-.26 0L24.8 14l1.29-4.83a1 1 0 1 1 1.91.56l-.78 2.89l2.9.78a1 1 0 0 1-.26 2Z" class="clr-i-outline clr-i-outline-path-9"/><path fill="none" d="M0 0h36v36H0z"/></svg>Snowflake Line アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="clarity:snowflake-line" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="clarity:snowflake-line" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="clarity:snowflake-line" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[clarity--snowflake-line]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/clarity -->
<div class="i-clarity:snowflake-line"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="clarity:snowflake-line"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/clarity/snowflake-line.svg" alt="Snowflake Line アイコン" width="24" height="24">他のアイコンセットの Snowflake Line アイコン
Snowflake Line アイコン のよくある質問
Snowflake Line アイコンは商用利用でも無料ですか?
はい。Clarity icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Snowflake Line アイコンを使うには?
@iconify/react をインストールして <Icon icon="clarity:snowflake-line" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Snowflake Line アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/clarity/snowflake-line.svg" alt="Snowflake Line アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。