Trees アイコン

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

はい。Foundation icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。

foundation:trees

Trees アイコン(foundation:trees)は、Foundation セットの無料 SVG アイコンです（作者: Zurb）。 100 × 100 のグリッドで描かれています。 Foundation icons は MIT ライセンスで公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット: Foundation
作者: Zurb
ライセンス: MIT
サイズ: 100 × 100
タグ: tree

SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path fill="currentColor" d="m91.963 80.982l.023-.013l-7.285-12.617h2.867v-.013c.598 0 1.083-.484 1.083-1.082c0-.185-.059-.351-.14-.503l.019-.011l-6.737-11.669h1.639v-.009a.773.773 0 0 0 .773-.772a.76.76 0 0 0-.1-.359l.013-.008l-9.802-16.979l-.01.006a1.32 1.32 0 0 0-1.186-.754c-.524 0-.968.311-1.185.752l-.005-.003l-9.802 16.978l.002.001a.75.75 0 0 0-.105.366c0 .426.346.772.773.772v.009h1.661l-6.737 11.669l.003.001a1.06 1.06 0 0 0-.147.513c0 .598.485 1.082 1.083 1.082v.013h2.894l-2.1 3.638l-8.399-14.548h4.046v-.018c.844 0 1.528-.685 1.528-1.528c0-.26-.071-.502-.186-.717l.015-.009l-9.507-16.467h2.313v-.012a1.09 1.09 0 0 0 1.091-1.092c0-.186-.059-.353-.141-.506l.019-.011L36.4 13.125l-.005.003a1.87 1.87 0 0 0-1.683-1.06c-.758 0-1.408.452-1.704 1.1L19.201 37.082l.003.002a1.06 1.06 0 0 0-.148.516a1.09 1.09 0 0 0 1.09 1.092v.012h2.345l-9.395 16.272a1.5 1.5 0 0 0-.316.92c0 .844.685 1.528 1.528 1.528v.018h4.084L8.252 75.007c-.24.314-.387.702-.387 1.128c0 1.032.838 1.87 1.871 1.87v.021h19.779v8.43c0 .815.661 1.477 1.476 1.477h7.383c.815 0 1.477-.661 1.477-1.477v-8.43h16.12l-1.699 2.943l.003.002c-.104.189-.18.396-.18.628c0 .732.593 1.325 1.325 1.325v.015h14.016v3.941c0 .578.469 1.046 1.046 1.046h5.232c.578 0 1.046-.468 1.046-1.046v-3.941h14.05v-.015c.732 0 1.326-.593 1.326-1.325a1.3 1.3 0 0 0-.173-.617"/></svg>

Trees アイコンの使い方

React

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

<Icon icon="foundation:trees" width="24" />

Vue

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

<template>
  <Icon icon="foundation:trees" width="24" />
</template>

Svelte

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

<Icon icon="foundation:trees" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[foundation--trees]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/foundation -->
<div class="i-foundation:trees"></div>

Web コンポーネント

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

<iconify-icon icon="foundation:trees"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/foundation/trees.svg" alt="Trees アイコン" width="24" height="24">

他のアイコンセットの Trees アイコン

Trees アイコンのよくある質問

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

はい。Foundation icons は MIT ライセンスで公開されており、個人・商用プロジェクトで利用できます。

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

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

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

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

Foundation アイコンをすべて見る →