ICONYZ
日本語
Fluent Emoji Flat の Card Index アイコン

Card Index アイコン

fluent-emoji-flat:card-index

Card Index アイコン(fluent-emoji-flat:card-index)は、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
カテゴリ
物
タグ
cardindex
SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><g fill="none"><path fill="#cdc4d6" d="M8.454 15h15.092C24.922 15 26 13.858 26 12.509V3.49C26 2.142 24.922 1 23.546 1H8.454C7.078 1 6 2.142 6 3.491v9.018C6 13.858 7.078 15 8.454 15"/><path fill="#635994" d="M28.32 10.98H3.68c-.93 0-1.68.75-1.68 1.67v4.15c0 .93.75 1.68 1.68 1.68H4v8.38c0 1.72 1.4 3.12 3.12 3.12h17.76c1.72 0 3.12-1.4 3.12-3.12v-8.38h.32c.93 0 1.68-.75 1.68-1.68v-4.15c0-.92-.75-1.67-1.68-1.67"/><path fill="#f3eef8" d="M8.454 14h15.092c.8 0 1.454-.67 1.454-1.491V3.49C25 2.671 24.346 2 23.546 2H8.454C7.654 2 7 2.67 7 3.491v9.018C7 13.329 7.654 14 8.454 14m0 13h15.092c.8 0 1.454-.66 1.454-1.491V16.49c0-.82-.654-1.491-1.454-1.491H8.454C7.654 15 7 15.67 7 16.491v9.018C7 26.329 7.654 27 8.454 27"/><path fill="#321b41" d="M11 12.72a.5.5 0 1 0-1 0v4.03a.5.5 0 0 0 1 0zm11 0a.5.5 0 1 0-1 0v4.03a.5.5 0 0 0 1 0z"/><path fill="#00a6ed" d="M14.254 11H9.746A.74.74 0 0 1 9 10.262V4.738A.74.74 0 0 1 9.746 4h4.508a.74.74 0 0 1 .746.738v5.524a.753.753 0 0 1-.746.738"/><path fill="#998ea4" d="M17.56 4a.5.5 0 1 0 0 1h4.84a.5.5 0 0 0 0-1zm0 4a.5.5 0 1 0 0 1h4.84a.5.5 0 0 0 0-1zm-.5-1.5a.5.5 0 0 1 .5-.5h4.84a.5.5 0 0 1 0 1h-4.84a.5.5 0 0 1-.5-.5m.5 3.5a.5.5 0 1 0 0 1h4.84a.5.5 0 0 0 0-1z"/></g></svg>

Card Index アイコンの使い方

React

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

<Icon icon="fluent-emoji-flat:card-index" width="24" />

Vue

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

<template>
  <Icon icon="fluent-emoji-flat:card-index" width="24" />
</template>

Svelte

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

<Icon icon="fluent-emoji-flat:card-index" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[fluent-emoji-flat--card-index]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/fluent-emoji-flat -->
<div class="i-fluent-emoji-flat:card-index"></div>

Web コンポーネント

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

<iconify-icon icon="fluent-emoji-flat:card-index"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/fluent-emoji-flat/card-index.svg" alt="Card Index アイコン" width="24" height="24">

Fluent Emoji Flat の関連アイコン

他のアイコンセットの Card Index アイコン

Card Index アイコン のよくある質問

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

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

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

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

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

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

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