Skip to content

Bubble

A bubble chart is a type of data visualization.

Add shadcn.io to your AI agent. · Pro It installs Bubble, or any of 294k icons, from a prompt, with Pro.

Set up MCP

Exports at 106 × 24 px

Bubble icon from SVG Logos
Get Pro

2,063 in SVG LogosCC0 license (opens in a new tab)Free to copy and download

Code

Bubble in your framework

In any framework. Customize it above, and the code follows.

export const BubbleIcon = (props: React.SVGProps<SVGSVGElement>) => (
  <svg xmlns="http://www.w3.org/2000/svg" width="106" height="24" viewBox="0 0 512 116" {...props}>
    <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>
);

Other libraries

Bubble in 8 more libraries

Each library draws it its own way. Open one to compare.

  • Bubble icon from Material Symbols
  • Bubble icon from Material Symbols Light
  • Bubble icon from Arcticons
  • Bubble icon from Tabler Icons
  • Bubble icon from Lets Icons
  • Bubble icon from Lineicons
  • Bubble icon from IcoMoon Free
  • Bubble icon from PrestaShop Icons

SVG Logos

Icons that share its tags, in the same style.

  • Baseline icon from SVG Logos
  • Matplotlib Icon icon from SVG Logos
  • Run Above icon from SVG Logos
  • Seaborn icon from SVG Logos
  • Chartblocks icon from SVG Logos
  • Chartjs icon from SVG Logos
  • Game Analytics icon from SVG Logos
  • Datasette Icon icon from SVG Logos
  • Tableau icon from SVG Logos
  • Tableau Icon icon from SVG Logos
  • Gaugeio icon from SVG Logos
  • Google Data Studio icon from SVG Logos
  • Kibana icon from SVG Logos
  • Mida icon from SVG Logos
  • Posthog Icon icon from SVG Logos
  • Airflow icon from SVG Logos
  • Aws Quicksight icon from SVG Logos
  • Botanalytics icon from SVG Logos
  • Cloudera icon from SVG Logos
  • Dbt icon from SVG Logos
  • Dbt Icon icon from SVG Logos
  • Heap icon from SVG Logos
  • Influxdb icon from SVG Logos
  • Influxdb Icon icon from SVG Logos

Skip the copy and paste. With Pro, your AI agent finds and installs any SVG Logos icon from a prompt.

Get Pro

Tags

Browse by tag

Bubble is tagged data, analytics, visualization and 2 more. Related tags follow; each opens its icons from every library.

Pricing

SVG Logos MCP, with Pro

Ask for Bubble or any of 2,063 SVG Logos icons and your agent installs it. The MCP comes with every Pro plan, with 6,000+ blocks and 14 premium templates. The icons stay free.

4.9/5 out of 5 · 150+ reviewsfrom 150+ founders and developers.

Billed once a year in USD. Cancel anytime.

Individual

For personal projects & open source

$32instead of $49/mo

$389 billed yearly

  • How many people can use the license.Seats: 1 seat
  • Client work, SaaS products and anything you charge for.Commercial use: Personal & open source only
  • Production-ready React sections: hero, pricing, features, dashboards and more.Pro blocks: 6,000+ blocks
  • Complete multi-page sites you can ship as they are.Templates: All 14 templates
  • React icons from every major library, installable with one command.React icons: 294k+ icons
  • Presets that restyle every block, in light and dark.Themes: All 59 themes
  • Lets your AI editor search, preview and install blocks for you.MCP server: Basic usage
  • Priority requests are answered first.Support: Standard

Team

Most popular

For freelancers, agencies & startups

$66instead of $99/mo

$789 billed yearly · ≈ $13/dev/mo

Everything in Individual, plus

  • How many people can use the license.Seats: Up to 5 seats
  • Client work, SaaS products and anything you charge for.Commercial use: Included
  • Lets your AI editor search, preview and install blocks for you.MCP server: High usage
  • Priority requests are answered first.Support: Priority

Organization

For companies with larger teams

$132instead of $199/mo

$1,589 billed yearly

Everything in Team, plus

  • How many people can use the license.Seats: Unlimited seats
  • Lets your AI editor search, preview and install blocks for you.MCP server: Unlimited usage
  • Secure checkout via Stripe
  • Code lives in your repo
  • Keep what you've shipped if you cancel
  • License terms

FAQ

Frequently asked questions

What the Bubble icon means and where it's used, then how to install, style and license it.

Install Bubble from a prompt

MCP, 6,000+ blocks and 14 premium templates in every Pro plan. The icons stay free.

Get Pro