Hoopla icon
cbi:hoopla
The Hoopla icon (cbi:hoopla) is a free SVG icon from the Custom Brand Icons set by Emanuele & rchiileea. It is drawn on a 24 × 24 grid. Custom Brand Icons use the CC BY-NC-SA 4.0 license, which does not allow commercial use without separate permission from the author. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.
- Icon set
- Custom Brand Icons
- Author
- Emanuele & rchiileea
- License
- CC-BY-NC-SA-4.0
- Size
- 24 × 24
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M8.753 11.86v-.04Zm0 .05V12Zm13.217-1.801v3.802c0 .06 0 .1-.01.12a.12.12 0 0 1-.05.05c-.02.01-.06.01-.12.01h-.791c-.06 0-.1 0-.12-.01a.12.12 0 0 1-.05-.05c-.01-.02-.01-.06-.01-.12v-.03c-.35.21-.75.33-1.16.33c-.58 0-1.141-.23-1.561-.65c-.14-.14-.26-.3-.36-.47v.81c0 .06 0 .1-.01.12a.12.12 0 0 1-.05.05c-.02.01-.06.01-.12.01h-.791c-.06 0-.1 0-.12-.01a.12.12 0 0 1-.05-.05c-.01-.02-.01-.06-.01-.12v-.81a2.21 2.21 0 0 1-1.921 1.12c-.37 0-.73-.09-1.04-.26v1.581c0 .06 0 .1-.01.12a.12.12 0 0 1-.05.05c-.02.01-.06.01-.12.01h-.791c-.06 0-.1 0-.12-.01a.12.12 0 0 1-.05-.05c-.01-.02-.01-.06-.01-.12v-1.921c-.41.38-.95.6-1.511.6s-1.14-.23-1.56-.65c-.02-.02-.04-.05-.07-.07c.4-.38.62-.941.58-1.491c0 .28.11.54.31.74a1.04 1.04 0 0 0 1.481 0a1.04 1.04 0 0 0 0-1.48a1.04 1.04 0 0 0-1.481 0c-.2.2-.31.46-.31.74c-.04.55-.24 1.061-.58 1.491c-.02.02-.04.05-.07.07c-.2.2-.451.37-.711.48c-.27.11-.55.17-.84.17s-.58-.06-.841-.17c-.27-.11-.51-.27-.71-.48c-.06-.06-.13-.13-.18-.21v.55c0 .06 0 .1-.01.12a.12.12 0 0 1-.05.05c-.02.01-.06.01-.12.01h-.79c-.061 0-.101 0-.121-.01a.12.12 0 0 1-.05-.05c-.01-.02-.01-.06-.01-.12V11.8c0-.46-.38-.841-.84-.841s-.84.381-.84.841v2.101c0 .06 0 .1-.01.12a.12.12 0 0 1-.05.05c-.02.01-.06.01-.121.01h-.79c-.06 0-.1 0-.12-.01a.12.12 0 0 1-.05-.05c-.01-.02-.01-.06-.01-.12V8.468c0-.06 0-.1.01-.12a.12.12 0 0 1 .05-.05c.02-.01.06-.01.12-.01h.79c.061 0 .101 0 .121.01s.04.03.05.05s.01.06.01.12v1.511q.39-.18.84-.18c.8 0 1.491.47 1.811 1.14c.1-.18.23-.35.37-.5c.2-.2.45-.37.71-.48c.271-.11.551-.17.841-.17s.58.06.84.17c.27.11.511.27.711.48c.02.02.04.05.07.07c-.401.38-.621.941-.581 1.491c0-.14-.03-.27-.08-.4a1 1 0 0 0-.23-.34c-.1-.1-.21-.17-.34-.23c-.13-.051-.26-.081-.4-.081s-.27.03-.4.081s-.24.13-.341.23s-.17.21-.23.34c-.05.13-.08.26-.08.4s.03.27.08.4s.13.24.23.34s.211.17.341.23c.13.051.26.081.4.081s.27-.03.4-.081s.24-.13.34-.23s.17-.21.23-.34c.05-.13.08-.26.08-.4c.04-.55.241-1.061.581-1.491c.02-.02.04-.05.07-.07c.41-.41.97-.65 1.56-.65s1.141.23 1.561.65c.11.11.21.24.3.37c.09-.13.181-.26.301-.37c.41-.41.97-.65 1.56-.65s1.141.23 1.561.65c.14.14.26.3.36.47V8.478c0-.06 0-.1.01-.12a.12.12 0 0 1 .05-.05c.02-.01.06-.01.12-.01h.791c.06 0 .1 0 .12.01s.04.03.05.05s.01.06.01.12v2.431a2.21 2.21 0 0 1 1.921-1.12c.41 0 .81.12 1.16.33v-.03c0-.06 0-.1.01-.12a.12.12 0 0 1 .05-.05c.02-.01.06-.01.121-.01h.79c.06 0 .1 0 .12.01s.04.03.05.05s.01.06.01.12Zm-6.263 1.901c0-.28-.11-.54-.31-.74a1.04 1.04 0 0 0-1.481 0a1.04 1.04 0 0 0 0 1.48a1.04 1.04 0 0 0 1.481 0c.2-.2.31-.46.31-.74m4.982 0c0-.28-.11-.54-.31-.74a1.04 1.04 0 0 0-1.481 0a1.04 1.04 0 0 0 0 1.48a1.04 1.04 0 0 0 1.481 0c.2-.2.31-.46.31-.74"/></svg>How to use the Hoopla icon
React
import { Icon } from "@iconify/react";
<Icon icon="cbi:hoopla" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="cbi:hoopla" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="cbi:hoopla" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[cbi--hoopla]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/cbi -->
<div class="i-cbi:hoopla"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="cbi:hoopla"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/cbi/hoopla.svg" alt="Hoopla icon" width="24" height="24">Hoopla icon in other icon sets
Hoopla icon FAQ
Is the Hoopla icon free for commercial use?
No. Custom Brand Icons use the CC BY-NC-SA 4.0 license, which does not allow commercial use without separate permission from the author.
How do I use the Hoopla icon in React?
Install @iconify/react and render <Icon icon="cbi:hoopla" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Hoopla icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/cbi/hoopla.svg" alt="Hoopla icon">, or paste the SVG code inline to style it with CSS.