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

Less Light アイコン

skill-icons:less-light

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

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

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256"><defs><path id="SVGNUZEhdTu" fill="#fff" d="M28.067 85.383H227.98V170H28.067"/></defs><g fill="none"><g clip-path="url(#SVGv3WPqdcU)"><path fill="#f4f2ed" d="M196 0H60C26.863 0 0 26.863 0 60v136c0 33.137 26.863 60 60 60h136c33.137 0 60-26.863 60-60V60c0-33.137-26.863-60-60-60"/><g clip-path="url(#SVG6u52mcDt)"><path fill="url(#SVGZNm6tbkh)" d="M215.667 153.57c0 8.936-7.568 16.247-16.817 16.247H57.507c-9.25 0-16.817-7.311-16.817-16.247v-51.739c0-8.936 7.568-16.247 16.817-16.247H198.85c9.249 0 16.817 7.311 16.817 16.247z"/><mask id="SVGEmbEVdLx" width="200" height="85" x="28" y="85" maskUnits="userSpaceOnUse" style="mask-type:luminance"><use href="#SVGNUZEhdTu"/></mask><g mask="url(#SVGEmbEVdLx)"><path fill="#faf9f8" fill-rule="evenodd" d="M219.443 116.241c0-6.334.985-10.069.985-16.89c0-10.557-3.941-13.968-12.641-13.968h-6.403v7.471h1.97c4.433 0 5.418 1.462 5.418 6.822c0 5.034-.493 10.069-.493 15.916c0 7.471 2.463 10.394 7.387 11.531v.488c-4.924 1.136-7.387 4.06-7.387 11.531c0 5.846.493 10.557.493 15.917c0 5.521-1.149 6.983-5.418 6.983v.162h-1.97V170h6.403c8.7 0 12.641-3.411 12.641-13.967c0-6.984-.985-10.557-.985-16.891c0-3.411 2.134-6.984 8.537-7.309v-8.445c-6.403-.163-8.537-3.736-8.537-7.147m-72.727 9.908c-5.09-1.949-9.687-3.086-9.687-6.335c0-2.435 1.97-3.897 5.582-3.897s6.895 1.462 10.507 4.061l6.567-8.609c-4.105-3.085-9.686-6.334-17.238-6.334c-11.163 0-18.716 6.334-18.716 15.267c0 7.958 7.06 12.018 12.97 14.292c5.089 1.949 10.015 3.574 10.015 6.821c0 2.437-1.971 4.061-6.403 4.061c-4.105 0-8.208-1.624-12.641-5.035l-6.403 9.42c4.925 4.06 12.477 6.821 18.715 6.821c13.134 0 20.193-6.821 20.193-15.754s-7.059-12.668-13.461-14.779m39.728 0c-4.925-1.949-9.521-3.086-9.521-6.335c0-2.435 1.97-3.897 5.581-3.897s6.896 1.462 10.508 4.061l6.566-8.609c-4.104-3.085-9.686-6.334-17.238-6.334c-11.164 0-18.715 6.334-18.715 15.267c0 7.958 7.059 12.018 12.969 14.292c5.089 1.949 10.014 3.574 10.014 6.821c0 2.437-1.97 4.061-6.402 4.061c-4.104 0-8.209-1.624-12.641-5.035l-6.567 9.42c4.925 4.06 12.477 6.821 18.716 6.821c13.133 0 20.192-6.821 20.192-15.754s-7.059-12.668-13.462-14.779m-97.517-.813c.985-6.496 4.925-9.581 9.522-9.581c5.91 0 8.209 4.059 8.209 9.581zm30.208 2.924c.164-13.155-7.06-23.387-20.85-23.387c-11.984 0-23.476 9.907-23.148 25.498c0 16.079 10.671 25.499 24.79 25.499c5.91 0 12.477-2.111 17.566-5.522l-4.925-8.607c-3.612 2.111-7.06 3.085-10.671 3.085c-6.567 0-11.657-3.085-12.97-10.557h29.715c.164-1.137.493-3.41.493-6.009" clip-rule="evenodd"/></g><g mask="url(#SVGEmbEVdLx)"><path fill="#faf9f8" fill-rule="evenodd" d="M74.317 144.502c-1.15 0-2.627-.975-2.627-4.061V85.383H48.378c-8.865 0-12.806 3.411-12.806 13.968c0 6.983.985 10.882.985 16.89c0 3.411-2.134 6.984-8.536 7.309v8.446c6.402.162 8.536 3.735 8.536 7.146c0 6.009-.985 9.582-.985 16.566c0 10.557 3.94 13.967 12.642 13.967h6.402v-7.471h-1.97c-4.104 0-5.417-1.624-5.417-6.983c0-5.36.492-9.907.492-15.917c0-7.471-2.462-10.395-7.388-11.531v-.487c4.926-1.137 7.388-4.061 7.388-11.531c0-5.848-.492-10.557-.492-15.917s1.148-6.82 5.417-6.82h4.433v46.611c0 9.907 3.448 16.404 13.462 16.404c3.119 0 5.582-.488 7.388-1.137l-1.642-10.557c-.985.163-1.477.163-1.97.163" clip-rule="evenodd"/></g></g></g><defs><clipPath id="SVGv3WPqdcU"><path fill="#fff" d="M0 0h256v256H0z"/></clipPath><clipPath id="SVG6u52mcDt"><path fill="#fff" d="M28 85h200v85H28z"/></clipPath><linearGradient id="SVGZNm6tbkh" x1="8789.49" x2="8789.49" y1="85.584" y2="8508.85" gradientUnits="userSpaceOnUse"><stop stop-color="#2e4f82"/><stop offset="1" stop-color="#182e4d"/></linearGradient></defs></g></svg>

Less Light アイコンの使い方

React

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

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

Vue

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

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

Svelte

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

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

Tailwind CSS

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

UnoCSS

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

Web コンポーネント

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

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

HTML 画像

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

Skill Icons の関連アイコン

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

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

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

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

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

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

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

Skill Icons をすべて見る →