ICONYZ
日本語
theSVG Color の Productboard Light アイコン

Productboard Light アイコン

thesvg-color:productboard-light

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

アイコンセット
theSVG Color
作者
thesvg.org
ライセンス
MIT
サイズ
368 × 45
タグ
productboardlight
SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="368" height="45" viewBox="0 0 368 45"><path fill="#ff2638" d="m20 23.4l20 19.7H0z"/><path fill="#ffc600" d="m0 3.8l20 19.6L40 3.8z"/><path fill="#0079f2" d="m20 23.4l20 19.7l20-19.7L40 3.8z"/><path fill="#fff" d="M361.9 13.1c0 .3-.4.4-.6.2c-1.5-1.7-3.9-3-7.2-3c-7.2 0-11.2 5.8-11.2 12.8s4.1 12.7 11.2 12.7c3.4 0 6-1.2 7.6-3.2c.2-.2.6-.1.6.2V35q0 .3.3.3h4.6q.3 0 .3-.3V.3q0-.3-.3-.3h-5q-.3 0-.3.3zm.3 10c0 4.4-2.6 7.8-6.8 7.8s-6.8-3.4-6.8-7.8c0-4.5 2.6-7.8 6.8-7.8c4.2-.1 6.8 3.3 6.8 7.8m-20.6-12.2c0-.1-.1-.3-.3-.3h-.5c-3.4 0-5.4 1.4-6.5 2.7c-.2.2-.6.1-.6-.2v-2q0-.3-.3-.3h-4.6q-.3 0-.3.3v23.8q0 .3.3.3h5q.3 0 .3-.3V22.5c0-4.7 2.3-6.8 6.3-6.8c.3 0 .7 0 .9.1q.3 0 .3-.3c-.1 0-.1-4.6 0-4.6M318 23.8c.2 0 .3.1.3.2v1.2c0 3.3-2.2 6.1-6.7 6.1c-2.7 0-4.3-.9-4.3-3.2c0-1.7 1.1-3 4.5-3.5zm-7.5 12q5.25 0 7.8-3c.2-.2.6-.1.6.2c.1 1.4.3 2.2.3 2.2h4.9c.2 0 .4-.2.3-.4c-.3-1.1-.6-2.8-.6-4.2V19.4c0-5.6-3.4-9.1-10.5-9.1c-7.2 0-10.1 3.8-10.7 7.9q0 .3.3.3h4.9c.1 0 .3-.1.3-.2c.5-2.1 2.2-3.4 5.1-3.4c3.3 0 5.2 1.5 5.2 4.5v.1c0 .1-.1.3-.2.3l-6.8 1c-6.4.9-9.3 3.6-9.3 7.7c-.1 4.1 2.4 7.3 8.4 7.3m-23.3 0c7.8 0 12.6-5.9 12.6-12.7c0-6.9-4.9-12.8-12.6-12.8s-12.6 5.9-12.6 12.8c.1 6.8 4.9 12.7 12.6 12.7m-7-12.7c0-4.7 3-7.8 7-7.8c4.1 0 7.1 3.1 7.1 7.8s-3 7.8-7.1 7.8c-4 0-7-3.1-7-7.8m-26-9.8c-.2.2-.6.1-.6-.2V.3q0-.3-.3-.3h-5q-.3 0-.3.3v34.6q0 .3.3.3h4.6q.3 0 .3-.3v-2.2c0-.3.4-.4.6-.2c1.7 2 4.3 3.2 7.6 3.2c7.2 0 11.3-5.8 11.3-12.7c0-7-4.1-12.8-11.3-12.8c-3.3.1-5.8 1.4-7.2 3.1m-.8 9.8c0-4.5 2.6-7.8 6.8-7.8s6.8 3.4 6.8 7.8s-2.6 7.8-6.8 7.8s-6.8-3.5-6.8-7.8m-10.1 7.5q0-.3-.3-.3h-.1c-.3.1-.8.1-1.4.1c-1.9 0-2.7-.9-2.7-2.9v-12q0-.3.3-.3h4q.3 0 .3-.3V11q0-.3-.3-.3h-4q-.3 0-.3-.3V4.8q0-.3-.3-.3h-5q-.3 0-.3.3v5.8q0 .3-.3.3h-3.1q-.3 0-.3.3V15q0 .3.3.3h3.1q.3 0 .3.3v12.6c0 4.6 2.2 7.2 7.1 7.2c1.4 0 2.3-.2 2.7-.2c.1 0 .2-.1.2-.3v-4.3zM204 23.1c0 7 5 12.7 12.1 12.7c7 0 10.7-4.8 11.5-9.1c0-.2-.1-.3-.2-.3h-5.2c-.1 0-.2.1-.3.2c-.7 2.5-2.9 4.2-5.8 4.2c-4 0-6.5-3.2-6.5-7.8s2.5-7.8 6.5-7.8c2.9 0 5.1 1.7 5.8 4.2c0 .1.2.2.3.2h5.1q.3 0 .3-.3v-.1c-.8-4.3-4.4-9.1-11.5-9.1c-7.1.2-12.1 5.9-12.1 13m-9.4 1.8c0 4-2.2 6.1-5.6 6.1s-4.7-2.2-4.7-5.5V11.1q0-.3-.3-.3h-5q-.3 0-.3.3v15.1c0 5.7 3 9.6 8.9 9.6c3.3 0 5.5-1.2 6.8-2.8c.2-.2.6-.1.6.2v1.7q0 .3.3.3h4.6q.3 0 .3-.3V11.1q0-.3-.3-.3h-5q-.3 0-.3.3zm-25.7-11.8c0 .3-.4.4-.6.2c-1.5-1.7-3.9-3-7.2-3c-7.2 0-11.2 5.8-11.2 12.8s4.1 12.7 11.2 12.7c3.3 0 6-1.2 7.6-3.2c.2-.2.6-.1.6.2V35q0 .3.3.3h4.6q.3 0 .3-.3V.3q0-.3-.3-.3h-5q-.3 0-.3.3zm.2 10c0 4.4-2.6 7.8-6.8 7.8s-6.8-3.4-6.8-7.8c0-4.5 2.6-7.8 6.8-7.8c4.2-.1 6.8 3.3 6.8 7.8M135 35.8c7.8 0 12.6-5.9 12.6-12.7c0-6.9-4.9-12.8-12.6-12.8s-12.6 5.9-12.6 12.8c0 6.8 4.9 12.7 12.6 12.7m-7-12.7c0-4.7 3-7.8 7-7.8c4.1 0 7.1 3.1 7.1 7.8s-3 7.8-7.1 7.8c-4 0-7-3.1-7-7.8m-6.2-12.2c0-.1-.1-.3-.3-.3h-.5c-3.4 0-5.4 1.4-6.5 2.7c-.2.2-.6.1-.6-.2v-2q0-.3-.3-.3H109q-.3 0-.3.3v23.8q0 .3.3.3h5q.3 0 .3-.3V22.5c0-4.7 2.3-6.8 6.3-6.8c.3 0 .7 0 .9.1q.3 0 .3-.3zM86.2 33c0-.3.4-.4.6-.2c1.5 1.7 3.9 3 7.2 3c7.2 0 11.3-5.8 11.3-12.7c0-7-4.1-12.8-11.3-12.8c-3.3 0-5.9 1.2-7.6 3.2c-.2.2-.6.1-.6-.2v-2.2q0-.3-.3-.3h-4.6q-.3 0-.3.3v33.6q0 .3.3.3h5q.3 0 .3-.3zm-.2-9.9c0-4.5 2.6-7.9 6.8-7.9s6.8 3.4 6.8 7.9c0 4.4-2.6 7.8-6.8 7.8S86 27.4 86 23.1"/></svg>

Productboard Light アイコンの使い方

React

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

<Icon icon="thesvg-color:productboard-light" width="24" />

Vue

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

<template>
  <Icon icon="thesvg-color:productboard-light" width="24" />
</template>

Svelte

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

<Icon icon="thesvg-color:productboard-light" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--productboard-light]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:productboard-light"></div>

Web コンポーネント

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

<iconify-icon icon="thesvg-color:productboard-light"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/thesvg-color/productboard-light.svg" alt="Productboard Light アイコン" width="24" height="24">

theSVG Color の関連アイコン

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

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

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

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

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

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

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

theSVG Color アイコン をすべて見る →