chatbubble ellipses icon
chatbubble-ellipses from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.
- Name
- chatbubble-ellipses
- Set
- IonIcons
- Style
- Regular
- Viewbox
- 512×512
- License
- MIT
- Aliases
- chatbubble-ellipses-filled
2 other variants in IonIcons
Related icons in IonIcons
Use the chatbubble ellipses icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M398 81.84A227.4 227.4 0 0 0 255.82 32C194.9 32 138 55.47 95.46 98.09C54.35 139.33 31.82 193.78 32 251.37a215.66 215.66 0 0 0 35.65 118.76l.19.27c.28.41.57.82.86 1.22s.65.92.73 1.05l.22.4c1.13 2 2 4.44 1.23 6.9l-18.42 66.66a29 29 0 0 0-1.2 7.63A25.69 25.69 0 0 0 76.83 480a29.4 29.4 0 0 0 10.45-2.29l67.49-24.36l.85-.33a14.75 14.75 0 0 1 5.8-1.15a15.1 15.1 0 0 1 5.37 1c1.62.63 16.33 6.26 31.85 10.6c12.9 3.6 39.74 9 60.77 9c59.65 0 115.35-23.1 156.83-65.06C457.36 365.77 480 310.42 480 251.49a213.5 213.5 0 0 0-4.78-45c-10.34-48.62-37.76-92.9-77.22-124.65M160 288a32 32 0 1 1 32-32a32 32 0 0 1-32 32m96 0a32 32 0 1 1 32-32a32 32 0 0 1-32 32m96 0a32 32 0 1 1 32-32a32 32 0 0 1-32 32"/></svg>
React
import type { SVGProps } from "react";
export function IonChatbubbleEllipses(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="M398 81.84A227.4 227.4 0 0 0 255.82 32C194.9 32 138 55.47 95.46 98.09C54.35 139.33 31.82 193.78 32 251.37a215.66 215.66 0 0 0 35.65 118.76l.19.27c.28.41.57.82.86 1.22s.65.92.73 1.05l.22.4c1.13 2 2 4.44 1.23 6.9l-18.42 66.66a29 29 0 0 0-1.2 7.63A25.69 25.69 0 0 0 76.83 480a29.4 29.4 0 0 0 10.45-2.29l67.49-24.36l.85-.33a14.75 14.75 0 0 1 5.8-1.15a15.1 15.1 0 0 1 5.37 1c1.62.63 16.33 6.26 31.85 10.6c12.9 3.6 39.74 9 60.77 9c59.65 0 115.35-23.1 156.83-65.06C457.36 365.77 480 310.42 480 251.49a213.5 213.5 0 0 0-4.78-45c-10.34-48.62-37.76-92.9-77.22-124.65M160 288a32 32 0 1 1 32-32a32 32 0 0 1-32 32m96 0a32 32 0 1 1 32-32a32 32 0 0 1-32 32m96 0a32 32 0 1 1 32-32a32 32 0 0 1-32 32"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M398 81.84A227.4 227.4 0 0 0 255.82 32C194.9 32 138 55.47 95.46 98.09C54.35 139.33 31.82 193.78 32 251.37a215.66 215.66 0 0 0 35.65 118.76l.19.27c.28.41.57.82.86 1.22s.65.92.73 1.05l.22.4c1.13 2 2 4.44 1.23 6.9l-18.42 66.66a29 29 0 0 0-1.2 7.63A25.69 25.69 0 0 0 76.83 480a29.4 29.4 0 0 0 10.45-2.29l67.49-24.36l.85-.33a14.75 14.75 0 0 1 5.8-1.15a15.1 15.1 0 0 1 5.37 1c1.62.63 16.33 6.26 31.85 10.6c12.9 3.6 39.74 9 60.77 9c59.65 0 115.35-23.1 156.83-65.06C457.36 365.77 480 310.42 480 251.49a213.5 213.5 0 0 0-4.78-45c-10.34-48.62-37.76-92.9-77.22-124.65M160 288a32 32 0 1 1 32-32a32 32 0 0 1-32 32m96 0a32 32 0 1 1 32-32a32 32 0 0 1-32 32m96 0a32 32 0 1 1 32-32a32 32 0 0 1-32 32"/></svg> </template>
CSS
.icon-chatbubble-ellipses {
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%22M398%2081.84A227.4%20227.4%200%200%200%20255.82%2032C194.9%2032%20138%2055.47%2095.46%2098.09C54.35%20139.33%2031.82%20193.78%2032%20251.37a215.66%20215.66%200%200%200%2035.65%20118.76l.19.27c.28.41.57.82.86%201.22s.65.92.73%201.05l.22.4c1.13%202%202%204.44%201.23%206.9l-18.42%2066.66a29%2029%200%200%200-1.2%207.63A25.69%2025.69%200%200%200%2076.83%20480a29.4%2029.4%200%200%200%2010.45-2.29l67.49-24.36l.85-.33a14.75%2014.75%200%200%201%205.8-1.15a15.1%2015.1%200%200%201%205.37%201c1.62.63%2016.33%206.26%2031.85%2010.6c12.9%203.6%2039.74%209%2060.77%209c59.65%200%20115.35-23.1%20156.83-65.06C457.36%20365.77%20480%20310.42%20480%20251.49a213.5%20213.5%200%200%200-4.78-45c-10.34-48.62-37.76-92.9-77.22-124.65M160%20288a32%2032%200%201%201%2032-32a32%2032%200%200%201-32%2032m96%200a32%2032%200%201%201%2032-32a32%2032%200%200%201-32%2032m96%200a32%2032%200%201%201%2032-32a32%2032%200%200%201-32%2032%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%22M398%2081.84A227.4%20227.4%200%200%200%20255.82%2032C194.9%2032%20138%2055.47%2095.46%2098.09C54.35%20139.33%2031.82%20193.78%2032%20251.37a215.66%20215.66%200%200%200%2035.65%20118.76l.19.27c.28.41.57.82.86%201.22s.65.92.73%201.05l.22.4c1.13%202%202%204.44%201.23%206.9l-18.42%2066.66a29%2029%200%200%200-1.2%207.63A25.69%2025.69%200%200%200%2076.83%20480a29.4%2029.4%200%200%200%2010.45-2.29l67.49-24.36l.85-.33a14.75%2014.75%200%200%201%205.8-1.15a15.1%2015.1%200%200%201%205.37%201c1.62.63%2016.33%206.26%2031.85%2010.6c12.9%203.6%2039.74%209%2060.77%209c59.65%200%20115.35-23.1%20156.83-65.06C457.36%20365.77%20480%20310.42%20480%20251.49a213.5%20213.5%200%200%200-4.78-45c-10.34-48.62-37.76-92.9-77.22-124.65M160%20288a32%2032%200%201%201%2032-32a32%2032%200%200%201-32%2032m96%200a32%2032%200%201%201%2032-32a32%2032%200%200%201-32%2032m96%200a32%2032%200%201%201%2032-32a32%2032%200%200%201-32%2032%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/chatbubble-ellipses.svg?color=%231a73e8&size=48
