ICONYZ
日本語
Skill Icons の Octave Light アイコン

Octave Light アイコン

skill-icons:octave-light

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

アイコンセット
Skill Icons
作者
tandpfun
ライセンス
MIT
サイズ
256 × 256
タグ
octavelight
SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256"><g fill="none"><rect width="256" height="256" fill="#f4f2ed" rx="60"/><path fill="url(#SVG8xaoz4Sr)" d="M61.852 48.773c-31.004 33.693-23.49 96.481 16.773 140.237c40.264 43.755 98.033 51.91 129.037 18.218c31.004-33.693 23.511-96.484-16.753-140.24c-40.263-43.755-98.053-51.907-129.057-18.215M89.965 62.77c24.361-26.473 69.152-20.715 100.052 12.865s36.199 82.255 11.838 108.728c-24.361 26.474-69.164 20.728-100.063-12.852S65.604 89.242 89.965 62.769"/><path fill="#ff7f2a" stroke="#d45500" stroke-width="6.289" d="M196.287 60.738h-16.771a4.59 4.59 0 0 0-4.592 4.593V82.1a4.59 4.59 0 0 0 4.592 4.593h16.771a4.59 4.59 0 0 0 4.593-4.592V65.33a4.59 4.59 0 0 0-4.593-4.592ZM79.319 94.933H39.816C33.843 94.933 29 99.776 29 105.75v39.503c0 5.973 4.843 10.816 10.816 10.816H79.32c5.973 0 10.816-4.843 10.816-10.816V105.75c0-5.973-4.843-10.816-10.816-10.816Zm138.077 80.033h-23.865a6.535 6.535 0 0 0-6.535 6.535v23.865a6.535 6.535 0 0 0 6.535 6.535h23.865a6.535 6.535 0 0 0 6.535-6.535v-23.865a6.535 6.535 0 0 0-6.535-6.535Z"/><defs><radialGradient id="SVG8xaoz4Sr" cx="0" cy="0" r="1" gradientTransform="rotate(-47.38 272.923 -1.627)scale(300.774 999.837)" gradientUnits="userSpaceOnUse"><stop stop-color="#008cbe"/><stop offset="1" stop-color="#b2ffff"/></radialGradient></defs></g></svg>

Octave Light アイコンの使い方

React

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

<Icon icon="skill-icons:octave-light" width="24" />

Vue

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

<template>
  <Icon icon="skill-icons:octave-light" width="24" />
</template>

Svelte

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

<Icon icon="skill-icons:octave-light" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[skill-icons--octave-light]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/skill-icons -->
<div class="i-skill-icons:octave-light"></div>

Web コンポーネント

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

<iconify-icon icon="skill-icons:octave-light"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/skill-icons/octave-light.svg" alt="Octave Light アイコン" width="24" height="24">

Skill Icons の関連アイコン

Octave Light アイコン のよくある質問

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

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

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

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

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

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

Skill Icons をすべて見る →