File Explorer アイコン

Q: File Explorer アイコンは商用利用でも無料ですか?

はい。selfh.st/icons は CC BY 4.0 ライセンス で公開されています。作者のクレジットを表記すれば、個人・商用プロジェクトで利用できます。

selfhst:file-explorer

File Explorer アイコン(selfhst:file-explorer)は、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
タグ: fileexplorer

SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><linearGradient id="SVGB7cZcePa" x1="256.25" x2="256.25" y1="286.85" y2="385.85" gradientTransform="translate(0 -254.85)" gradientUnits="userSpaceOnUse"><stop offset=".46" stop-color="#e09f00"/><stop offset="1" stop-color="#bb8500"/></linearGradient><path fill="url(#SVGB7cZcePa)" d="M.5 131V54.2C.5 42 10.4 32 22.7 32h133c12.3 0 25 9.5 51.7 47.6h278.9c14.2 0 25.7 8.8 25.7 23V131z"/><linearGradient id="SVGLY3U7dJW" x1="0" x2="512" y1="538.971" y2="538.971" gradientTransform="translate(0 -254.85)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffe28e"/><stop offset="1" stop-color="#ffcf48"/></linearGradient><path fill="url(#SVGLY3U7dJW)" d="M0 135.8c0-13.2 10.7-23.9 23.9-23.9h138.3c15 0 46.3-22.8 45.9-23.1c-.3-.3 211.9-.1 281.8 0c12.2 0 22.1 9.9 22.1 22.1v345.8c0 12.7-10.3 22.9-22.9 22.9H23.4C10.5 479.6 0 469.1 0 456.2z"/><linearGradient id="SVGNowbb7tB" x1="51.552" x2="473.105" y1="338.251" y2="759.831" gradientTransform="translate(0 -254.85)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffd65e"/><stop offset=".26" stop-color="#fed45a"/><stop offset=".46" stop-color="#fdd151"/><stop offset=".64" stop-color="#fccb40"/><stop offset=".81" stop-color="#f9c229"/><stop offset=".97" stop-color="#f6b70c"/><stop offset="1" stop-color="#f6b505"/></linearGradient><path fill="url(#SVGNowbb7tB)" d="M0 145.6c0-14.2 11.5-25.7 25.7-25.7h136.4c15 0 46.3-22.8 45.9-23.1c-.3-.3 211.9-.1 281.8 0c12.2 0 22.1 9.9 22.1 22.1v337.8c0 12.7-10.3 22.9-22.9 22.9H23.4C10.5 479.6 0 469.1 0 456.2z"/><linearGradient id="SVGF6oNyj5T" x1="167.598" x2="332.579" y1="556.638" y2="792.299" gradientTransform="translate(0 -254.85)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#1391dd"/><stop offset=".28" stop-color="#118cd8"/><stop offset=".6" stop-color="#0b7dcc"/><stop offset=".94" stop-color="#0166b7"/><stop offset="1" stop-color="#0062b4"/></linearGradient><path fill="url(#SVGF6oNyj5T)" d="M146.4 335.6h218.8c32.2 0 58.3 26.1 58.3 58.3v86H88v-86c0-32.1 26.2-58.3 58.4-58.3"/><path fill="#114a8b" d="M350.4 409.9H159.8c-1.7 0-3-1.3-3-3s1.3-3 3-3h190.6c1.7 0 3 1.3 3 3s-1.3 3-3 3"/></svg>

File Explorer アイコンの使い方

React

import { Icon } from "@iconify/react";

<Icon icon="selfhst:file-explorer" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="selfhst:file-explorer" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="selfhst:file-explorer" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[selfhst--file-explorer]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/selfhst -->
<div class="i-selfhst:file-explorer"></div>

Web コンポーネント

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="selfhst:file-explorer"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/selfhst/file-explorer.svg" alt="File Explorer アイコン" width="24" height="24">

selfh.st/icons の関連アイコン

File Explorer アイコンのよくある質問

File Explorer アイコンは商用利用でも無料ですか?

はい。selfh.st/icons は CC BY 4.0 ライセンスで公開されています。作者のクレジットを表記すれば、個人・商用プロジェクトで利用できます。

React で File Explorer アイコンを使うには?

@iconify/react をインストールして <Icon icon="selfhst:file-explorer" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。

File Explorer アイコンをウェブページに追加するには?

画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/selfhst/file-explorer.svg" alt="File Explorer アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。

selfh.st/icons をすべて見る →