Settings 20 アイコン
energy-icons:settings-20
Settings 20 アイコン(energy-icons:settings-20)は、Energy Icons セットの無料 SVG アイコンです(作者: Sam Passmore)。 20 × 20 のグリッドで描かれています。 Energy Icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- Energy Icons
- 作者
- Sam Passmore
- ライセンス
- MIT
- サイズ
- 20 × 20
- タグ
- setting
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><path fill="currentColor" d="M11.044 2.073a.5.5 0 0 1 .497.445l.182 1.676l1.162.482l1.316-1.056a.5.5 0 0 1 .667.036l1.475 1.477a.5.5 0 0 1 .037.666l-1.057 1.315l.481 1.16l1.677.185a.5.5 0 0 1 .445.497v2.088a.5.5 0 0 1-.445.497l-1.677.183l-.481 1.162L16.38 14.2a.5.5 0 0 1-.037.667l-1.475 1.475a.5.5 0 0 1-.667.037l-1.315-1.057l-1.162.481l-.183 1.677a.5.5 0 0 1-.497.445H8.956a.5.5 0 0 1-.497-.445l-.185-1.677l-1.16-.481l-1.315 1.057a.5.5 0 0 1-.666-.037l-1.477-1.475a.5.5 0 0 1-.036-.667l1.056-1.315l-.482-1.163l-1.676-.182a.5.5 0 0 1-.445-.497V8.956a.5.5 0 0 1 .445-.497l1.676-.184l.482-1.161L3.62 5.799a.5.5 0 0 1 .036-.666l1.477-1.477l.072-.06a.5.5 0 0 1 .594.024l1.315 1.056l1.161-.482l.184-1.676l.02-.091a.5.5 0 0 1 .477-.354zM9.237 4.598a.5.5 0 0 1-.306.408l-1.708.707a.5.5 0 0 1-.504-.072l-1.197-.96l-.842.841l.961 1.197a.5.5 0 0 1 .072.504l-.707 1.708a.5.5 0 0 1-.408.306l-1.525.167v1.191l1.525.168l.067.012a.5.5 0 0 1 .34.294l.708 1.708a.5.5 0 0 1-.072.504l-.96 1.196l.841.842l1.197-.96l.055-.039a.5.5 0 0 1 .45-.033l1.707.707l.061.03a.5.5 0 0 1 .245.377l.167 1.526h1.191l.168-1.526l.012-.066a.5.5 0 0 1 .294-.341l1.708-.707l.064-.022a.5.5 0 0 1 .44.094l1.196.96l.842-.842l-.96-1.196a.5.5 0 0 1-.072-.504l.707-1.708l.03-.061a.5.5 0 0 1 .377-.245l1.526-.168V9.404L15.4 9.237a.5.5 0 0 1-.407-.306l-.707-1.708a.5.5 0 0 1 .072-.504l.96-1.197l-.842-.842l-1.196.961a.5.5 0 0 1-.504.072l-1.708-.707a.5.5 0 0 1-.306-.408l-.168-1.525h-1.19z"/><path fill="currentColor" d="M12 10a2 2 0 1 0-4 0a2 2 0 0 0 4 0m1 0a3 3 0 1 1-6 0a3 3 0 0 1 6 0"/></svg>Settings 20 アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="energy-icons:settings-20" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="energy-icons:settings-20" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="energy-icons:settings-20" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[energy-icons--settings-20]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/energy-icons -->
<div class="i-energy-icons:settings-20"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="energy-icons:settings-20"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/energy-icons/settings-20.svg" alt="Settings 20 アイコン" width="24" height="24">Energy Icons の関連アイコン
他のアイコンセットの Settings 20 アイコン
Settings 20 アイコン のよくある質問
Settings 20 アイコンは商用利用でも無料ですか?
はい。Energy Icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Settings 20 アイコンを使うには?
@iconify/react をインストールして <Icon icon="energy-icons:settings-20" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Settings 20 アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/energy-icons/settings-20.svg" alt="Settings 20 アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。