ICONYZ
日本語
Energy Icons の Settings 20 アイコン

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 コード

<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 コードをページに直接貼り付けます。

Energy Icons をすべて見る →