Yopass アイコン
selfhst:yopass
Yopass アイコン(selfhst:yopass)は、selfh.st/icons セットの無料 SVG アイコンです（作者: selfh.st）。 512 × 512 のグリッドで描かれています。 selfh.st/icons は CC BY 4.0 ライセンス で公開されています。作者のクレジットを表記すれば、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- selfh.st/icons
- 作者
- selfh.st
- ライセンス
- CC-BY-4.0
- サイズ
- 512 × 512
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><linearGradient id="SVGgPVxsbGF" x1="683.536" x2="-125.134" y1="390.407" y2="26.976" gradientTransform="matrix(1 0 0 -1 0 514)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#009643"/><stop offset=".182" stop-color="#009346"/><stop offset=".337" stop-color="#018951"/><stop offset=".483" stop-color="#037963"/><stop offset=".623" stop-color="#06637c"/><stop offset=".759" stop-color="#09469c"/><stop offset=".89" stop-color="#0d23c2"/><stop offset="1" stop-color="#1100e9"/></linearGradient><path fill="url(#SVGgPVxsbGF)" d="M388.3 308.9c-39.4 0-73.8 22.2-89.8 55.4l-96-49.2c12.3-17.2 19.7-36.9 19.7-60.3c0-22.2-7.4-43.1-19.7-60.3l96-49.2c16 32 48 54.2 86.1 55.4c55.4 1.2 102.1-41.8 103.4-97.2C489.2 48 446.1 1.3 390.8 0S288.6 41.9 287.4 97.3c0 4.9 0 9.8 1.2 14.8l-113.2 57.8c-16-9.8-34.5-16-54.2-16c-55.4 1.2-99.7 46.8-99.7 102.1s44.3 100.9 100.9 100.9c19.7 0 38.2-6.2 54.2-16l113.2 57.8c0 3.7-1.2 7.4-1.2 12.3c0 55.4 44.3 100.9 100.9 100.9c55.4 0 100.9-44.3 100.9-100.9c-1.2-56.5-46.7-102.1-102.1-102.1m2.5-278.1c39.4 1.2 70.2 34.5 68.9 72.6c-1.2 39.4-34.5 70.2-72.6 68.9c-27.1-1.2-50.5-17.2-61.5-39.4c-4.9-9.8-7.4-22.2-7.4-33.2c1.2-39.4 33.2-68.9 72.6-68.9M143.4 323.7c-6.2 2.5-13.5 3.7-20.9 3.7c-39.4 0-71.4-32-71.4-71.4s32-71.4 71.4-71.4c7.4 0 14.8 1.2 20.9 3.7c12.3 3.7 23.4 11.1 32 20.9c11.1 12.3 17.2 28.3 17.2 46.8c0 17.2-6.2 34.5-17.2 46.8c-8.6 9.8-19.7 17.2-32 20.9m244.9 157.5c-38.2 0-68.9-30.8-71.4-67.7V411c0-11.1 2.5-22.2 7.4-30.8c11.1-23.4 35.7-39.4 64-39.4c39.4 0 71.4 32 71.4 71.4c0 37-32 69-71.4 69"/><linearGradient id="SVGe3q2Jp0I" x1="1284.737" x2="-1755.598" y1="504.772" y2="-861.607" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#009643"/><stop offset=".182" stop-color="#009346"/><stop offset=".337" stop-color="#018951"/><stop offset=".483" stop-color="#037963"/><stop offset=".623" stop-color="#06637c"/><stop offset=".759" stop-color="#09469c"/><stop offset=".89" stop-color="#0d23c2"/><stop offset="1" stop-color="#1100e9"/></linearGradient><path fill="url(#SVGe3q2Jp0I)" d="M388.3 91.1c6.1 0 11.1 5 11.1 11.1s-5 11.1-11.1 11.1s-11.1-5-11.1-11.1s5-11.1 11.1-11.1m34.5 0c6.1 0 11.1 5 11.1 11.1s-5 11.1-11.1 11.1s-11.1-5-11.1-11.1s4.9-11.1 11.1-11.1m-67.7 0c6.1 0 11.1 5 11.1 11.1s-5 11.1-11.1 11.1s-11.1-5-11.1-11.1s5-11.1 11.1-11.1"/><linearGradient id="SVGBxpnDc8P" x1="1975.763" x2="-1064.575" y1="1123.009" y2="-243.375" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#009643"/><stop offset=".182" stop-color="#009346"/><stop offset=".337" stop-color="#018951"/><stop offset=".483" stop-color="#037963"/><stop offset=".623" stop-color="#06637c"/><stop offset=".759" stop-color="#09469c"/><stop offset=".89" stop-color="#0d23c2"/><stop offset="1" stop-color="#1100e9"/></linearGradient><path fill="url(#SVGBxpnDc8P)" d="M388.3 398.8c6.1 0 11.1 5 11.1 11.1s-5 11.1-11.1 11.1s-11.1-5-11.1-11.1c0-6.2 5-11.1 11.1-11.1m34.5 0c6.1 0 11.1 5 11.1 11.1s-5 11.1-11.1 11.1s-11.1-5-11.1-11.1c0-6.2 4.9-11.1 11.1-11.1m-67.7 0c6.1 0 11.1 5 11.1 11.1s-5 11.1-11.1 11.1s-11.1-5-11.1-11.1c0-6.2 5-11.1 11.1-11.1"/><linearGradient id="SVGrjsELdeQ" x1="547.681" x2="-118.162" y1="447.549" y2="148.307" gradientTransform="matrix(1 0 0 -1 0 514)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#009643"/><stop offset=".182" stop-color="#009346"/><stop offset=".337" stop-color="#018951"/><stop offset=".483" stop-color="#037963"/><stop offset=".623" stop-color="#06637c"/><stop offset=".759" stop-color="#09469c"/><stop offset=".89" stop-color="#0d23c2"/><stop offset="1" stop-color="#1100e9"/></linearGradient><path fill="url(#SVGrjsELdeQ)" d="M138.5 235.1c0-9.8-7.4-17.2-17.2-17.2s-17.2 7.4-17.2 17.2c0 6.2 2.5 11.1 7.4 13.5l-7.4 44.3h33.2l-7.4-44.3c6.1-2.4 8.6-7.4 8.6-13.5"/></svg>Yopass アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="selfhst:yopass" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="selfhst:yopass" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="selfhst:yopass" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[selfhst--yopass]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/selfhst -->
<div class="i-selfhst:yopass"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="selfhst:yopass"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/selfhst/yopass.svg" alt="Yopass アイコン" width="24" height="24">selfh.st/icons の関連アイコン
Yopass アイコン のよくある質問
Yopass アイコンは商用利用でも無料ですか?
はい。selfh.st/icons は CC BY 4.0 ライセンス で公開されています。作者のクレジットを表記すれば、個人・商用プロジェクトで利用できます。
React で Yopass アイコンを使うには?
@iconify/react をインストールして <Icon icon="selfhst:yopass" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Yopass アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/selfhst/yopass.svg" alt="Yopass アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。