Day Fog アイコン

wi:day-fog

Day Fog アイコン(wi:day-fog)は、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
タグ: dayfog、owm day 741

SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30"><path fill="currentColor" d="M.32 21.06c0 .23.08.43.25.59q.255.24.63.24h18.71c.24 0 .44-.08.61-.24s.25-.35.25-.59s-.08-.44-.25-.6a.82.82 0 0 0-.61-.25H1.2c-.25 0-.46.08-.63.25s-.25.36-.25.6m2.62-3.14c0 .23.08.43.25.58a.8.8 0 0 0 .6.27h18.72c.23 0 .43-.08.59-.25q.24-.255.24-.6a.84.84 0 0 0-.23-.59a.8.8 0 0 0-.59-.24H3.8q-.36 0-.6.24c-.17.17-.26.36-.26.59m.13-2.4c0 .09.05.13.16.13h1.43c.07 0 .14-.05.21-.16c.24-.52.59-.94 1.06-1.27s.99-.52 1.56-.56l.54-.07c.11 0 .17-.06.17-.18l.07-.51c.11-1.08.56-1.98 1.37-2.71c.81-.72 1.76-1.09 2.86-1.09c1.08 0 2.03.36 2.84 1.08s1.27 1.61 1.38 2.68l.07.58c0 .11.06.17.19.17h1.61c.64 0 1.23.17 1.76.52c.53.34.92.8 1.18 1.37c.07.11.13.16.2.16h1.44c.13 0 .18-.07.13-.23l-.2-.55c.76-.94 1.13-2.04 1.13-3.31c0-.71-.14-1.38-.41-2.03s-.64-1.2-1.11-1.67c-.46-.47-1.02-.84-1.67-1.12s-1.32-.4-2.04-.4c-1.54 0-2.82.56-3.82 1.68c-.85-.42-1.74-.63-2.68-.63c-1.4 0-2.65.44-3.74 1.32s-1.79 2-2.1 3.37c-1.78.47-2.98 1.58-3.58 3.35c-.01.01-.01.04-.01.08m1.62 8.61q0 .36.27.6c.16.17.35.26.59.26h18.74c.23 0 .43-.08.6-.25s.25-.37.25-.61c0-.23-.08-.42-.25-.58a.88.88 0 0 0-.6-.23H5.55a.9.9 0 0 0-.61.23c-.17.16-.25.35-.25.58m6.57-19.47c0 .24.08.43.23.59l.65.64c.17.18.36.27.58.27s.42-.08.6-.25c.17-.17.26-.37.26-.61s-.08-.45-.25-.63l-.64-.61a.8.8 0 0 0-.6-.26c-.24 0-.44.08-.6.25c-.15.16-.23.37-.23.61m5.32 4.38c.67-.68 1.48-1.01 2.43-1.01c.98 0 1.82.35 2.51 1.04s1.04 1.53 1.04 2.5c0 .65-.16 1.25-.49 1.8c-.95-.95-2.11-1.42-3.47-1.42h-.34q-.435-1.77-1.68-2.91m1.6-5.23c0 .23.08.43.24.59s.35.24.59.24q.375 0 .63-.24c.17-.16.25-.35.25-.59V1.76c0-.23-.09-.43-.26-.6A.88.88 0 0 0 19 .91c-.23 0-.43.08-.59.25q-.24.255-.24.6v2.05zm5.49 2.27c0 .22.08.43.24.6q.555.54 1.23 0l1.43-1.43c.16-.18.24-.39.24-.64c0-.23-.08-.43-.24-.59a.8.8 0 0 0-.59-.24q-.36 0-.6.24l-1.46 1.47c-.17.18-.25.38-.25.59m.81 11.8c0 .24.09.44.26.6l.64.65c.16.16.36.24.58.24c.21 0 .41-.08.61-.24c.16-.17.24-.39.24-.64c0-.22-.08-.41-.24-.56l-.65-.66a.88.88 0 0 0-.6-.24c-.24 0-.44.08-.6.25q-.24.24-.24.6m1.48-6.31c0 .24.09.44.26.6c.15.17.35.25.59.25h2.05c.23 0 .43-.08.59-.25q.24-.255.24-.6q0-.36-.24-.6a.8.8 0 0 0-.59-.24h-2.05c-.24 0-.44.08-.6.25c-.17.16-.25.36-.25.59"/></svg>

Day Fog アイコンの使い方

React

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

<Icon icon="wi:day-fog" width="24" />

Vue

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

<template>
  <Icon icon="wi:day-fog" width="24" />
</template>

Svelte

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

<Icon icon="wi:day-fog" width="24" />

Tailwind CSS

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

UnoCSS

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

Web コンポーネント

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

<iconify-icon icon="wi:day-fog"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/wi/day-fog.svg" alt="Day Fog アイコン" width="24" height="24">

Weather Icons の関連アイコン

Day Fog アイコンのよくある質問

Day Fog アイコンは商用利用でも無料ですか?

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

React で Day Fog アイコンを使うには?

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

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

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

Weather Icons をすべて見る →