Hamburger アイコン

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

はい。OpenMoji icons は CC BY-SA 4.0 ライセンス で公開されています。作者のクレジットを表記し、アイコンへの変更を同じライセンスで共有すれば、個人・商用プロジェクトで利用できます。

openmoji:hamburger

Hamburger アイコン(openmoji:hamburger)は、OpenMoji セットの無料 SVG アイコンです。 72 × 72 のグリッドで描かれています。 OpenMoji icons は CC BY-SA 4.0 ライセンスで公開されています。作者のクレジットを表記し、アイコンへの変更を同じライセンスで共有すれば、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット: OpenMoji
作者: OpenMoji
ライセンス: CC-BY-SA-4.0
サイズ: 72 × 72
カテゴリ: 飲食

SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="72" height="72" viewBox="0 0 72 72"><path fill="#a57939" d="m57.6 48.95l-41.6.347c-1.104.01-2-.895-2-2v-6.75a2 2 0 0 1 2-2l41.89.607z"/><path fill="#f4aa41" d="M32.88 49.47H15c-1.104 0-2 .701-2 1.566v4.699c0 .865.896 1.566 2 1.566h42c1.104 0 2-.701 2-1.566v-4.699c0-.865-.895-1.566-2-1.566H39.21"/><path fill="#e27022" d="M48 49.3h9c1.104 0 2 .717 2 1.601v4.803c0 .884-.895 1.601-2 1.601h-9z"/><path fill="#f4aa41" d="M59 27.53c0 .724-.895 1.312-2 1.312H15c-1.104 0-2-.587-2-1.312c1.484-7.465 11.21-13.23 23-13.23s21.52 5.765 23 13.23"/><path fill="#e27022" d="M42 15.14c3.074 3.299 5.156 7.823 6 13.67h9c1.104 0 2-.574 2-1.281c-1.5-7.201-10.66-11.53-17-12.39z"/><path fill="#fcea2b" d="M43.69 37.853H27.26l8.215 8.215z"/><path fill="#6a462f" d="M48 38.48V49.3h8a2 2 0 0 0 2-2v-6.75a2 2 0 0 0-2-2h-6.666"/><path fill="#ea5a47" fill-rule="evenodd" stroke="#ea5a47" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16.33 31.2h39.35v2.093H16.33z" paint-order="stroke fill markers"/><path fill="#d22f27" fill-rule="evenodd" stroke="#d22f27" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M49.04 31.2h6.661v2.126H49.04z" paint-order="stroke fill markers"/><path fill="#b1cc33" stroke="#b1cc33" stroke-linejoin="round" stroke-width="2" d="m15.89 37.09l40.58-.383c2.212-.485 2.519-1.02 2.732-2.267c-1.861 1.266-3.301 1.278-4.582 1.438c-2.319-.011-4.462.025-5.933-1.85l-5.997-.446l-4.338 1.914l-4.338-.064l-4.785-1.66l-5.104-.254c-1.222 1.475-3.522 1.902-4.913 2.36c-2.134-.392-4.418.809-6.398-1.437c.49 1.538.499 1.973 3.08 2.65z"/><path fill="#5c9e31" stroke="#5c9e31" stroke-linejoin="round" stroke-width="2" d="m49.02 37.84l7.438-1.134c2.212-.485 2.519-1.021 2.732-2.267c-1.861 1.266-3.301 1.278-4.582 1.438c-2.319-.011-2.088-.02-4.079-1.018l-1.509-.873z"/><path fill="#d22f27" fill-rule="evenodd" stroke="#d22f27" stroke-linecap="round" stroke-width="2" d="M49.04 31.2h4.185v2.126H49.04z" paint-order="stroke fill markers"/><g fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2"><path d="M32.88 49.3H16a2 2 0 0 1-2-2v-6.75a2 2 0 0 1 2-2h40a2 2 0 0 1 2 2v6.75a2 2 0 0 1-2 2H39.21zm0 .17H15c-1.104 0-2 .701-2 1.566v4.699c0 .865.896 1.566 2 1.566h42c1.104 0 2-.701 2-1.566v-4.699c0-.865-.895-1.566-2-1.566H39.21zM59 27.93c0 .724-.895 1.312-2 1.312H15c-1.104 0-2-.587-2-1.312c1.484-7.465 11.21-13.23 23-13.23s21.52 5.765 23 13.23"/><path d="M43.24 38.93H28.76l7.242 7.164z"/><path d="M59.19 34.1c-.762.396-1.358.82-2.487 1.002c-1.368.359-3.178.22-4.602 0c-1.928-.311-2.302-1.326-4.602-1.708a16.2 16.2 0 0 0-4.602 0c-2.299.382-2.673 1.396-4.602 1.708c-1.424.22-3.178.22-4.602 0c-1.928-.311-2.302-1.326-4.602-1.708a16.2 16.2 0 0 0-4.602 0c-2.299.382-2.673 1.396-4.602 1.708c-1.424.22-3.178.22-4.602 0c-1.129-.182-1.725-.606-2.487-1.002" paint-order="stroke fill markers"/></g></svg>

Hamburger アイコンの使い方

React

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

<Icon icon="openmoji:hamburger" width="24" />

Vue

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

<template>
  <Icon icon="openmoji:hamburger" width="24" />
</template>

Svelte

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

<Icon icon="openmoji:hamburger" width="24" />

Tailwind CSS

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

UnoCSS

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

Web コンポーネント

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

<iconify-icon icon="openmoji:hamburger"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/openmoji/hamburger.svg" alt="Hamburger アイコン" width="24" height="24">

OpenMoji の関連アイコン

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

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

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

はい。OpenMoji icons は CC BY-SA 4.0 ライセンスで公開されています。作者のクレジットを表記し、アイコンへの変更を同じライセンスで共有すれば、個人・商用プロジェクトで利用できます。

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

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

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

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

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