Overcast Snow Fill アイコン
meteocons:overcast-snow-fill
Overcast Snow Fill アイコン(meteocons:overcast-snow-fill)は、Meteocons セットの無料 SVG アイコンです(作者: Bas Milius)。 512 × 512 のグリッドで描かれています。 Meteocons icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- Meteocons
- 作者
- Bas Milius
- ライセンス
- MIT
- サイズ
- 512 × 512
- タグ
- overcastsnow、snowfill、overcastsnowfill
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><defs><linearGradient id="SVGMeEfudbH" x1="99.5" x2="232.6" y1="30.7" y2="261.4" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f3f7fe"/><stop offset=".5" stop-color="#f3f7fe"/><stop offset="1" stop-color="#deeafb"/></linearGradient><linearGradient id="SVGqOTCtbDJ" x1="52.7" x2="133.4" y1="9.6" y2="149.3" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#9ca3af"/><stop offset=".5" stop-color="#9ca3af"/><stop offset="1" stop-color="#6b7280"/></linearGradient><linearGradient id="SVGHakO1cdU" x1="11.4" x2="32.8" y1="5.9" y2="43.1" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#86c3db"/><stop offset=".5" stop-color="#86c3db"/><stop offset="1" stop-color="#5eafcf"/></linearGradient><linearGradient id="SVGkrkRYmMF" x1="67.4" x2="88.8" y1="5.9" y2="43.1" href="#SVGHakO1cdU"/><linearGradient id="SVGS0exAdfk" x1="123.4" x2="144.8" y1="5.9" y2="43.1" href="#SVGHakO1cdU"/><symbol id="SVGa7dgPttN" viewBox="0 0 200.3 126.1"><path fill="url(#SVGqOTCtbDJ)" stroke="#848b98" stroke-miterlimit="10" d="M.5 93.2a32.4 32.4 0 0 0 32.4 32.4h129.8v-.1l2.3.1a34.8 34.8 0 0 0 6.5-68.9a32.4 32.4 0 0 0-48.5-33a48.6 48.6 0 0 0-88.6 37.1h-1.5A32.4 32.4 0 0 0 .5 93.1Z"/></symbol><symbol id="SVGMnBDAb4I" viewBox="0 0 350 222"><path fill="url(#SVGMeEfudbH)" stroke="#e6effc" stroke-miterlimit="10" stroke-width="6" d="m291 107l-2.5.1A83.9 83.9 0 0 0 135.6 43A56 56 0 0 0 51 91a56.6 56.6 0 0 0 .8 9A60 60 0 0 0 63 219l4-.2v.2h224a56 56 0 0 0 0-112Z"/></symbol><symbol id="SVGxmf1dE1T" viewBox="0 0 398 222"><use width="200.3" height="126.1" href="#SVGa7dgPttN" transform="translate(198 27)"><animateTransform additive="sum" attributeName="transform" dur="6s" repeatCount="indefinite" type="translate" values="-9 0; 9 0; -9 0"/></use><use width="350" height="222" href="#SVGMnBDAb4I"><animateTransform additive="sum" attributeName="transform" dur="6s" repeatCount="indefinite" type="translate" values="-18 0; 18 0; -18 0"/></use></symbol><symbol id="SVGyY7FY9DM" viewBox="0 0 156.2 49"><g><path fill="url(#SVGHakO1cdU)" stroke="#86c3db" stroke-miterlimit="10" d="m41.7 31l-5.8-3.3a13.7 13.7 0 0 0 0-6.5l5.8-3.2a4 4 0 0 0 1.5-5.5a4 4 0 0 0-5.6-1.5l-5.8 3.3a13.6 13.6 0 0 0-2.6-2a13.8 13.8 0 0 0-3-1.3V4.5a4 4 0 0 0-8.1 0v6.6a14.3 14.3 0 0 0-5.7 3.2L6.6 11A4 4 0 0 0 1 12.5A4 4 0 0 0 2.5 18l5.8 3.3a13.7 13.7 0 0 0 0 6.5L2.5 31A4 4 0 0 0 1 36.5a4 4 0 0 0 3.5 2a4 4 0 0 0 2-.5l5.8-3.3a13.6 13.6 0 0 0 2.6 2a13.8 13.8 0 0 0 3 1.2v6.6a4 4 0 0 0 8.2 0v-6.6a14.2 14.2 0 0 0 5.6-3.2l6 3.3a4 4 0 0 0 2 .5a4 4 0 0 0 3.4-2a4 4 0 0 0-1.4-5.5ZM19 29.7a6 6 0 0 1-2.3-8.2a6.1 6.1 0 0 1 5.3-3a6.2 6.2 0 0 1 3 .8a6 6 0 0 1 2.2 8.2a6.1 6.1 0 0 1-8.2 2.2Z" opacity="0"><animateTransform additive="sum" attributeName="transform" dur="6s" repeatCount="indefinite" type="rotate" values="0 24 24; 360 24 24"/><animate id="SVGifbapeDh" attributeName="opacity" begin="0s; t1.end+1s" dur="2s" keyTimes="0; .17; .83; 1" values="0; 1; 1; 0"/></path><animateTransform id="SVGd5cUtb9b" additive="sum" attributeName="transform" begin="0s; s1.end+1s" dur="2s" type="translate" values="0 -36; 0 92;"/></g><g><path fill="url(#SVGkrkRYmMF)" stroke="#86c3db" stroke-miterlimit="10" d="m97.7 31l-5.8-3.3a13.7 13.7 0 0 0 0-6.5l5.8-3.2a4 4 0 0 0 1.5-5.5a4 4 0 0 0-5.6-1.5l-5.8 3.3a13.6 13.6 0 0 0-2.6-2a13.8 13.8 0 0 0-3-1.3V4.5a4 4 0 0 0-8.1 0v6.6a14.3 14.3 0 0 0-5.7 3.2L62.6 11a4 4 0 0 0-5.6 1.5a4 4 0 0 0 1.5 5.5l5.8 3.3a13.7 13.7 0 0 0 0 6.5L58.5 31a4 4 0 0 0-1.5 5.5a4 4 0 0 0 3.5 2a4 4 0 0 0 2-.5l5.8-3.3a13.6 13.6 0 0 0 2.7 2a13.8 13.8 0 0 0 3 1.2v6.6a4 4 0 0 0 8 0v-6.6a14.2 14.2 0 0 0 5.7-3.2l6 3.3a4 4 0 0 0 2 .5a4 4 0 0 0 3.4-2a4 4 0 0 0-1.4-5.5ZM75 29.7a6 6 0 0 1-2.3-8.2a6.1 6.1 0 0 1 5.3-3a6.2 6.2 0 0 1 3 .8a6 6 0 0 1 2.2 8.2a6.1 6.1 0 0 1-8.2 2.2Z" opacity="0"><animateTransform additive="sum" attributeName="transform" dur="6s" repeatCount="indefinite" type="rotate" values="0 80 24; 360 80 24"/><animate id="SVGs0wz2HfD" attributeName="opacity" begin="-.83s; t2.end+1s" dur="2s" keyTimes="0; .17; .83; 1" values="0; 1; 1; 0"/></path><animateTransform id="SVGiZIbbC1N" additive="sum" attributeName="transform" begin="-.83s; s2.end+1s" dur="2s" type="translate" values="0 -36; 0 92;"/></g><g><path fill="url(#SVGS0exAdfk)" stroke="#86c3db" stroke-miterlimit="10" d="m153.7 31l-5.8-3.3a13.7 13.7 0 0 0 0-6.5l5.8-3.2a4 4 0 0 0 1.5-5.5a4 4 0 0 0-5.6-1.5l-5.8 3.3a13.6 13.6 0 0 0-2.6-2a13.8 13.8 0 0 0-3-1.3V4.5a4 4 0 0 0-8.1 0v6.6a14.3 14.3 0 0 0-5.7 3.2l-5.8-3.3a4 4 0 0 0-5.6 1.5a4 4 0 0 0 1.5 5.5l5.8 3.3a13.7 13.7 0 0 0 0 6.5l-5.8 3.2a4 4 0 0 0-1.5 5.5a4 4 0 0 0 3.5 2a4 4 0 0 0 2-.5l5.8-3.3a13.6 13.6 0 0 0 2.7 2a13.8 13.8 0 0 0 3 1.2v6.6a4 4 0 0 0 8 0v-6.6a14.2 14.2 0 0 0 5.7-3.2l5.8 3.3a4 4 0 0 0 2 .5a4 4 0 0 0 3.5-2a4 4 0 0 0-1.3-5.5ZM131 29.7a6 6 0 0 1-2.3-8.2a6.1 6.1 0 0 1 5.3-3a6.2 6.2 0 0 1 3 .8a6 6 0 0 1 2.2 8.2a6.1 6.1 0 0 1-8.2 2.2Z" opacity="0"><animateTransform additive="sum" attributeName="transform" dur="6s" repeatCount="indefinite" type="rotate" values="0 136 24; 360 136 24"/><animate id="SVGI61N2d1g" attributeName="opacity" begin=".83s; t3.end+1s" dur="2s" keyTimes="0; .17; .83; 1" values="0; 1; 1; 0"/></path><animateTransform id="SVGM9wm8dfc" additive="sum" attributeName="transform" begin=".83s; s3.end+1s" dur="2s" type="translate" values="0 -36; 0 92;"/></g></symbol></defs><use width="398" height="222" href="#SVGxmf1dE1T" transform="translate(68.84 145)"/><use width="156.2" height="49" href="#SVGyY7FY9DM" transform="translate(177.9 337.5)"/></svg>Overcast Snow Fill アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="meteocons:overcast-snow-fill" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="meteocons:overcast-snow-fill" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="meteocons:overcast-snow-fill" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[meteocons--overcast-snow-fill]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/meteocons -->
<div class="i-meteocons:overcast-snow-fill"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="meteocons:overcast-snow-fill"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/meteocons/overcast-snow-fill.svg" alt="Overcast Snow Fill アイコン" width="24" height="24">Meteocons の関連アイコン
overcast
overcast-day
overcast-day-drizzle
overcast-day-drizzle-fill
overcast-day-fill
overcast-day-fog
overcast-day-fog-fill
overcast-day-hail
overcast-day-hail-fill
overcast-day-haze
overcast-day-haze-fill
overcast-day-rain
overcast-day-rain-fill
overcast-day-sleet
overcast-day-sleet-fill
overcast-day-smoke
overcast-day-smoke-fill
overcast-day-snow
overcast-day-snow-fill
overcast-drizzle
overcast-drizzle-fill
overcast-fill
overcast-fog
overcast-fog-fill
Overcast Snow Fill アイコン のよくある質問
Overcast Snow Fill アイコンは商用利用でも無料ですか?
はい。Meteocons icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Overcast Snow Fill アイコンを使うには?
@iconify/react をインストールして <Icon icon="meteocons:overcast-snow-fill" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Overcast Snow Fill アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/meteocons/overcast-snow-fill.svg" alt="Overcast Snow Fill アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。