balloon icon

balloon-16-regular from Fluent UI System Icons by Microsoft Corporation · 16 Regular · MIT Free for personal and commercial use.

Name
balloon-16-regular
Set
Fluent UI System Icons
Style
16 Regular
Viewbox
16×16
License
MIT

7 other variants in Fluent UI System Icons

balloon-12-filledballoon-12-regularballoon-16-filledballoon-20-filledballoon-20-regularballoon-24-filledballoon-24-regular

The same icon in other sets

balloonBootstrap IconsballoonBoxIcons v2 SolidballoonEmoji One (Colored)balloonFluent EmojiballoonFluent Emoji FlatballoonFluent Emoji High ContrastballoonFirefox OS EmojiballoonHuge IconsballoonIonIconsballoonLucideballoonMaterial Design IconsballoonNoto EmojiballoonOpenMojiballoonPhosphorballoonPixelarticonsballoon-boldSolarballoonStreamline EmojisballoonTabler IconsballoonTwitter Emoji

Use the balloon icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M7.5 3.5A.5.5 0 0 1 8 3c.663 0 1.283.326 1.729.771c.445.446.771 1.066.771 1.729a.5.5 0 0 1-1 0c0-.337-.174-.717-.479-1.021C8.717 4.174 8.337 4 8 4a.5.5 0 0 1-.5-.5m1 7.458c1.016-.172 1.949-.847 2.64-1.714c.812-1.016 1.36-2.374 1.36-3.744C12.5 3.266 10.816 1 8 1S3.5 3.266 3.5 5.5c0 1.37.548 2.728 1.36 3.744c.691.867 1.624 1.542 2.64 1.714V11a2 2 0 0 0 2 2H11a1 1 0 0 1 1 1v.5a.5.5 0 0 0 1 0V14a2 2 0 0 0-2-2H9.5a1 1 0 0 1-1-1zM8 2c2.184 0 3.5 1.734 3.5 3.5c0 1.115-.452 2.257-1.14 3.12C9.662 9.492 8.792 10 8 10s-1.663-.508-2.36-1.38C4.953 7.757 4.5 6.615 4.5 5.5C4.5 3.734 5.816 2 8 2"/></svg>

React

import type { SVGProps } from "react";

export function FluentBalloon16Regular(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M7.5 3.5A.5.5 0 0 1 8 3c.663 0 1.283.326 1.729.771c.445.446.771 1.066.771 1.729a.5.5 0 0 1-1 0c0-.337-.174-.717-.479-1.021C8.717 4.174 8.337 4 8 4a.5.5 0 0 1-.5-.5m1 7.458c1.016-.172 1.949-.847 2.64-1.714c.812-1.016 1.36-2.374 1.36-3.744C12.5 3.266 10.816 1 8 1S3.5 3.266 3.5 5.5c0 1.37.548 2.728 1.36 3.744c.691.867 1.624 1.542 2.64 1.714V11a2 2 0 0 0 2 2H11a1 1 0 0 1 1 1v.5a.5.5 0 0 0 1 0V14a2 2 0 0 0-2-2H9.5a1 1 0 0 1-1-1zM8 2c2.184 0 3.5 1.734 3.5 3.5c0 1.115-.452 2.257-1.14 3.12C9.662 9.492 8.792 10 8 10s-1.663-.508-2.36-1.38C4.953 7.757 4.5 6.615 4.5 5.5C4.5 3.734 5.816 2 8 2"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M7.5 3.5A.5.5 0 0 1 8 3c.663 0 1.283.326 1.729.771c.445.446.771 1.066.771 1.729a.5.5 0 0 1-1 0c0-.337-.174-.717-.479-1.021C8.717 4.174 8.337 4 8 4a.5.5 0 0 1-.5-.5m1 7.458c1.016-.172 1.949-.847 2.64-1.714c.812-1.016 1.36-2.374 1.36-3.744C12.5 3.266 10.816 1 8 1S3.5 3.266 3.5 5.5c0 1.37.548 2.728 1.36 3.744c.691.867 1.624 1.542 2.64 1.714V11a2 2 0 0 0 2 2H11a1 1 0 0 1 1 1v.5a.5.5 0 0 0 1 0V14a2 2 0 0 0-2-2H9.5a1 1 0 0 1-1-1zM8 2c2.184 0 3.5 1.734 3.5 3.5c0 1.115-.452 2.257-1.14 3.12C9.662 9.492 8.792 10 8 10s-1.663-.508-2.36-1.38C4.953 7.757 4.5 6.615 4.5 5.5C4.5 3.734 5.816 2 8 2"/></svg>
</template>

CSS

.icon-balloon-16-regular {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M7.5%203.5A.5.5%200%200%201%208%203c.663%200%201.283.326%201.729.771c.445.446.771%201.066.771%201.729a.5.5%200%200%201-1%200c0-.337-.174-.717-.479-1.021C8.717%204.174%208.337%204%208%204a.5.5%200%200%201-.5-.5m1%207.458c1.016-.172%201.949-.847%202.64-1.714c.812-1.016%201.36-2.374%201.36-3.744C12.5%203.266%2010.816%201%208%201S3.5%203.266%203.5%205.5c0%201.37.548%202.728%201.36%203.744c.691.867%201.624%201.542%202.64%201.714V11a2%202%200%200%200%202%202H11a1%201%200%200%201%201%201v.5a.5.5%200%200%200%201%200V14a2%202%200%200%200-2-2H9.5a1%201%200%200%201-1-1zM8%202c2.184%200%203.5%201.734%203.5%203.5c0%201.115-.452%202.257-1.14%203.12C9.662%209.492%208.792%2010%208%2010s-1.663-.508-2.36-1.38C4.953%207.757%204.5%206.615%204.5%205.5C4.5%203.734%205.816%202%208%202%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M7.5%203.5A.5.5%200%200%201%208%203c.663%200%201.283.326%201.729.771c.445.446.771%201.066.771%201.729a.5.5%200%200%201-1%200c0-.337-.174-.717-.479-1.021C8.717%204.174%208.337%204%208%204a.5.5%200%200%201-.5-.5m1%207.458c1.016-.172%201.949-.847%202.64-1.714c.812-1.016%201.36-2.374%201.36-3.744C12.5%203.266%2010.816%201%208%201S3.5%203.266%203.5%205.5c0%201.37.548%202.728%201.36%203.744c.691.867%201.624%201.542%202.64%201.714V11a2%202%200%200%200%202%202H11a1%201%200%200%201%201%201v.5a.5.5%200%200%200%201%200V14a2%202%200%200%200-2-2H9.5a1%201%200%200%201-1-1zM8%202c2.184%200%203.5%201.734%203.5%203.5c0%201.115-.452%202.257-1.14%203.12C9.662%209.492%208.792%2010%208%2010s-1.663-.508-2.36-1.38C4.953%207.757%204.5%206.615%204.5%205.5C4.5%203.734%205.816%202%208%202%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/balloon-16-regular.svg?color=%231a73e8&size=48