Moonrise アイコン
wi:moonrise
Moonrise アイコン(wi:moonrise)は、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
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30"><path fill="currentColor" d="M7.8 14.86c0-.98.19-1.92.58-2.82c.38-.9.9-1.67 1.55-2.32s1.43-1.17 2.32-1.56s1.84-.58 2.83-.58h1.17c.16.04.24.14.24.28l.04.9q.06 1.95 1.41 3.33c1.35 1.38 2 1.41 3.28 1.46l.85.07c.16 0 .23.08.23.23v1.01c.01 1.03-.19 2-.58 2.92h-2.05c.51-.74.83-1.59.97-2.53c-1.67-.35-3.02-1.07-4.03-2.16s-1.59-2.37-1.75-3.83c-.97.05-1.85.35-2.66.9c-.8.55-1.43 1.24-1.87 2.08s-.66 1.72-.66 2.63c0 1.07.28 2.04.83 2.92H8.4c-.4-.94-.6-1.91-.6-2.93m.29 6.01c0-.29.09-.52.28-.68c.18-.18.41-.26.69-.26h2.63L14.8 17c.1-.08.22-.08.35 0l3.16 2.92h2.77c.27 0 .5.09.69.28a.9.9 0 0 1 .29.67c0 .27-.1.5-.29.69s-.42.29-.69.29H17.7c-.1 0-.2-.02-.29-.07L15 19.51l-2.39 2.27c-.08.05-.17.07-.28.07H9.06c-.27 0-.5-.1-.69-.29s-.28-.42-.28-.69"/></svg>Moonrise アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="wi:moonrise" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="wi:moonrise" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="wi:moonrise" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[wi--moonrise]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/wi -->
<div class="i-wi:moonrise"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="wi:moonrise"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/wi/moonrise.svg" alt="Moonrise アイコン" width="24" height="24">他のアイコンセットの Moonrise アイコン
Moonrise アイコン のよくある質問
Moonrise アイコンは商用利用でも無料ですか?
はい。Weather Icons は Open Font License で公開されており、個人・商用プロジェクトで利用できます。
React で Moonrise アイコンを使うには?
@iconify/react をインストールして <Icon icon="wi:moonrise" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Moonrise アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/wi/moonrise.svg" alt="Moonrise アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。