ICONYZ
日本語
Weather Icons の Cloudy Gusts アイコン

Cloudy Gusts アイコン

wi:cloudy-gusts

Cloudy Gusts アイコン(wi:cloudy-gusts)は、Weather Icons セットの無料 SVG アイコンです(作者: Erik Flowers)。 30 × 30 のグリッドで描かれています。 Weather Icons は Open Font License で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット
Weather Icons
作者
Erik Flowers
ライセンス
OFL-1.1
サイズ
30 × 30
タグ
cloudygusts、gust、owm 802、owm 771、owm 801
SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30"><path fill="currentColor" d="M3.62 21.01c0-.25.08-.46.25-.63q.255-.24.6-.24h5.42c.74 0 1.37.26 1.89.79s.78 1.16.78 1.9s-.26 1.38-.78 1.9q-.78.78-1.89.78c-1.11 0-1.38-.26-1.9-.79a.8.8 0 0 1-.23-.6c0-.24.08-.45.23-.6q.225-.24.6-.24c.23 0 .43.08.61.24c.2.19.43.29.69.29s.49-.1.68-.29a.95.95 0 0 0 .29-.7c0-.26-.1-.49-.29-.68s-.42-.29-.68-.29H4.47c-.23 0-.43-.08-.6-.25s-.25-.35-.25-.59m0-3.04c0-.24.08-.45.25-.62q.255-.24.6-.24h10.55c.26 0 .49-.1.68-.29s.29-.43.29-.69s-.1-.5-.29-.69a.94.94 0 0 0-.68-.29c-.28 0-.5.09-.68.28c-.18.15-.39.23-.64.23c-.24 0-.44-.08-.6-.23a.8.8 0 0 1-.23-.6c0-.25.07-.45.23-.61c.51-.51 1.15-.76 1.92-.76c.74 0 1.38.26 1.9.78s.78 1.15.78 1.88s-.26 1.37-.78 1.89s-1.15.78-1.9.78H4.47q-.36 0-.6-.24a.74.74 0 0 1-.25-.58m2.15-2.36c0 .08.05.12.16.12h1.44c.08 0 .15-.05.22-.15c.22-.54.58-.99 1.05-1.35q.72-.54 1.59-.6l.53-.08c.13 0 .2-.06.2-.17l.07-.52c.11-1.08.56-1.99 1.37-2.72s1.76-1.1 2.86-1.1c1.11 0 2.07.36 2.88 1.09s1.27 1.64 1.39 2.73l.07.59c0 .11.06.17.17.17h1.62c.91 0 1.68.32 2.33.96s.97 1.4.97 2.3c0 .89-.32 1.66-.97 2.3s-1.42.96-2.33.96h-6.91c-.12 0-.19.06-.19.17v1.39c0 .11.06.17.19.17h6.91c.91 0 1.74-.22 2.51-.67c.77-.44 1.37-1.05 1.82-1.81c.45-.77.67-1.6.67-2.5c0-.91-.22-1.74-.67-2.5a4.94 4.94 0 0 0-1.82-1.81c-.77-.44-1.6-.67-2.51-.67h-.31q-.465-1.995-2.1-3.27c-1.08-.85-2.33-1.27-3.73-1.27q-2.115 0-3.75 1.32c-1.635 1.32-1.78 2-2.07 3.37q-1.29.3-2.28 1.23c-.99.93-1.12 1.36-1.38 2.21z"/></svg>

Cloudy Gusts アイコンの使い方

React

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

<Icon icon="wi:cloudy-gusts" width="24" />

Vue

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

<template>
  <Icon icon="wi:cloudy-gusts" width="24" />
</template>

Svelte

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

<Icon icon="wi:cloudy-gusts" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[wi--cloudy-gusts]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/wi -->
<div class="i-wi:cloudy-gusts"></div>

Web コンポーネント

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

<iconify-icon icon="wi:cloudy-gusts"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/wi/cloudy-gusts.svg" alt="Cloudy Gusts アイコン" width="24" height="24">

Weather Icons の関連アイコン

他のアイコンセットの Cloudy Gusts アイコン

Cloudy Gusts アイコン のよくある質問

Cloudy Gusts アイコンは商用利用でも無料ですか?

はい。Weather Icons は Open Font License で公開されており、個人・商用プロジェクトで利用できます。

React で Cloudy Gusts アイコンを使うには?

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

Cloudy Gusts アイコンをウェブページに追加するには?

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

Weather Icons をすべて見る →