Ant アイコン
f7:ant
Ant アイコン(f7:ant)は、Framework7 Icons セットの無料 SVG アイコンです（作者: Vladimir Kharlampidi）。 56 × 56 のグリッドで描かれています。 Framework7 Icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- Framework7 Icons
- 作者
- Vladimir Kharlampidi
- ライセンス
- MIT
- サイズ
- 56 × 56
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56"><path fill="currentColor" d="M12.332 54.566c1.102 0 1.922-.797 1.711-2.132l-1.711-11.227c-.234-1.406.258-2.04 1.875-2.484l1.805-.492c-.282.867-.422 1.851-.422 2.976c0 7.664 5.789 14.79 12.398 14.79c6.633 0 12.422-7.126 12.422-14.79c0-1.125-.14-2.11-.422-2.977l1.805.493c1.617.445 2.11 1.078 1.875 2.484l-1.711 11.227c-.21 1.336.61 2.132 1.71 2.132c1.15 0 1.665-.703 1.852-1.875l1.922-12.164c.446-2.742-.68-4.218-3.68-4.945l-10.359-2.46v-.235c1.008-.492 1.711-1.43 2.086-2.532l6.867-1.007c2.93-.399 4.243-2.04 4.243-4.922v-8.11c0-1.148-.657-1.804-1.782-1.804s-1.78.68-1.78 1.804V23.7c0 1.664-.892 2.18-2.415 2.414l-5.133.727a3.7 3.7 0 0 0-1.36-1.805v-.234c4.009-.703 6-3.14 6-6.703c0-3-1.1-5.742-2.929-7.875l.188-.141c2.273-1.64 2.695-4.055 1.218-6.656l-1.382-2.274C36.777.356 36.262.39 35.535.39c-.96 0-1.687.317-1.687 1.231c0 .422.07.656.328 1.125l1.218 1.852c.82 1.336.727 2.46-.445 3.304l-.187.118a12.06 12.06 0 0 0-6.774-2.086c-2.46 0-4.781.75-6.703 2.062l-.14-.094c-1.172-.843-1.266-1.968-.446-3.304l1.219-1.852c.258-.469.328-.703.328-1.125C22.246.707 21.52.39 20.56.39c-.727 0-1.243-.035-1.688.762l-1.383 2.274c-1.476 2.601-1.054 5.015 1.219 6.656l.117.094a12.1 12.1 0 0 0-2.976 7.922c0 3.562 2.015 6 6.023 6.703v.234a3.7 3.7 0 0 0-1.36 1.805l-5.132-.727c-1.547-.234-2.414-.75-2.414-2.414v-7.383c0-1.125-.656-1.804-1.781-1.804s-1.782.656-1.782 1.804v8.11c0 2.883 1.313 4.523 4.243 4.922l6.867 1.008c.375 1.101 1.078 2.038 2.086 2.53v.235l-10.36 2.461c-3.023.727-4.125 2.203-3.68 4.945l1.922 12.164c.165 1.172.704 1.875 1.852 1.875m11.438-33.21c-2.555 0-4.055-1.243-4.055-3.399c0-4.36 3.89-8.133 8.273-8.133c4.407 0 8.297 3.774 8.297 8.133c0 2.156-1.5 3.398-4.054 3.398Zm-.024 7.054c0-2.156 1.313-3.398 3.586-3.398h1.36c2.25 0 3.538 1.242 3.538 3.398c0 2.649-1.804 4.899-3.96 4.899h-.54c-2.156 0-3.984-2.25-3.984-4.899m4.242 23.672c-4.828 0-8.578-5.672-8.578-10.383c0-3.14 1.828-5.039 5.344-5.039h6.492c3.516 0 5.32 1.899 5.32 5.04c0 4.71-3.726 10.382-8.578 10.382"/></svg>
Ant アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="f7:ant" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="f7:ant" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="f7:ant" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[f7--ant]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/f7 -->
<div class="i-f7:ant"></div>
Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="f7:ant"></iconify-icon>
HTML 画像
<img src="https://iconyz.com/api/public/svg/f7/ant.svg" alt="Ant アイコン" width="24" height="24">
Ant アイコン のよくある質問
Ant アイコンは商用利用でも無料ですか?
はい。Framework7 Icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Ant アイコンを使うには?
@iconify/react をインストールして <Icon icon="f7:ant" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Ant アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/f7/ant.svg" alt="Ant アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。
Framework7 Icons をすべて見る →
ICONYZ
