Bridge アイコン
thesvg-color:bridge
Bridge アイコン(thesvg-color:bridge)は、theSVG Color セットの無料 SVG アイコンです(作者: thesvg.org)。 32 × 32 のグリッドで描かれています。 theSVG Color icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- theSVG Color
- 作者
- thesvg.org
- ライセンス
- MIT
- サイズ
- 32 × 32
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><g fill="none"><g clip-path="url(#SVGmAhx2dHO)"><path fill="#000b1d" d="M26.333 0H5.667A5.667 5.667 0 0 0 0 5.667v19.866A5.667 5.667 0 0 0 5.667 31.2h20.666A5.667 5.667 0 0 0 32 25.533V5.667A5.667 5.667 0 0 0 26.333 0"/><path fill="#fff" d="M7.342 21.889L7.333 8.27q0-.193.13-.215q.363-.021 1.115-.032l1.578-.022q.88-.01 1.61-.01c1.173 0 2.134.084 2.828.342q1.04.387 1.6.977c.354.345.623.768.788 1.234c.121.382.186.78.193 1.18c-.004.431-.09.857-.252 1.257a3.4 3.4 0 0 1-.515.912a2.5 2.5 0 0 1-.58.536q.46.244.849.59c.334.3.607.66.805 1.063a3.46 3.46 0 0 1 .37 1.627a3.87 3.87 0 0 1-.746 2.302q-.72.987-2.06 1.535a8.5 8.5 0 0 1-3.21.578h-1.428c-.45 0-.83-.004-1.21-.01l-.987-.022a26 26 0 0 0-.72-.01q-.15-.023-.15-.194m2.902-11.373l.014 2.97h1.406q.58 0 1.138.021q.401.003.794.086q.287-.245.462-.58c.143-.25.218-.534.218-.822a1.64 1.64 0 0 0-.315-.98a1.67 1.67 0 0 0-.805-.548a4.3 4.3 0 0 0-1.356-.168h-.622c-.186 0-.3.003-.45.01q-.226.011-.484.011m.014 5.476v3.569a21 21 0 0 0 1.556.043a5.7 5.7 0 0 0 1.557-.193a2 2 0 0 0 1.02-.601c.255-.276.403-.634.417-1.01a1.87 1.87 0 0 0-.353-1.008c-.186-.286-.53-.521-1.03-.65a5 5 0 0 0-.59-.107a6 6 0 0 0-.785-.043zm9.5-4.656h2.34a.29.29 0 0 1 .279.215q.076.142.107.3q.045.208.064.42c.015.15.022.357.022.529a5.1 5.1 0 0 1 1.428-1.195c.58-.322 1.19-.396 1.935-.396a.17.17 0 0 1 .193.194v2.556q0 .15-.215.15c-.454-.03-.91.002-1.355.097a5.3 5.3 0 0 0-1.117.354c-.29.117-.556.285-.788.494v6.754q0 .193-.172.193H19.95a.19.19 0 0 1-.215-.215v-7.333a49 49 0 0 0-.043-2.04q-.015-.466-.085-.926a.12.12 0 0 1 .087-.15a.1.1 0 0 1 .063 0"/></g><defs><clipPath id="SVGmAhx2dHO"><path fill="#fff" d="M0 0h32v31.2H0z"/></clipPath></defs></g></svg>Bridge アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:bridge" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:bridge" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:bridge" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--bridge]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:bridge"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:bridge"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/thesvg-color/bridge.svg" alt="Bridge アイコン" width="24" height="24">他のアイコンセットの Bridge アイコン
Bridge アイコン のよくある質問
Bridge アイコンは商用利用でも無料ですか?
はい。theSVG Color icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Bridge アイコンを使うには?
@iconify/react をインストールして <Icon icon="thesvg-color:bridge" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Bridge アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/thesvg-color/bridge.svg" alt="Bridge アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。