chatbubbles icon

chatbubbles from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.

Name: chatbubbles
Set: IonIcons
Style: Regular
Viewbox: 512×512
License: MIT

2 other variants in IonIcons

Use the chatbubbles icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M60.44 389.17c0 .07 0 .2-.08.38c.03-.12.05-.25.08-.38M439.9 405.6a26.8 26.8 0 0 1-9.59-2l-56.78-20.13l-.42-.17a9.9 9.9 0 0 0-3.91-.76a10.3 10.3 0 0 0-3.62.66c-1.38.52-13.81 5.19-26.85 8.77c-7.07 1.94-31.68 8.27-51.43 8.27c-50.48 0-97.68-19.4-132.89-54.63A183.38 183.38 0 0 1 100.3 215.1a176 176 0 0 1 4.06-37.58c8.79-40.62 32.07-77.57 65.55-104A194.76 194.76 0 0 1 290.3 32c52.21 0 100.86 20 137 56.18c34.16 34.27 52.88 79.33 52.73 126.87a177.86 177.86 0 0 1-30.3 99.15l-.19.28l-.74 1c-.17.23-.34.45-.5.68l-.15.27a22 22 0 0 0-1.08 2.09l15.74 55.94a26.4 26.4 0 0 1 1.12 7.11a24 24 0 0 1-24.03 24.03"/><path fill="currentColor" d="M299.87 425.39a15.74 15.74 0 0 0-10.29-8.1c-5.78-1.53-12.52-1.27-17.67-1.65a201.78 201.78 0 0 1-128.82-58.75A199.2 199.2 0 0 1 86.4 244.16C85 234.42 85 232 85 232a16 16 0 0 0-28-10.58s-7.88 8.58-11.6 17.19a162.09 162.09 0 0 0 11 150.06C59 393 59 395 58.42 399.5c-2.73 14.11-7.51 39-10 51.91a24 24 0 0 0 8 22.92l.46.39A24.34 24.34 0 0 0 72 480a23.4 23.4 0 0 0 9-1.79l53.51-20.65a8.05 8.05 0 0 1 5.72 0c21.07 7.84 43 12 63.78 12a176 176 0 0 0 74.91-16.66c5.46-2.56 14-5.34 19-11.12a15 15 0 0 0 1.95-16.39"/></svg>

React

import type { SVGProps } from "react";

export function IonChatbubbles(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M60.44 389.17c0 .07 0 .2-.08.38c.03-.12.05-.25.08-.38M439.9 405.6a26.8 26.8 0 0 1-9.59-2l-56.78-20.13l-.42-.17a9.9 9.9 0 0 0-3.91-.76a10.3 10.3 0 0 0-3.62.66c-1.38.52-13.81 5.19-26.85 8.77c-7.07 1.94-31.68 8.27-51.43 8.27c-50.48 0-97.68-19.4-132.89-54.63A183.38 183.38 0 0 1 100.3 215.1a176 176 0 0 1 4.06-37.58c8.79-40.62 32.07-77.57 65.55-104A194.76 194.76 0 0 1 290.3 32c52.21 0 100.86 20 137 56.18c34.16 34.27 52.88 79.33 52.73 126.87a177.86 177.86 0 0 1-30.3 99.15l-.19.28l-.74 1c-.17.23-.34.45-.5.68l-.15.27a22 22 0 0 0-1.08 2.09l15.74 55.94a26.4 26.4 0 0 1 1.12 7.11a24 24 0 0 1-24.03 24.03"/><path fill="currentColor" d="M299.87 425.39a15.74 15.74 0 0 0-10.29-8.1c-5.78-1.53-12.52-1.27-17.67-1.65a201.78 201.78 0 0 1-128.82-58.75A199.2 199.2 0 0 1 86.4 244.16C85 234.42 85 232 85 232a16 16 0 0 0-28-10.58s-7.88 8.58-11.6 17.19a162.09 162.09 0 0 0 11 150.06C59 393 59 395 58.42 399.5c-2.73 14.11-7.51 39-10 51.91a24 24 0 0 0 8 22.92l.46.39A24.34 24.34 0 0 0 72 480a23.4 23.4 0 0 0 9-1.79l53.51-20.65a8.05 8.05 0 0 1 5.72 0c21.07 7.84 43 12 63.78 12a176 176 0 0 0 74.91-16.66c5.46-2.56 14-5.34 19-11.12a15 15 0 0 0 1.95-16.39"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M60.44 389.17c0 .07 0 .2-.08.38c.03-.12.05-.25.08-.38M439.9 405.6a26.8 26.8 0 0 1-9.59-2l-56.78-20.13l-.42-.17a9.9 9.9 0 0 0-3.91-.76a10.3 10.3 0 0 0-3.62.66c-1.38.52-13.81 5.19-26.85 8.77c-7.07 1.94-31.68 8.27-51.43 8.27c-50.48 0-97.68-19.4-132.89-54.63A183.38 183.38 0 0 1 100.3 215.1a176 176 0 0 1 4.06-37.58c8.79-40.62 32.07-77.57 65.55-104A194.76 194.76 0 0 1 290.3 32c52.21 0 100.86 20 137 56.18c34.16 34.27 52.88 79.33 52.73 126.87a177.86 177.86 0 0 1-30.3 99.15l-.19.28l-.74 1c-.17.23-.34.45-.5.68l-.15.27a22 22 0 0 0-1.08 2.09l15.74 55.94a26.4 26.4 0 0 1 1.12 7.11a24 24 0 0 1-24.03 24.03"/><path fill="currentColor" d="M299.87 425.39a15.74 15.74 0 0 0-10.29-8.1c-5.78-1.53-12.52-1.27-17.67-1.65a201.78 201.78 0 0 1-128.82-58.75A199.2 199.2 0 0 1 86.4 244.16C85 234.42 85 232 85 232a16 16 0 0 0-28-10.58s-7.88 8.58-11.6 17.19a162.09 162.09 0 0 0 11 150.06C59 393 59 395 58.42 399.5c-2.73 14.11-7.51 39-10 51.91a24 24 0 0 0 8 22.92l.46.39A24.34 24.34 0 0 0 72 480a23.4 23.4 0 0 0 9-1.79l53.51-20.65a8.05 8.05 0 0 1 5.72 0c21.07 7.84 43 12 63.78 12a176 176 0 0 0 74.91-16.66c5.46-2.56 14-5.34 19-11.12a15 15 0 0 0 1.95-16.39"/></svg>
</template>

CSS

.icon-chatbubbles {
  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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M60.44%20389.17c0%20.07%200%20.2-.08.38c.03-.12.05-.25.08-.38M439.9%20405.6a26.8%2026.8%200%200%201-9.59-2l-56.78-20.13l-.42-.17a9.9%209.9%200%200%200-3.91-.76a10.3%2010.3%200%200%200-3.62.66c-1.38.52-13.81%205.19-26.85%208.77c-7.07%201.94-31.68%208.27-51.43%208.27c-50.48%200-97.68-19.4-132.89-54.63A183.38%20183.38%200%200%201%20100.3%20215.1a176%20176%200%200%201%204.06-37.58c8.79-40.62%2032.07-77.57%2065.55-104A194.76%20194.76%200%200%201%20290.3%2032c52.21%200%20100.86%2020%20137%2056.18c34.16%2034.27%2052.88%2079.33%2052.73%20126.87a177.86%20177.86%200%200%201-30.3%2099.15l-.19.28l-.74%201c-.17.23-.34.45-.5.68l-.15.27a22%2022%200%200%200-1.08%202.09l15.74%2055.94a26.4%2026.4%200%200%201%201.12%207.11a24%2024%200%200%201-24.03%2024.03%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M299.87%20425.39a15.74%2015.74%200%200%200-10.29-8.1c-5.78-1.53-12.52-1.27-17.67-1.65a201.78%20201.78%200%200%201-128.82-58.75A199.2%20199.2%200%200%201%2086.4%20244.16C85%20234.42%2085%20232%2085%20232a16%2016%200%200%200-28-10.58s-7.88%208.58-11.6%2017.19a162.09%20162.09%200%200%200%2011%20150.06C59%20393%2059%20395%2058.42%20399.5c-2.73%2014.11-7.51%2039-10%2051.91a24%2024%200%200%200%208%2022.92l.46.39A24.34%2024.34%200%200%200%2072%20480a23.4%2023.4%200%200%200%209-1.79l53.51-20.65a8.05%208.05%200%200%201%205.72%200c21.07%207.84%2043%2012%2063.78%2012a176%20176%200%200%200%2074.91-16.66c5.46-2.56%2014-5.34%2019-11.12a15%2015%200%200%200%201.95-16.39%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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M60.44%20389.17c0%20.07%200%20.2-.08.38c.03-.12.05-.25.08-.38M439.9%20405.6a26.8%2026.8%200%200%201-9.59-2l-56.78-20.13l-.42-.17a9.9%209.9%200%200%200-3.91-.76a10.3%2010.3%200%200%200-3.62.66c-1.38.52-13.81%205.19-26.85%208.77c-7.07%201.94-31.68%208.27-51.43%208.27c-50.48%200-97.68-19.4-132.89-54.63A183.38%20183.38%200%200%201%20100.3%20215.1a176%20176%200%200%201%204.06-37.58c8.79-40.62%2032.07-77.57%2065.55-104A194.76%20194.76%200%200%201%20290.3%2032c52.21%200%20100.86%2020%20137%2056.18c34.16%2034.27%2052.88%2079.33%2052.73%20126.87a177.86%20177.86%200%200%201-30.3%2099.15l-.19.28l-.74%201c-.17.23-.34.45-.5.68l-.15.27a22%2022%200%200%200-1.08%202.09l15.74%2055.94a26.4%2026.4%200%200%201%201.12%207.11a24%2024%200%200%201-24.03%2024.03%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M299.87%20425.39a15.74%2015.74%200%200%200-10.29-8.1c-5.78-1.53-12.52-1.27-17.67-1.65a201.78%20201.78%200%200%201-128.82-58.75A199.2%20199.2%200%200%201%2086.4%20244.16C85%20234.42%2085%20232%2085%20232a16%2016%200%200%200-28-10.58s-7.88%208.58-11.6%2017.19a162.09%20162.09%200%200%200%2011%20150.06C59%20393%2059%20395%2058.42%20399.5c-2.73%2014.11-7.51%2039-10%2051.91a24%2024%200%200%200%208%2022.92l.46.39A24.34%2024.34%200%200%200%2072%20480a23.4%2023.4%200%200%200%209-1.79l53.51-20.65a8.05%208.05%200%200%201%205.72%200c21.07%207.84%2043%2012%2063.78%2012a176%20176%200%200%200%2074.91-16.66c5.46-2.56%2014-5.34%2019-11.12a15%2015%200%200%200%201.95-16.39%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/chatbubbles.svg?color=%231a73e8&size=48