Windicss アイコン
thesvg-color:windicss
Windicss アイコン(thesvg-color:windicss)は、theSVG Color セットの無料 SVG アイコンです(作者: thesvg.org)。 256 × 279 のグリッドで描かれています。 theSVG Color icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- theSVG Color
- 作者
- thesvg.org
- ライセンス
- MIT
- サイズ
- 256 × 279
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="256" height="279" viewBox="0 0 256 279"><defs><linearGradient id="SVGPPQVhuQy" x1="16.639%" x2="137.275%" y1="36.186%" y2="175.371%"><stop offset="7.822%" stop-color="#54c8f1"/><stop offset="57.292%" stop-color="#41a2ef"/><stop offset="100%" stop-color="#3386ee"/></linearGradient><linearGradient id="SVG2EiljeKP" x1="-22.099%" x2="91.451%" y1="-49.621%" y2="73.695%"><stop offset="7.822%" stop-color="#54c8f1"/><stop offset="57.292%" stop-color="#41a2ef"/><stop offset="100%" stop-color="#3386ee"/></linearGradient><linearGradient id="SVG0BXjlbLl" x1="8.696%" x2="71.739%" y1="37.461%" y2="80.271%"><stop offset="7.822%" stop-color="#54c8f1"/><stop offset="57.292%" stop-color="#41a2ef"/><stop offset="100%" stop-color="#3386ee"/></linearGradient><linearGradient id="SVGUwJDreYt" x1="60.744%" x2="501.135%" y1="-308.636%" y2="225.788%"><stop offset="7.822%" stop-color="#54c8f1"/><stop offset="57.292%" stop-color="#41a2ef"/><stop offset="100%" stop-color="#3386ee"/></linearGradient></defs><path fill="url(#SVGPPQVhuQy)" d="M133.784 48.922C133.784 21.945 111.84 0 84.863 0c-28.43 0-45.428 21.316-45.428 41.933h27.956c0-5.8 5.423-13.978 17.472-13.978c11.56 0 20.966 9.407 20.966 20.967s-8.438 20.966-29.715 20.966H0v27.955h76.114c35.911 0 57.67-21.944 57.67-48.921m0 0C133.784 21.945 111.84 0 84.863 0c-28.43 0-45.428 21.316-45.428 41.933h27.956c0-5.8 5.423-13.978 17.472-13.978c11.56 0 20.966 9.407 20.966 20.967s-8.438 20.966-29.715 20.966H0v27.955h76.114c35.911 0 57.67-21.944 57.67-48.921"/><path fill="url(#SVG2EiljeKP)" d="M195.803 229.339c0 26.978-21.945 48.922-48.922 48.922c-28.43 0-45.427-21.315-45.427-41.933h27.955c0 5.8 5.423 13.979 17.472 13.979c11.56 0 20.967-9.408 20.967-20.968s-10.63-20.966-29.716-20.966H53.671v-27.956h84.461c35.912 0 57.671 21.945 57.671 48.922m0 0c0 26.978-21.945 48.922-48.922 48.922c-28.43 0-45.427-21.315-45.427-41.933h27.955c0 5.8 5.423 13.979 17.472 13.979c11.56 0 20.967-9.408 20.967-20.968s-10.63-20.966-29.716-20.966H53.671v-27.956h84.461c35.912 0 57.671 21.945 57.671 48.922"/><path fill="url(#SVG0BXjlbLl)" d="M203.13 43.13c-30.834 0-52.585 23.45-52.585 54.284h24.76c0-15.327 11.13-26.457 27.825-26.457c16.696 0 25.044 11.13 25.044 26.457s-10.842 27.955-40.348 27.955H0v27.956h192c43.695 0 64-28.085 64-55.911c0-30.835-20.87-54.284-52.87-54.284"/><path fill="url(#SVGUwJDreYt)" d="M36.647 180.417H0v28.19h36.647z"/></svg>Windicss アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:windicss" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:windicss" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:windicss" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--windicss]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:windicss"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:windicss"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/thesvg-color/windicss.svg" alt="Windicss アイコン" width="24" height="24">他のアイコンセットの Windicss アイコン
Windicss アイコン のよくある質問
Windicss アイコンは商用利用でも無料ですか?
はい。theSVG Color icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Windicss アイコンを使うには?
@iconify/react をインストールして <Icon icon="thesvg-color:windicss" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Windicss アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/thesvg-color/windicss.svg" alt="Windicss アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。