Butter アイコン
fluent-emoji-flat:butter
Butter アイコン(fluent-emoji-flat:butter)は、Fluent Emoji Flat セットの無料 SVG アイコンです（作者: Microsoft Corporation）。 32 × 32 のグリッドで描かれています。 Fluent Emoji Flat icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- Fluent Emoji Flat
- 作者
- Microsoft Corporation
- ライセンス
- MIT
- サイズ
- 32 × 32
- カテゴリ
- 飲食
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><defs><path id="SVGBdj0ZbUr" fill="#fff478" d="M9.35 20.424v-3.77c0-.2.21-.34.4-.25l7.35 3.62c.19.09.31.29.31.5v3.73c0 .24-.25.4-.47.29l-7.23-3.55a.63.63 0 0 1-.36-.57"/></defs><g fill="none"><path fill="#d3d3d3" d="M2 22.93v1.22c0 .21.11.42.33.53l10.15 4.99c.62.31 1.36.31 1.98 0l15.2-7.4c.22-.11.33-.32.33-.53v-1.22z"/><path fill="#f4f4f4" d="M18.26 14.67L2.33 22.43a.59.59 0 0 0 0 1.06l10.15 4.99c.62.31 1.36.31 1.98 0l15.2-7.4a.59.59 0 0 0 0-1.06l-10.88-5.35a.6.6 0 0 0-.52 0"/><path fill="#fcd53f" d="M18.91 12.13c-.35-.17-.75-.17-1.09 0l-8.04 3.85c-.26.13-.43.4-.43.69c2.282 3.17 4.581 5.314 7.619 7.88l.101.05c.21.1.46.1.68 0l.129-.062C21.875 20.594 22.5 20 26.42 16.3c0-.29-.17-.56-.43-.69z"/><use href="#SVGBdj0ZbUr"/><use href="#SVGBdj0ZbUr"/><path fill="#fcd53f" d="M8.4 17.31c-.35-.17-.75-.17-1.09 0l-.98.47c-.26.13-.43.39-.43.69c2.214 3.167 5.18 4.872 7.62 7.88l.1.05c.21.1.46.1.68 0l.133-.065c.25-1.71.906-3.188 1.477-4.855c0-.29-.17-.56-.43-.69z"/><path fill="#fff478" d="M5.9 22.223v-3.77c0-.2.21-.34.4-.25l7.36 3.62c.19.09.31.29.31.5v3.73c0 .24-.25.4-.47.29l-7.24-3.56a.62.62 0 0 1-.36-.56"/><path fill="#f9c23c" d="M26.43 16.284v3.77c0 .24-.14.46-.35.56l-8.19 3.93a.323.323 0 0 1-.47-.29v-3.73c0-.21.12-.41.31-.5l8.3-3.99c.19-.09.4.05.4.25m-10.52 5.189v3.77c0 .24-.13.46-.35.55l-1.13.55a.323.323 0 0 1-.47-.29v-3.73c0-.21.12-.41.31-.5l1.24-.6c.19-.09.4.05.4.25"/></g></svg>
Butter アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="fluent-emoji-flat:butter" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="fluent-emoji-flat:butter" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="fluent-emoji-flat:butter" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[fluent-emoji-flat--butter]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/fluent-emoji-flat -->
<div class="i-fluent-emoji-flat:butter"></div>
Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="fluent-emoji-flat:butter"></iconify-icon>
HTML 画像
<img src="https://iconyz.com/api/public/svg/fluent-emoji-flat/butter.svg" alt="Butter アイコン" width="24" height="24">
Fluent Emoji Flat の関連アイコン
Butter アイコン のよくある質問
Butter アイコンは商用利用でも無料ですか?
はい。Fluent Emoji Flat icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Butter アイコンを使うには?
@iconify/react をインストールして <Icon icon="fluent-emoji-flat:butter" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Butter アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/fluent-emoji-flat/butter.svg" alt="Butter アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。
Fluent Emoji Flat アイコン をすべて見る →
ICONYZ
