ICONYZ
日本語
Energy Icons の Drum 48 アイコン

Drum 48 アイコン

energy-icons:drum-48

Drum 48 アイコン(energy-icons:drum-48)は、Energy Icons セットの無料 SVG アイコンです(作者: Sam Passmore)。 48 × 48 のグリッドで描かれています。 Energy Icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット
Energy Icons
作者
Sam Passmore
ライセンス
MIT
サイズ
48 × 48
SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><path fill="currentColor" d="M39 14c0-.224-.147-.621-.852-1.142c-.684-.506-1.74-1.004-3.132-1.44C32.24 10.553 28.346 10 24 10s-8.24.552-11.016 1.419c-1.393.435-2.448.933-3.132 1.44C9.147 13.378 9 13.775 9 14s.147.621.852 1.142c.684.506 1.74 1.004 3.132 1.44C15.76 17.447 19.654 18 24 18s8.24-.552 11.016-1.419c1.393-.435 2.448-.933 3.132-1.44c.705-.52.852-.917.852-1.141m2 0c0 1.156-.748 2.074-1.663 2.75c-.934.69-2.223 1.27-3.725 1.74C32.596 19.433 28.491 20 24 20s-8.596-.567-11.612-1.51c-1.502-.47-2.79-1.05-3.725-1.74C7.748 16.074 7 15.156 7 14s.748-2.074 1.663-2.75c.935-.69 2.223-1.27 3.725-1.74C15.404 8.567 19.509 8 24 8s8.596.567 11.612 1.51c1.502.47 2.79 1.05 3.725 1.74C40.252 11.926 41 12.844 41 14"/><path fill="currentColor" d="M7 34V14h2v20c0 .343.205.843.896 1.453c.68.6 1.72 1.203 3.093 1.74C15.727 38.265 19.6 39 24 39s8.273-.735 11.01-1.807c1.373-.537 2.415-1.14 3.095-1.74c.691-.61.895-1.11.895-1.453V14h2v20c0 1.157-.67 2.157-1.572 2.953c-.914.807-2.187 1.516-3.689 2.104C32.727 40.235 28.6 41 24 41s-8.727-.765-11.74-1.943c-1.501-.588-2.773-1.297-3.688-2.104C7.67 36.157 7 35.157 7 34"/><path fill="currentColor" d="M24 22.5a1 1 0 0 1 .765.355L32 31.447l7.235-8.591l1.53 1.288l-8 9.5a1 1 0 0 1-1.53 0L24 25.053l-7.235 8.593a1 1 0 0 1-1.53 0l-8-9.5l1.53-1.29L16 31.447l7.235-8.591l.076-.08A1 1 0 0 1 24 22.5"/></svg>

Drum 48 アイコンの使い方

React

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

<Icon icon="energy-icons:drum-48" width="24" />

Vue

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

<template>
  <Icon icon="energy-icons:drum-48" width="24" />
</template>

Svelte

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

<Icon icon="energy-icons:drum-48" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[energy-icons--drum-48]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/energy-icons -->
<div class="i-energy-icons:drum-48"></div>

Web コンポーネント

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

<iconify-icon icon="energy-icons:drum-48"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/energy-icons/drum-48.svg" alt="Drum 48 アイコン" width="24" height="24">

Energy Icons の関連アイコン

Drum 48 アイコン のよくある質問

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

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

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

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

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

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

Energy Icons をすべて見る →