Bubble icon
logos:bubble
The Bubble icon (logos:bubble) is a free SVG icon from the SVG Logos set by Gil Barbara. It is drawn on a 512 × 116 grid. SVG Logos icons are released under the CC0 license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.
- Icon set
- SVG Logos
- Author
- Gil Barbara
- License
- CC0-1.0
- Size
- 512 × 116
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="116" viewBox="0 0 512 116"><path fill="#262626" d="M221.214 0v43.295c7.826-8.78 18.078-13.245 28.48-13.245c23.663 0 41.72 19.183 41.72 42.846s-19.182 42.845-42.844 42.845c-23.427 0-42.461-18.801-42.84-42.137l-.006-.708V0zm95.962 0v43.295c7.827-8.78 18.08-13.245 28.48-13.245c23.663 0 41.722 19.183 41.722 42.846s-19.183 42.845-42.845 42.845c-23.427 0-42.461-18.801-42.84-42.137l-.005-.708V0zM135.185 32.374V80.25c0 12.233 7.098 20.086 19.03 20.086c12.081 0 19.029-7.551 19.029-20.086V32.374h16.763V80.4c0 22.201-13.44 35.34-35.793 35.34c-21.748 0-35.642-13.592-35.642-35.34V32.374zM37.345 0v43.295c7.826-8.78 18.078-13.245 28.48-13.245c23.662 0 41.72 19.183 41.72 42.846S88.364 115.74 64.702 115.74c-23.427 0-42.462-18.801-42.84-42.137l-.006-.708V0zm434.784 30.41c11.63 0 21.295 3.625 28.695 11.025S512 58.803 512 71.49q0 .34-.005.694l-.008.476l-.006.243l-.016.494a55 55 0 0 1-.569 6.099h-63.582c2.417 12.686 11.327 21.294 27.034 21.294c9.212 0 20.388-3.473 27.638-8.76l6.947 12.234c-8.307 6.192-21.445 11.327-35.19 11.327c-30.507 0-43.646-21.295-43.646-42.74c0-12.234 3.776-22.353 11.478-30.357c7.702-8.005 17.822-12.082 30.054-12.082M417.355 0v113.777h-16.613V0zM248.57 46.552c-14.55 0-26.343 11.794-26.343 26.343s11.794 26.343 26.343 26.343s26.343-11.794 26.343-26.343s-11.794-26.343-26.343-26.343m95.963 0c-14.55 0-26.343 11.794-26.343 26.343s11.794 26.343 26.343 26.343s26.343-11.794 26.343-26.343s-11.795-26.343-26.343-26.343m-279.832 0c-14.55 0-26.344 11.794-26.344 26.343s11.795 26.343 26.344 26.343c14.548 0 26.343-11.794 26.343-26.343S79.249 46.552 64.7 46.552m407.428-1.794c-12.535 0-21.899 8.458-24.315 21.144h47.422c-1.359-12.837-10.873-21.144-23.107-21.144"/><path fill="#00f" d="M10.595 94.55C4.743 94.55 0 99.294 0 105.145s4.743 10.595 10.595 10.595c5.851 0 10.595-4.743 10.595-10.595c0-5.85-4.744-10.595-10.595-10.595"/></svg>How to use the Bubble icon
React
import { Icon } from "@iconify/react";
<Icon icon="logos:bubble" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="logos:bubble" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="logos:bubble" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[logos--bubble]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/logos -->
<div class="i-logos:bubble"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="logos:bubble"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/logos/bubble.svg" alt="Bubble icon" width="24" height="24">Related icons in SVG Logos
Bubble icon in other icon sets
Bubble icon FAQ
Is the Bubble icon free for commercial use?
Yes. SVG Logos icons are released under the CC0 license, which allows use in personal and commercial projects.
How do I use the Bubble icon in React?
Install @iconify/react and render <Icon icon="logos:bubble" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Bubble icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/logos/bubble.svg" alt="Bubble icon">, or paste the SVG code inline to style it with CSS.