Ember アイコン

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

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

thesvg-color:ember

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

アイコンセット: theSVG Color
作者: thesvg.org
ライセンス: MIT
サイズ: 512 × 213

SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="213" viewBox="0 0 512 213"><path fill="#fff" d="M511.7 146.4c-1.2-12.2-10-17.6-18.4-17.6a22 22 0 0 0-8 1.5l-1.6.7l-1.4 1c-2 1.5-5.4 3.5-8.4 4.6a43 43 0 0 1 .3-8.3v-.5c2.3-21.4-2.2-34-13.3-37.1c-1.9-.5-3.8-.8-5.7-.8c-6.8 0-12.8 3.3-16.7 6c-3.2-4-8.7-6.4-15.5-6.4c-10.2 0-18.3 4.8-21.3 12.4l-1.2 3.5A31.2 31.2 0 0 0 371 87a47.5 47.5 0 0 0-25 7.2l-.6.4a74.8 74.8 0 0 0-23.7 27.3a43 43 0 0 0-19.4-25l-.2-.2l-.9-.4c10.5-18.7 19.9-43.4 14.3-67c-6-25-20.7-28.8-29-28.8c-3.4 0-7 .7-10.5 2h-.5a51.2 51.2 0 0 0-23.9 17.6a156.5 156.5 0 0 0-22.8 66.3l-1.4 12.9a23.2 23.2 0 0 0-18.6-9.3c-8.6 0-15.6 5.3-19.4 8.8v-.1a18 18 0 0 0-14.2-8h-1.4c-9.2 0-16.5 4-21.9 8.7c-3.4-6-9.7-9.7-17-9.7h-3c-10.2 0-18.2 4.9-21.5 12.9l-.8 2.4a38 38 0 0 0-31.9-14.6h-1.3c-8.5.1-29.8 3.7-42.9 33c-2 4.6-3.6 9.2-4.7 13.7a17.8 17.8 0 0 0-22 5.9c-2 3-8.4 13.4-5.2 23.7c1.7 5.5 5.7 9.7 11.3 11.8c4.8 2 11 3.9 15.7 5.2c2.9 6.5 8 14 17.1 21a39.4 39.4 0 0 0 24.4 7.3c16.3 0 32.1-7 33.8-7.8l.6-.3l.2-.2c3 3.3 7.2 5.6 12.4 6.6c1.6.3 3.6.6 6 .6c8.8 0 15-4.5 20.6-13a26.5 26.5 0 0 0 23.1 11.4h.1c.6 0 1.1.4 1.7.4c5.3 0 12-1.9 17.4-10.7c4.6 8.2 13 13 23 13c8.8 0 16.5-3.7 17.9-4.4l.3-.2c3-1.5 5.4-3 7.4-4a62 62 0 0 0 35.2 7h1.1c26-5.2 43-11.4 53-16.2a50.1 50.1 0 0 0 39.9 17c13.2 0 23.8-3.8 31.5-7.9a27 27 0 0 0 9.7 6.7a19 19 0 0 0 7.4 1.5c16.2 0 23.7-19.3 25.8-25.8l4-10.4c3.3 3.6 7.7 6.6 13.2 8.1c3 .9 6.3 1.4 9.6 1.4c17.8 0 35-12.6 37.6-14.7c5-4 10.3-12.4 9.1-23.8"/><path fill="#e24b31" d="M348.7 151.7s-2.2-8 6.2-23.3c8.3-15.2 14.8-6.9 14.8-6.9s7.2 7.8-1 19.4s-20 10.8-20 10.8m-64 11c-9.6 25-32.9 14.8-32.9 14.8s-2.6-8.9 5-34c7.5-25 25.2-15.2 25.2-15.2s12.2 9.4 2.6 34.4M267.3 57.9s14.5-37.7 18-19.4c3.4 18.4-30.3 73-30.3 73c.3-12.4 12.3-53.6 12.3-53.6M60.6 151.7c.7-24.3 16.5-34.8 22-29.6c5.5 5.3 3.5 16.7-6.9 23.9c-10.3 7.1-15 5.7-15 5.7m437.8-4c-.8-8.2-8.1-5.1-8.1-5.1s-11.8 9.1-22.3 8.1c-10.3-1-7-24.2-7-24.2s2.2-21.3-4-23c-6-1.9-13.6 5.4-13.6 5.4s-9.4 10.4-13.8 23.7l-1.3.3s1.4-23.2-.2-28.5c-1.2-2.6-12.4-2.4-14.2 2.3a281 281 0 0 0-11.4 50.9s-17.5 14.8-32.8 17.3c-15.3 2.4-19-7.2-19-7.2s41.6-11.5 40.1-44.7c-1.4-33.2-33.5-20.9-37.1-18.2c-3.5 2.7-22.2 14-27.8 45.2l-.5 5.8s-16 10.8-25 13.7c0 0 25-42.2-5.5-61.3c-13.9-8.4-24.9 9.1-24.9 9.1s41.3-46 32.2-84.9C297.9 14 288.7 12 280 15a39 39 0 0 0-17.8 12.6s-16.7 24.3-20.6 60.3c-3.8 36-9.5 79.6-9.5 79.6s-8 7.7-15.2 8.1c-7.3.4-4-21.7-4-21.7s5.6-33.8 5.2-39.5s-.8-8.8-7.5-10.8s-14.1 6.5-14.1 6.5s-19.3 29.3-21 33.8l-1 1.9l-1-1.3s13.7-39.9.6-40.4c-13-.7-21.6 14.2-21.6 14.2s-14.8 24.8-15.4 27.6l-1-1.2s6.1-28.9 4.9-36c-1.3-7.2-8-5.7-8-5.7s-8.5-1-10.8 4.5c-2.2 5.5-10.4 42-11.4 53.5c0 0-21.4 15.3-35.4 15.5s-12.6-9-12.6-9s51.5-17.6 37.4-52.4c-6.3-9-13.6-11.7-24-11.6c-10.4.3-22.6 6.5-31 25.3c-4 8.9-5.6 17.4-5.6 23.8c0 0-9.6 1.9-14.5-2.2c-4.9-4-7.7 0-7.7 0s-8.5 12.2-.2 15.4c8.3 3.3 21.2 6.3 21.2 6.3c1.2 5.3 4.7 14 14.8 21.6c15.3 11.6 44.6-1.8 44.6-1.8l12-7.1s.5 10.8 9.2 12.4c8.8 1.6 12.5-.1 27.7-37.1c9-19 9.6-18 9.6-18l1-.2s-7 36.2-4.3 46c2.6 9.8 14.2 8.8 14.2 8.8s6.3 2.2 11.4-15.7c5.2-18 14.9-36.7 14.9-36.7h1.2s-4.3 36 2.3 47.9c6.5 11.8 23.4 3.5 23.4 3.5s11.8-6.3 13.6-8.1c0 0 14 11.8 33.8 9.6c44.2-8.7 60-20.5 60-20.5s7.5 19.2 31 21c26.9 2 41.6-15 41.6-15s-.3 11 9.1 15c9.4 3.8 15.7-16.7 15.7-16.7l15.7-42h1.4s.8 26.8 16.3 31.3c15.7 4.5 35.8-11 35.8-11s4.9-3.3 4-11.5"/></svg>

Ember アイコンの使い方

React

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

<Icon icon="thesvg-color:ember" width="24" />

Vue

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

<template>
  <Icon icon="thesvg-color:ember" width="24" />
</template>

Svelte

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

<Icon icon="thesvg-color:ember" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--ember]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:ember"></div>

Web コンポーネント

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

<iconify-icon icon="thesvg-color:ember"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/thesvg-color/ember.svg" alt="Ember アイコン" width="24" height="24">

theSVG Color の関連アイコン

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

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

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

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

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

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

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

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

theSVG Color アイコンをすべて見る →