Status アイコン
f7:status
Status アイコン(f7:status)は、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="m50.923 21.002l.046.131l.171.566l.143.508l.061.232l.1.42a23.93 23.93 0 0 1-2.653 17.167a23.93 23.93 0 0 1-13.57 10.89l-.404.12l-.496.128l-.717.17a1.89 1.89 0 0 1-2.288-1.558a2.127 2.127 0 0 1 1.606-2.389l.577-.145q.54-.142.929-.273a19.93 19.93 0 0 0 10.899-8.943a19.93 19.93 0 0 0 2.292-13.923l-.069-.313l-.092-.365l-.115-.418l-.138-.47a2.135 2.135 0 0 1 1.26-2.602a1.894 1.894 0 0 1 2.458 1.067M7.385 19.92q.065.02.128.044A2.127 2.127 0 0 1 8.78 22.55q-.27.909-.39 1.513a19.93 19.93 0 0 0 2.295 13.91a19.93 19.93 0 0 0 10.911 8.947l.306.097l.174.05l.39.106l.694.171a2.135 2.135 0 0 1 1.623 2.393a1.894 1.894 0 0 1-2.152 1.594l-.138-.025l-.576-.135l-.51-.13l-.446-.125l-.2-.06A23.93 23.93 0 0 1 7.22 39.972a23.93 23.93 0 0 1-2.647-17.197l.077-.32l.1-.375l.194-.665l.076-.25a1.89 1.89 0 0 1 2.365-1.246M28.051 12c8.837 0 16 7.163 16 16s-7.163 16-16 16s-16-7.163-16-16s7.164-16 16-16m0 4c-6.627 0-12 5.373-12 12s5.373 12 12 12c6.628 0 12-5.373 12-12s-5.372-12-12-12m0-12a23.93 23.93 0 0 1 16.217 6.306l.239.227l.275.274l.31.322l.346.369a1.89 1.89 0 0 1-.205 2.76a2.127 2.127 0 0 1-2.873-.196q-.326-.345-.605-.617l-.35-.334l-.16-.143A19.93 19.93 0 0 0 28.051 8a19.93 19.93 0 0 0-13.204 4.976l-.114.102l-.253.24l-.287.285l-.495.515c-.76.809-2.014.9-2.883.21a1.894 1.894 0 0 1-.305-2.662l.09-.106l.405-.431l.368-.378q.262-.263.484-.465A23.93 23.93 0 0 1 28.05 4"/></svg>
Status アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="f7:status" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="f7:status" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="f7:status" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[f7--status]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/f7 -->
<div class="i-f7:status"></div>
Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="f7:status"></iconify-icon>
HTML 画像
<img src="https://iconyz.com/api/public/svg/f7/status.svg" alt="Status アイコン" width="24" height="24">
Status アイコン のよくある質問
Status アイコンは商用利用でも無料ですか?
はい。Framework7 Icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Status アイコンを使うには?
@iconify/react をインストールして <Icon icon="f7:status" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Status アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/f7/status.svg" alt="Status アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。
Framework7 Icons をすべて見る →
ICONYZ
