Text Box アイコン
fluent-mdl2:text-box
Text Box アイコン(fluent-mdl2:text-box)は、Fluent UI MDL2 セットの無料 SVG アイコンです(作者: Microsoft Corporation)。 2048 × 2048 のグリッドで描かれています。 Fluent UI MDL2 icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- Fluent UI MDL2
- 作者
- Microsoft Corporation
- ライセンス
- MIT
- サイズ
- 2048 × 2048
- タグ
- textbox
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="2048" height="2048" viewBox="0 0 2048 2048"><path fill="currentColor" d="M2048 0v2048H0V0zm-128 128H128v1792h1792zM397 894H283l235-628h117l234 628H754l-56-160H451zm176-535q-2 10-3 20t-5 20l-87 250h193l-88-250q-3-9-4-19t-4-21zm460 535H931V230h102v294h1q26-43 63-66t89-23q48 0 82 18t57 50t32 71t10 83q0 48-11 92t-36 79t-62 55t-92 21q-86 0-132-75h-1zm-1-188q0 24 8 45t22 38t34 25t46 10q35 0 58-15t37-39t20-54t6-59q0-26-6-51t-19-46t-34-32t-52-12q-29 0-51 11t-38 29t-23 43t-8 52zm632 198q-50 0-91-16t-70-46t-45-71t-16-91q0-55 17-100t48-77t76-50t101-18q28 0 55 5t53 16v95q-22-16-47-25t-53-10q-35 0-62 12t-45 34t-29 50t-10 62q0 66 37 108t105 42q29 0 55-10t49-29v88q-29 17-62 24t-66 7M438 1792q-48 0-82-19t-57-50t-32-72t-11-83q0-47 11-91t37-78t62-55t91-21q43 0 77 17t55 56h2v-278h101v664H591v-77h-2q-50 87-151 87m44-388q-35 0-58 14t-38 36t-20 51t-6 59q0 27 6 53t20 48t35 34t54 13q28 0 50-11t37-30t22-43t8-51v-59q0-48-30-81t-80-33m530-81q51 0 87 17t59 48t35 71t11 87v39H899q2 63 39 96t99 34q36 0 69-11t63-32v81q-36 23-78 31t-84 8q-54 0-93-17t-66-49t-39-73t-13-94q0-48 15-90t43-75t68-52t90-19m94 190q0-23-5-44t-17-36t-30-25t-44-10q-24 0-43 9t-34 26t-22 37t-12 43zm226-252q0-36 12-64t35-48t51-30t65-11q15 0 30 2t29 7v84q-21-12-47-12q-41 0-57 23t-17 61v60h104v80h-103v369h-102v-369h-76v-80h76z"/></svg>Text Box アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="fluent-mdl2:text-box" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="fluent-mdl2:text-box" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="fluent-mdl2:text-box" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[fluent-mdl2--text-box]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/fluent-mdl2 -->
<div class="i-fluent-mdl2:text-box"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="fluent-mdl2:text-box"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/fluent-mdl2/text-box.svg" alt="Text Box アイコン" width="24" height="24">Fluent UI MDL2 の関連アイコン
他のアイコンセットの Text Box アイコン
Text Box アイコン のよくある質問
Text Box アイコンは商用利用でも無料ですか?
はい。Fluent UI MDL2 icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Text Box アイコンを使うには?
@iconify/react をインストールして <Icon icon="fluent-mdl2:text-box" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Text Box アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/fluent-mdl2/text-box.svg" alt="Text Box アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。