ICONYZ
日本語
Fluent Emoji High Contrast の Melon アイコン

Melon アイコン

fluent-emoji-high-contrast:melon

Melon アイコン(fluent-emoji-high-contrast:melon)は、Fluent Emoji High Contrast セットの無料 SVG アイコンです(作者: Microsoft Corporation)。 32 × 32 のグリッドで描かれています。 Fluent Emoji High Contrast icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット
Fluent Emoji High Contrast
作者
Microsoft Corporation
ライセンス
MIT
サイズ
32 × 32
カテゴリ
飲食
SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path fill="currentColor" d="M5.463 1.06c.376.92.792 1.277 1.338 1.377c.63.114 1.553-.08 3.017-.653l.008-.003L12.01.97c1.025-.383 2.422.279 3.127 1.752a.5.5 0 0 1-.902.432c-.566-1.182-1.498-1.388-1.874-1.248l-2.055.765l1.245 3.111A13 13 0 0 1 16 5c7.18 0 13 5.82 13 13s-5.82 13-13 13S3 25.18 3 18c0-5.263 3.127-9.795 7.625-11.84L9.368 3.016c-1.087.37-1.991.542-2.746.404c-1.018-.185-1.642-.9-2.085-1.98a.5.5 0 1 1 .926-.38m1.8 10.256A10.95 10.95 0 0 0 5 18c0 5.584 4.16 10.195 9.55 10.905c-1.824-.988-4.533-3.137-6.403-7.652c-1.87-4.514-1.475-7.948-.884-9.937m.373-.461c-.371 1.807-.55 5.221 1.435 10.015s4.527 7.082 6.068 8.097Q15.565 29 16 29a11 11 0 0 0 4.117-.797c-.763-1.46-2.4-4.752-4.579-10.012S12.19 9.446 11.697 7.874a11 11 0 0 0-4.06 2.981m4.247-3.058c.763 1.46 2.4 4.752 4.579 10.012s3.348 8.745 3.842 10.317a11 11 0 0 0 4.06-2.981c.371-1.808.55-5.221-1.435-10.015s-4.527-7.082-6.068-8.097a11 11 0 0 0-4.979.763M27 18c0-5.583-4.16-10.195-9.55-10.905c1.825.988 4.533 3.137 6.403 7.652c1.87 4.514 1.475 7.948.884 9.936A10.95 10.95 0 0 0 27 18"/></svg>

Melon アイコンの使い方

React

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

<Icon icon="fluent-emoji-high-contrast:melon" width="24" />

Vue

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

<template>
  <Icon icon="fluent-emoji-high-contrast:melon" width="24" />
</template>

Svelte

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

<Icon icon="fluent-emoji-high-contrast:melon" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[fluent-emoji-high-contrast--melon]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/fluent-emoji-high-contrast -->
<div class="i-fluent-emoji-high-contrast:melon"></div>

Web コンポーネント

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

<iconify-icon icon="fluent-emoji-high-contrast:melon"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/fluent-emoji-high-contrast/melon.svg" alt="Melon アイコン" width="24" height="24">

他のアイコンセットの Melon アイコン

Melon アイコン のよくある質問

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

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

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

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

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

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

Fluent Emoji High Contrast アイコン をすべて見る →