ICONYZ
日本語
Meteocons の Windsock Weak Fill アイコン

Windsock Weak Fill アイコン

meteocons:windsock-weak-fill

Windsock Weak Fill アイコン(meteocons:windsock-weak-fill)は、Meteocons セットの無料 SVG アイコンです(作者: Bas Milius)。 512 × 512 のグリッドで描かれています。 Meteocons icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット
Meteocons
作者
Bas Milius
ライセンス
MIT
サイズ
512 × 512
タグ
windsockweak、weakfill、windsockweakfill
SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><defs><linearGradient id="SVGGgESUbuJ" x1="90" x2="206" y1="155.6" y2="356.4" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#d4d7dd"/><stop offset=".5" stop-color="#d4d7dd"/><stop offset="1" stop-color="#bec1c6"/></linearGradient><linearGradient id="SVGWQ5KOcXJ" x1="183.6" x2="221.9" y1="151.2" y2="217.6" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f87171"/><stop offset=".5" stop-color="#f87171"/><stop offset="1" stop-color="#dc2626"/></linearGradient><linearGradient id="SVGBSI54dBo" x1="234.2" x2="262.2" y1="200.2" y2="248.7" href="#SVGWQ5KOcXJ"/><linearGradient id="SVGm5ckslFH" x1="270.9" x2="291.6" y1="252.4" y2="288.4" href="#SVGWQ5KOcXJ"/></defs><path fill="none" stroke="url(#SVGGgESUbuJ)" stroke-linecap="round" stroke-linejoin="round" stroke-width="24" d="M148 376V136"/><path fill="url(#SVGWQ5KOcXJ)" stroke="#ef4444" stroke-miterlimit="10" stroke-width="2" d="m239.7 154.7l-22.8-18a6.4 6.4 0 0 0-9.5 1.8l-41 71a6.4 6.4 0 0 0 3.2 9.2l27 10.7a6.4 6.4 0 0 0 7.9-2.7l36.8-63.8a6.4 6.4 0 0 0-1.6-8.2Z"><animateTransform additive="sum" attributeName="transform" calcMode="spline" dur="3s" keySplines=".42, 0, .58, 1; .42, 0, .58, 1" repeatCount="indefinite" type="rotate" values="0 204 183; -3 204 183; 0 204 183"/><animateTransform additive="sum" attributeName="transform" calcMode="spline" dur="3s" keySplines=".42, 0, .58, 1; .42, 0, .58, 1" repeatCount="indefinite" type="translate" values="0 0; 1 -2; 0 0"/></path><path fill="url(#SVGBSI54dBo)" stroke="#ef4444" stroke-miterlimit="10" stroke-width="2" d="m285.2 210.6l-17.4-23.3a6.4 6.4 0 0 0-9.6-.7L213 231.8a6.4 6.4 0 0 0 .7 9.7l23.3 17.3a6.4 6.4 0 0 0 8.3-.6l39.3-39.2a6.4 6.4 0 0 0 .6-8.4Z"><animateTransform additive="sum" attributeName="transform" calcMode="spline" dur="3s" keySplines=".42, 0, .58, 1; .42, 0, .58, 1" repeatCount="indefinite" type="rotate" values="0 249 222; -6 249 222; 0 249 222"/><animateTransform additive="sum" attributeName="transform" calcMode="spline" dur="3s" keySplines=".42, 0, .58, 1; .42, 0, .58, 1" repeatCount="indefinite" type="translate" values="0 0; 5 -7; 0 0"/></path><path fill="url(#SVGm5ckslFH)" stroke="#ef4444" stroke-miterlimit="10" stroke-width="2" d="m310.5 271.2l-10.7-27a6.4 6.4 0 0 0-9.1-3.2L251 263.9a6.4 6.4 0 0 0-1.9 9.5l18 22.8a6.4 6.4 0 0 0 8.2 1.5l32.4-18.7a6.4 6.4 0 0 0 2.7-7.8Z"><animateTransform additive="sum" attributeName="transform" calcMode="spline" dur="3s" keySplines=".42, 0, .58, 1; .42, 0, .58, 1" repeatCount="indefinite" type="rotate" values="0 279 269; -9 279 269; 0 279 269"/><animateTransform additive="sum" attributeName="transform" calcMode="spline" dur="3s" keySplines=".42, 0, .58, 1; .42, 0, .58, 1" repeatCount="indefinite" type="translate" values="0 0; 17 -12; 0 0"/></path></svg>

Windsock Weak Fill アイコンの使い方

React

import { Icon } from "@iconify/react";

<Icon icon="meteocons:windsock-weak-fill" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="meteocons:windsock-weak-fill" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="meteocons:windsock-weak-fill" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[meteocons--windsock-weak-fill]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/meteocons -->
<div class="i-meteocons:windsock-weak-fill"></div>

Web コンポーネント

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="meteocons:windsock-weak-fill"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/meteocons/windsock-weak-fill.svg" alt="Windsock Weak Fill アイコン" width="24" height="24">

Meteocons の関連アイコン

Windsock Weak Fill アイコン のよくある質問

Windsock Weak Fill アイコンは商用利用でも無料ですか?

はい。Meteocons icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。

React で Windsock Weak Fill アイコンを使うには?

@iconify/react をインストールして <Icon icon="meteocons:windsock-weak-fill" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。

Windsock Weak Fill アイコンをウェブページに追加するには?

画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/meteocons/windsock-weak-fill.svg" alt="Windsock Weak Fill アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。

Meteocons アイコン をすべて見る →