Wero アイコン
thesvg-color:wero
Wero アイコン(thesvg-color:wero)は、theSVG Color セットの無料 SVG アイコンです(作者: thesvg.org)。 178 × 41 のグリッドで描かれています。 theSVG Color icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- theSVG Color
- 作者
- thesvg.org
- ライセンス
- MIT
- サイズ
- 178 × 41
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="178" height="41" viewBox="0 0 178 41"><g fill="none"><g clip-path="url(#SVGK8L2qbVJ)"><path fill="#1d1c1c" d="M135.783 20.52c0-10.712 7.716-20.48 21.037-20.48s21.09 9.768 21.09 20.48S170.196 41 156.82 41s-21.035-9.768-21.035-20.48zm30.416 0c0-5.163-3.442-9.935-9.379-9.935c-5.938 0-9.38 4.774-9.38 9.935c0 5.16 3.498 9.935 9.38 9.935s9.379-4.775 9.379-9.935m-38.607 7.603c4.441-2.498 7.104-7.27 7.104-12.544c0-7.825-5.718-14.487-14.598-14.487H101.45v38.853h11.545V30.01h2.165l6.603 9.935h13.599zm-9.823-7.048h-4.774v-10.99h4.829c3.109 0 5.107 2.498 5.107 5.496s-2.054 5.496-5.162 5.496zM48.75 1.052L41.824 24.21L35.066 1.052H25.87L19.057 24.21l-6.87-23.157H0l13.96 38.78h10.026l6.481-21.107l6.428 21.107h10.08l13.962-38.78zm29.655 29.305h-.028c-4.318 0-7.346-2.576-8.646-5.988H99.07c.236-1.284.358-2.598.358-3.928C99.428 9.757 91.738.014 78.405 0v10.527c4.344.012 7.342 2.584 8.628 5.989H57.736a22 22 0 0 0-.354 3.927c0 10.692 7.7 20.444 20.995 20.444h.028z"/><path fill="url(#SVGS53F4bFC)" d="M78.377 40.884c.451 0 .895-.014 1.335-.034c2.702-.137 5.153-.68 7.34-1.557a19.5 19.5 0 0 0 5.738-3.54a19.3 19.3 0 0 0 4.027-5.044c.95-1.71 1.645-3.56 2.08-5.491H86.671a10 10 0 0 1-.874 1.468a9 9 0 0 1-1.596 1.694a8.6 8.6 0 0 1-2.036 1.23a9 9 0 0 1-2.45.662c-.43.055-.874.088-1.334.088c-2.75 0-4.978-1.048-6.567-2.688l-7.947 7.948c3.536 3.229 8.442 5.264 14.516 5.264z"/><path fill="url(#SVG3QXP1bSf)" d="M78.378 0C67.102 0 59.85 7.013 57.908 15.67h12.189c1.457-2.983 4.328-5.143 8.28-5.143c3.151 0 5.596 1.346 7.194 3.382l8.02-8.02C90.008 2.302 84.857.002 78.375.002z"/></g><defs><linearGradient id="SVGS53F4bFC" x1="92.744" x2="74.754" y1="18.026" y2="40.31" gradientUnits="userSpaceOnUse"><stop offset=".02" stop-color="#1d1c1c" stop-opacity="0"/><stop offset=".39" stop-color="#1d1c1c" stop-opacity=".66"/><stop offset=".68" stop-color="#1d1c1c"/></linearGradient><linearGradient id="SVG3QXP1bSf" x1="61.27" x2="79.754" y1="23.018" y2="4.534" gradientUnits="userSpaceOnUse"><stop offset=".02" stop-color="#1d1c1c" stop-opacity="0"/><stop offset=".39" stop-color="#1d1c1c" stop-opacity=".66"/><stop offset=".68" stop-color="#1d1c1c"/></linearGradient><clipPath id="SVGK8L2qbVJ"><path fill="#fff" d="M0 0h177.91v41H0z"/></clipPath></defs></g></svg>Wero アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:wero" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:wero" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:wero" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--wero]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:wero"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:wero"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/thesvg-color/wero.svg" alt="Wero アイコン" width="24" height="24">他のアイコンセットの Wero アイコン
Wero アイコン のよくある質問
Wero アイコンは商用利用でも無料ですか?
はい。theSVG Color icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Wero アイコンを使うには?
@iconify/react をインストールして <Icon icon="thesvg-color:wero" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Wero アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/thesvg-color/wero.svg" alt="Wero アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。