thought balloon emoji
thought-balloon from Twitter Emoji by Twitter · Default · Smileys & Emotion · CC-BY-4.0 Attribution required.
- Name
- thought-balloon
- Set
- Twitter Emoji
- Style
- Default
- Category
- Smileys & Emotion
- Viewbox
- 36×36
- License
- CC BY 4.0
The same emoji in other sets
More smileys & emotion icons from Twitter Emoji
alienalien-monsteranger-symbolangry-faceangry-face-with-hornsanguished-faceanxious-face-with-sweatastonished-facebeaming-face-with-smiling-eyesbeating-heartblack-heartblue-heartbroken-heartbrown-heartcat-with-tears-of-joycat-with-wry-smileclown-facecold-facecollisionconfounded-faceconfused-facecowboy-hat-facecrying-catcrying-face
Use the thought balloon emoji
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><path fill="#bdddf4" d="M35 12a7 7 0 0 0-7-7c-1.167 0-2.265.29-3.232.794c-2.082-2.827-5.425-4.669-9.205-4.669c-5.132 0-9.475 3.38-10.923 8.036A6 6 0 0 0 0 15a5.996 5.996 0 0 0 5.021 5.913C5.237 24.862 8.498 28 12.5 28c2.176 0 4.13-.933 5.5-2.413A7.47 7.47 0 0 0 23.5 28c4.143 0 7.5-3.357 7.5-7.5a7.5 7.5 0 0 0-.289-2.045A7 7 0 0 0 35 12"/><circle cx="4" cy="31" r="3" fill="#bdddf4"/></svg>
React
import type { SVGProps } from "react";
export function TwemojiThoughtBalloon(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><path fill="#bdddf4" d="M35 12a7 7 0 0 0-7-7c-1.167 0-2.265.29-3.232.794c-2.082-2.827-5.425-4.669-9.205-4.669c-5.132 0-9.475 3.38-10.923 8.036A6 6 0 0 0 0 15a5.996 5.996 0 0 0 5.021 5.913C5.237 24.862 8.498 28 12.5 28c2.176 0 4.13-.933 5.5-2.413A7.47 7.47 0 0 0 23.5 28c4.143 0 7.5-3.357 7.5-7.5a7.5 7.5 0 0 0-.289-2.045A7 7 0 0 0 35 12"/><circle cx="4" cy="31" r="3" fill="#bdddf4"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><path fill="#bdddf4" d="M35 12a7 7 0 0 0-7-7c-1.167 0-2.265.29-3.232.794c-2.082-2.827-5.425-4.669-9.205-4.669c-5.132 0-9.475 3.38-10.923 8.036A6 6 0 0 0 0 15a5.996 5.996 0 0 0 5.021 5.913C5.237 24.862 8.498 28 12.5 28c2.176 0 4.13-.933 5.5-2.413A7.47 7.47 0 0 0 23.5 28c4.143 0 7.5-3.357 7.5-7.5a7.5 7.5 0 0 0-.289-2.045A7 7 0 0 0 35 12"/><circle cx="4" cy="31" r="3" fill="#bdddf4"/></svg> </template>
CSS
.icon-thought-balloon {
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%2036%2036%22%3E%3Cpath%20fill%3D%22%23bdddf4%22%20d%3D%22M35%2012a7%207%200%200%200-7-7c-1.167%200-2.265.29-3.232.794c-2.082-2.827-5.425-4.669-9.205-4.669c-5.132%200-9.475%203.38-10.923%208.036A6%206%200%200%200%200%2015a5.996%205.996%200%200%200%205.021%205.913C5.237%2024.862%208.498%2028%2012.5%2028c2.176%200%204.13-.933%205.5-2.413A7.47%207.47%200%200%200%2023.5%2028c4.143%200%207.5-3.357%207.5-7.5a7.5%207.5%200%200%200-.289-2.045A7%207%200%200%200%2035%2012%22%2F%3E%3Ccircle%20cx%3D%224%22%20cy%3D%2231%22%20r%3D%223%22%20fill%3D%22%23bdddf4%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%2036%2036%22%3E%3Cpath%20fill%3D%22%23bdddf4%22%20d%3D%22M35%2012a7%207%200%200%200-7-7c-1.167%200-2.265.29-3.232.794c-2.082-2.827-5.425-4.669-9.205-4.669c-5.132%200-9.475%203.38-10.923%208.036A6%206%200%200%200%200%2015a5.996%205.996%200%200%200%205.021%205.913C5.237%2024.862%208.498%2028%2012.5%2028c2.176%200%204.13-.933%205.5-2.413A7.47%207.47%200%200%200%2023.5%2028c4.143%200%207.5-3.357%207.5-7.5a7.5%207.5%200%200%200-.289-2.045A7%207%200%200%200%2035%2012%22%2F%3E%3Ccircle%20cx%3D%224%22%20cy%3D%2231%22%20r%3D%223%22%20fill%3D%22%23bdddf4%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/twemoji/thought-balloon.svg?color=%231a73e8&size=48
