Roasted Coffee Bean icon
openmoji:roasted-coffee-bean
The Roasted Coffee Bean icon (openmoji:roasted-coffee-bean) is a free SVG icon from the OpenMoji set. It is drawn on a 72 × 72 grid. OpenMoji icons are released under the CC BY-SA 4.0 license, which allows use in personal and commercial projects as long as you credit the author and share changes to the icons under the same license. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.
- Icon set
- OpenMoji
- Author
- OpenMoji
- License
- CC-BY-SA-4.0
- Size
- 72 × 72
- Category
- Extras Openmoji
- Tags
- roastedcoffee, coffeebean, roastedcoffeebean
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="72" height="72" viewBox="0 0 72 72"><ellipse cx="36" cy="36" fill="#a57939" rx="19" ry="28"/><path fill="#6a462f" fill-rule="evenodd" d="M36.313 64c-.015 0-.02-.021-.005-.026c8.326-2.834 14.553-14.26 14.553-27.923c0-13.671-6.234-25.102-14.567-27.928c-.067-.023-.052-.123.019-.123C46.633 8 55 20.536 55 36s-8.367 28-18.687 28"/><g fill="#6a462f"><path fill-rule="evenodd" d="M36 61s-6-11.193-6-25c0-13.76 5.96-24.924 6-25c-.029.054-3 5.63-3 12.5c0 6.903 3 12.5 3 12.5s3 5.596 3 12.5S36 61 36 61"/><path d="m36 61l-.881.472a1 1 0 0 0 1.762 0zm0-50l.882.471a1 1 0 0 0-1.764-.943zm0 25l.881-.473zm-7 0c0 7.042 1.529 13.402 3.05 17.992a60 60 0 0 0 2.099 5.45a42 42 0 0 0 .895 1.886l.054.104l.014.028l.005.008v.003h.001L36 61q.881-.473.882-.472v-.001l-.003-.004l-.011-.021l-.046-.09q-.063-.12-.183-.362a41 41 0 0 1-.663-1.421a58 58 0 0 1-2.027-5.266C32.471 48.904 31 42.764 31 36zm6.118-25.472C35.055 10.648 29 21.988 29 36h2c0-13.51 5.864-24.495 5.882-24.528zM34 23.5c0-3.297.714-6.299 1.439-8.493c.723-2.19 1.447-3.544 1.443-3.536l-1.764-.942c-.052.096-3.118 5.85-3.118 12.97zM36 36q.881-.473.882-.472l-.001-.001l-.004-.009l-.109-.214c-.077-.156-.188-.39-.323-.693a29 29 0 0 1-.996-2.587C34.721 29.827 34 26.812 34 23.5h-2c0 3.59.78 6.825 1.552 9.153a31 31 0 0 0 1.066 2.77a22 22 0 0 0 .46.97l.03.056q.004.01.008.015l.002.005v.002h.001zm0 0l-.882.472h.001l.005.01l.108.213c.077.156.188.39.323.693c.27.607.633 1.492.996 2.587c.728 2.197 1.45 5.212 1.45 8.525h2c0-3.591-.78-6.826-1.552-9.154a31 31 0 0 0-1.066-2.77a22 22 0 0 0-.49-1.025l-.008-.016l-.002-.005v-.002h-.001zm2 12.5c0 3.312-.721 6.327-1.45 8.524a29 29 0 0 1-.995 2.587a20 20 0 0 1-.432.907l-.004.009l.88.473l.883.472v-.003l.003-.005l.009-.015l.029-.056l.103-.205c.087-.178.21-.435.356-.764a31 31 0 0 0 1.067-2.77C39.221 55.324 40 52.09 40 48.5z"/></g><g fill="none" stroke="#000" stroke-width="2"><ellipse cx="36" cy="36" rx="19" ry="28"/><path stroke-linecap="round" stroke-linejoin="round" d="M36 36s-3-5.596-3-12.5S36 11 36 11m0 25s3 5.596 3 12.5S36 61 36 61"/></g></svg>How to use the Roasted Coffee Bean icon
React
import { Icon } from "@iconify/react";
<Icon icon="openmoji:roasted-coffee-bean" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="openmoji:roasted-coffee-bean" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="openmoji:roasted-coffee-bean" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[openmoji--roasted-coffee-bean]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/openmoji -->
<div class="i-openmoji:roasted-coffee-bean"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="openmoji:roasted-coffee-bean"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/openmoji/roasted-coffee-bean.svg" alt="Roasted Coffee Bean icon" width="24" height="24">Related icons in OpenMoji
Roasted Coffee Bean icon FAQ
Is the Roasted Coffee Bean icon free for commercial use?
Yes. OpenMoji icons are released under the CC BY-SA 4.0 license, which allows use in personal and commercial projects as long as you credit the author and share changes to the icons under the same license.
How do I use the Roasted Coffee Bean icon in React?
Install @iconify/react and render <Icon icon="openmoji:roasted-coffee-bean" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Roasted Coffee Bean icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/openmoji/roasted-coffee-bean.svg" alt="Roasted Coffee Bean icon">, or paste the SVG code inline to style it with CSS.