Settings アイコン

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

はい。coolicons は CC BY 4.0 ライセンス で公開されています。作者のクレジットを表記すれば、個人・商用プロジェクトで利用できます。

ci:settings

Settings アイコン(ci:settings)は、coolicons セットの無料 SVG アイコンです（作者: Kryston Schwarze）。 24 × 24 のグリッドで描かれています。 coolicons は CC BY 4.0 ライセンスで公開されています。作者のクレジットを表記すれば、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット: coolicons
作者: Kryston Schwarze
ライセンス: CC-BY-4.0
サイズ: 24 × 24
カテゴリ: インターフェース
タグ: setting

SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="m20.35 8.923l-.366-.204l-.113-.064a2 2 0 0 1-.67-.66c-.018-.027-.034-.056-.066-.112a2 2 0 0 1-.3-1.157l.006-.425c.012-.68.018-1.022-.078-1.328a2 2 0 0 0-.417-.736c-.214-.24-.511-.412-1.106-.754l-.494-.285c-.592-.341-.889-.512-1.204-.577a2 2 0 0 0-.843.007c-.313.07-.606.246-1.191.596l-.003.002l-.354.211c-.056.034-.085.05-.113.066c-.278.155-.588.24-.907.25c-.032.002-.065.002-.13.002l-.13-.001a2 2 0 0 1-.91-.252c-.028-.015-.055-.032-.111-.066l-.357-.214c-.589-.354-.884-.53-1.199-.601a2 2 0 0 0-.846-.006c-.316.066-.612.238-1.205.582l-.003.001l-.488.283l-.005.004c-.588.34-.883.512-1.095.751a2 2 0 0 0-.415.734c-.095.307-.09.649-.078 1.333l.007.424c0 .065.003.097.002.128a2 2 0 0 1-.301 1.027c-.033.056-.048.084-.065.11a2 2 0 0 1-.675.664l-.112.063l-.361.2c-.602.333-.903.5-1.121.738a2 2 0 0 0-.43.73c-.1.307-.1.65-.099 1.338l.002.563c.001.683.003 1.024.104 1.329a2 2 0 0 0 .427.726c.218.236.516.402 1.113.734l.358.199c.061.034.092.05.121.068a2 2 0 0 1 .74.781l.067.12a2 2 0 0 1 .23 1.038l-.007.407c-.012.686-.017 1.03.079 1.337c.085.272.227.523.417.736c.214.24.512.411 1.106.754l.494.285c.593.341.889.512 1.204.577a2 2 0 0 0 .843-.007c.314-.07.607-.246 1.194-.598l.354-.212l.113-.066c.278-.154.588-.24.907-.25l.13-.001h.13c.318.01.63.097.91.252l.092.055l.376.226c.59.354.884.53 1.199.6a2 2 0 0 0 .846.008c.315-.066.613-.239 1.206-.583l.495-.287c.588-.342.883-.513 1.095-.752c.19-.213.33-.463.415-.734c.095-.305.09-.644.078-1.318l-.008-.44v-.127a2 2 0 0 1 .3-1.028l.065-.11a2 2 0 0 1 .675-.664l.11-.061l.002-.001l.361-.2c.602-.334.903-.5 1.122-.738c.194-.21.34-.46.429-.73c.1-.305.1-.647.098-1.327l-.002-.574c-.001-.683-.002-1.025-.103-1.33a2 2 0 0 0-.428-.725c-.217-.236-.515-.402-1.111-.733z"/><path d="M8 12a4 4 0 1 0 8 0a4 4 0 0 0-8 0"/></g></svg>

Settings アイコンの使い方

React

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

<Icon icon="ci:settings" width="24" />

Vue

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

<template>
  <Icon icon="ci:settings" width="24" />
</template>

Svelte

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

<Icon icon="ci:settings" width="24" />

Tailwind CSS

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

UnoCSS

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

Web コンポーネント

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

<iconify-icon icon="ci:settings"></iconify-icon>

HTML 画像

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

coolicons の関連アイコン

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

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

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

はい。coolicons は CC BY 4.0 ライセンスで公開されています。作者のクレジットを表記すれば、個人・商用プロジェクトで利用できます。

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

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

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

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

coolicons をすべて見る →