Valibot アイコン
thesvg-color:valibot
Valibot アイコン(thesvg-color:valibot)は、theSVG Color セットの無料 SVG アイコンです（作者: thesvg.org）。 512 × 512 のグリッドで描かれています。 theSVG Color icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- theSVG Color
- 作者
- thesvg.org
- ライセンス
- MIT
- サイズ
- 512 × 512
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><defs><linearGradient id="SVGRNAm4cmf" x1=".414" x2="0" y1=".255" y2=".932" gradientUnits="objectBoundingBox"><stop offset="0" stop-color="#eab308"/><stop offset="1" stop-color="#ca8a04"/></linearGradient><linearGradient id="SVGVb43Zdex" x1=".338" x2=".664" y1=".02" y2=".966" gradientUnits="objectBoundingBox"><stop offset="0" stop-color="#fde68a"/><stop offset="1" stop-color="#fbbf24"/></linearGradient><linearGradient id="SVGJL7ledfV" x2="1" y1=".5" y2=".5" gradientUnits="objectBoundingBox"><stop offset="0" stop-color="#7dd3fc"/><stop offset="1" stop-color="#0ea5e9"/></linearGradient><path id="SVGDfC09dfC" fill="url(#SVGJL7ledfV)" d="M27.626 0A27.626 27.626 0 1 1 0 27.626A27.626 27.626 0 0 1 27.626 0"/></defs><g transform="translate(-2056 -1899)"><path fill="none" d="M2056 1899h512v512h-512z"/><path fill="url(#SVGRNAm4cmf)" d="M742.271 987.024c-66.706 0-119.121 54.673-121.874 126.408l-2.551 95.471c-3.967 78.653 71.961 105.52 126.936 105.52Z" transform="translate(1463.458 1004.277)"/><path fill="url(#SVGVb43Zdex)" d="M92.616.01h227.278c54.53-.8 95.624 40.1 98.381 93.335l6.144 135.76c.732 67.368-48.116 94.95-104.525 95.335l-227.278 2.934C34.061 327.8-1.063 283.663.022 229.105l3.8-135.76C7.41 33.54 33.3 1.093 92.616.01" transform="translate(2118.42 1991.302)"/><path fill="#111827" d="M2223.821 2001.746h213.114c51.132-.746 89.665 37.307 92.25 86.824l5.761 126.29c.686 62.669-45.117 88.326-98.011 88.685l-213.114 2.729c-54.906.396-87.844-40.662-86.824-91.414l3.56-126.289c3.368-55.634 27.642-85.818 83.264-86.825"/><use href="#SVGDfC09dfC" transform="translate(2421.148 2104.357)"/><use href="#SVGDfC09dfC" transform="translate(2208.034 2104.357)"/></g></svg>Valibot アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:valibot" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:valibot" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:valibot" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--valibot]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:valibot"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:valibot"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/thesvg-color/valibot.svg" alt="Valibot アイコン" width="24" height="24">Valibot アイコン のよくある質問
Valibot アイコンは商用利用でも無料ですか?
はい。theSVG Color icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Valibot アイコンを使うには?
@iconify/react をインストールして <Icon icon="thesvg-color:valibot" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Valibot アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/thesvg-color/valibot.svg" alt="Valibot アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。