Folder Connect アイコン
reicon:folder-connect
Folder Connect アイコン(reicon:folder-connect)は、Reicon セットの無料 SVG アイコンです。 24 × 24 のグリッドで描かれています。 Reicon icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M20.896 4.774a3.22 3.22 0 0 0-1.419-1.419C18.782 3 18.019 3 16.501 3h-3.764c-.149 0-.303 0-.417-.043c-.031-.023-.135-.145-.228-.253l-.548-.639c-.195-.227-.323-.377-.51-.506a1.7 1.7 0 0 0-.542-.249c-.221-.06-.411-.06-.726-.06H7.502c-1.519 0-2.28 0-2.975.354a3.24 3.24 0 0 0-1.421 1.42c-.354.695-.354 1.457-.354 2.975v6c0 1.519 0 2.281.354 2.976a3.23 3.23 0 0 0 1.42 1.42c.695.354 1.457.354 2.975.354h3.75v2.628a2.26 2.26 0 0 0-1.372 1.372H5a.75.75 0 0 0 0 1.5h4.878a2.25 2.25 0 0 0 4.244 0H19a.75.75 0 0 0 0-1.5h-4.878a2.26 2.26 0 0 0-1.372-1.372v-2.628h3.75c1.519 0 2.281 0 2.976-.354a3.23 3.23 0 0 0 1.42-1.42c.354-.695.354-1.457.354-2.976v-4.25c0-1.518 0-2.279-.354-2.975M12 22.25a.75.75 0 1 1 0-1.5a.75.75 0 0 1 0 1.5M19.75 12c0 1.238 0 1.92-.19 2.294a1.74 1.74 0 0 1-.765.765c-.375.191-1.057.191-2.295.191h-9c-1.238 0-1.92 0-2.294-.191a1.76 1.76 0 0 1-.765-.764C4.25 13.92 4.25 13.238 4.25 12V6c0-1.238 0-1.92.19-2.294c.167-.327.438-.599.766-.765C5.58 2.75 6.262 2.75 7.5 2.75h2.264c.147 0 .3 0 .417.044c.03.023.128.137.228.253l.542.631c.197.23.327.383.515.512c.167.115.352.2.546.251c.22.058.41.058.724.058H16.5c1.238 0 1.92 0 2.295.191c.331.168.595.433.764.764c.191.375.191 1.056.191 2.294z"/></svg>Folder Connect アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="reicon:folder-connect" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="reicon:folder-connect" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="reicon:folder-connect" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[reicon--folder-connect]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/reicon -->
<div class="i-reicon:folder-connect"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="reicon:folder-connect"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/reicon/folder-connect.svg" alt="Folder Connect アイコン" width="24" height="24">Reicon の関連アイコン
folder
folder-2
folder-2-filled
folder-add
folder-add-duotone
folder-add-filled
folder-add3
folder-add3-filled
folder-bookmark
folder-bookmark-duotone
folder-bookmark-filled
folder-check
folder-check-duotone
folder-check-filled
folder-cloud
folder-cloud-duotone
folder-cloud-filled
folder-cloud3
folder-cloud3-filled
folder-connect-filled
folder-connection
folder-connection-filled
folder-cross
folder-cross-filled
Folder Connect アイコン のよくある質問
Folder Connect アイコンは商用利用でも無料ですか?
はい。Reicon icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Folder Connect アイコンを使うには?
@iconify/react をインストールして <Icon icon="reicon:folder-connect" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Folder Connect アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/reicon/folder-connect.svg" alt="Folder Connect アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。