Settings アイコン

Q: Settings アイコンは商用利用でも無料ですか?

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

griddy-icons:settings

Settings アイコン(griddy-icons:settings)は、Griddy Icons セットの無料 SVG アイコンです（作者: Zuzana Benova）。 24 × 24 のグリッドで描かれています。 Griddy Icons は MIT ライセンスで公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット: Griddy Icons
作者: Zuzana Benova
ライセンス: MIT
サイズ: 24 × 24
タグ: setting

SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M9.995 21.8c.655.13 1.33.2 2.005.2v-.005c.67 0 1.35-.065 2.005-.2c.58-.115.995-.63.995-1.225v-1.155a7.8 7.8 0 0 0 1.925-1.11l1 .575c.515.295 1.17.195 1.555-.245a10 10 0 0 0 2.01-3.48a1.25 1.25 0 0 0-.565-1.47l-1-.575a8.2 8.2 0 0 0 0-2.22l1-.58c.51-.295.75-.915.565-1.47a10 10 0 0 0-2.01-3.48c-.39-.44-1.04-.54-1.555-.245l-1 .575a8 8 0 0 0-1.92-1.11V3.425c0-.59-.42-1.11-.995-1.225c-1.31-.27-2.7-.27-4.015 0c-.58.115-.995.63-.995 1.225V4.58a7.8 7.8 0 0 0-1.925 1.11l-1-.575a1.25 1.25 0 0 0-1.555.245a10 10 0 0 0-2.01 3.48c-.185.555.05 1.175.565 1.47l1 .58a8.2 8.2 0 0 0 0 2.22l-1 .58c-.51.295-.75.915-.565 1.47a9.9 9.9 0 0 0 2.01 3.48c.39.44 1.04.54 1.555.245l1-.575c.59.46 1.235.83 1.925 1.11v1.155c0 .59.42 1.11.995 1.225m3.505-1.43a8.6 8.6 0 0 1-3 0v-2.02l-.52-.17a6.5 6.5 0 0 1-2.325-1.345l-.405-.365l-1.75 1.01A8.4 8.4 0 0 1 4 14.885l1.75-1.01l-.11-.53Q5.499 12.684 5.5 12c0-.455.05-.905.14-1.345l.11-.53L4 9.115A8.4 8.4 0 0 1 5.5 6.52l1.75 1.01l.405-.365A6.4 6.4 0 0 1 9.98 5.82l.52-.17V3.63a8.6 8.6 0 0 1 3 0v2.015l.52.17c.865.28 1.645.735 2.325 1.345l.405.365l1.75-1.01A8.4 8.4 0 0 1 20 9.11l-1.75 1.01l.11.53q.141.661.14 1.345c0 .455-.05.905-.14 1.345l-.11.53L20 14.88a8.4 8.4 0 0 1-1.5 2.6l-1.75-1.01l-.405.365a6.4 6.4 0 0 1-2.325 1.345l-.52.17zM8 12c0 2.205 1.795 4 4 4s4-1.795 4-4s-1.795-4-4-4s-4 1.795-4 4m1.5 0a2.5 2.5 0 0 1 5 0a2.5 2.5 0 0 1-5 0" clip-rule="evenodd"/></svg>

Settings アイコンの使い方

React

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

<Icon icon="griddy-icons:settings" width="24" />

Vue

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

<template>
  <Icon icon="griddy-icons:settings" width="24" />
</template>

Svelte

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

<Icon icon="griddy-icons:settings" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[griddy-icons--settings]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/griddy-icons -->
<div class="i-griddy-icons:settings"></div>

Web コンポーネント

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

<iconify-icon icon="griddy-icons:settings"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/griddy-icons/settings.svg" alt="Settings アイコン" width="24" height="24">

Griddy Icons の関連アイコン

他のアイコンセットの Settings アイコン

Settings アイコンのよくある質問

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

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

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

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

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

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

Griddy Icons をすべて見る →