left speech bubble emoji
left-speech-bubble from Fluent Emoji High Contrast by Microsoft Corporation · Default · Smileys & Emotion · MIT Free for personal and commercial use.
- Name
- left-speech-bubble
- Set
- Fluent Emoji High Contrast
- Style
- Default
- Category
- Smileys & Emotion
- Viewbox
- 32×32
- License
- MIT
The same emoji in other sets
More smileys & emotion icons from Fluent Emoji High Contrast
alienalien-monsteranger-symbolangry-faceangry-face-with-hornsanguished-faceanxious-face-with-sweatastonished-facebeaming-face-with-smiling-eyesbeating-heartblack-heartblue-heartbombbroken-heartbrown-heartcat-with-tears-of-joycat-with-wry-smileclown-facecold-facecollisionconfounded-faceconfused-facecowboy-hat-facecrying-cat
Use the left speech bubble emoji
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M1.64 12.703C3.502 9.756 8.137 4 16 4s12.497 5.756 14.36 8.703a4.27 4.27 0 0 1 0 4.594c-.868 1.373-2.305 3.307-4.36 5.005v4.2a1.5 1.5 0 0 1-2.184 1.335l-4.35-2.23c-1.08.25-2.236.393-3.466.393c-7.862 0-12.497-5.756-14.36-8.703a4.27 4.27 0 0 1 0-4.594M16 6C9.21 6 5.097 10.978 3.33 13.772a2.27 2.27 0 0 0 0 2.456C5.097 19.022 9.21 24 16 24c1.2 0 2.311-.154 3.337-.422l.37-.096L24 25.683v-4.349l.384-.3c2.022-1.58 3.44-3.468 4.286-4.806a2.27 2.27 0 0 0 0-2.456C26.903 10.978 22.79 6 16 6"/></svg>
React
import type { SVGProps } from "react";
export function FluentEmojiHighContrastLeftSpeechBubble(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M1.64 12.703C3.502 9.756 8.137 4 16 4s12.497 5.756 14.36 8.703a4.27 4.27 0 0 1 0 4.594c-.868 1.373-2.305 3.307-4.36 5.005v4.2a1.5 1.5 0 0 1-2.184 1.335l-4.35-2.23c-1.08.25-2.236.393-3.466.393c-7.862 0-12.497-5.756-14.36-8.703a4.27 4.27 0 0 1 0-4.594M16 6C9.21 6 5.097 10.978 3.33 13.772a2.27 2.27 0 0 0 0 2.456C5.097 19.022 9.21 24 16 24c1.2 0 2.311-.154 3.337-.422l.37-.096L24 25.683v-4.349l.384-.3c2.022-1.58 3.44-3.468 4.286-4.806a2.27 2.27 0 0 0 0-2.456C26.903 10.978 22.79 6 16 6"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M1.64 12.703C3.502 9.756 8.137 4 16 4s12.497 5.756 14.36 8.703a4.27 4.27 0 0 1 0 4.594c-.868 1.373-2.305 3.307-4.36 5.005v4.2a1.5 1.5 0 0 1-2.184 1.335l-4.35-2.23c-1.08.25-2.236.393-3.466.393c-7.862 0-12.497-5.756-14.36-8.703a4.27 4.27 0 0 1 0-4.594M16 6C9.21 6 5.097 10.978 3.33 13.772a2.27 2.27 0 0 0 0 2.456C5.097 19.022 9.21 24 16 24c1.2 0 2.311-.154 3.337-.422l.37-.096L24 25.683v-4.349l.384-.3c2.022-1.58 3.44-3.468 4.286-4.806a2.27 2.27 0 0 0 0-2.456C26.903 10.978 22.79 6 16 6"/></svg> </template>
CSS
.icon-left-speech-bubble {
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%2032%2032%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M1.64%2012.703C3.502%209.756%208.137%204%2016%204s12.497%205.756%2014.36%208.703a4.27%204.27%200%200%201%200%204.594c-.868%201.373-2.305%203.307-4.36%205.005v4.2a1.5%201.5%200%200%201-2.184%201.335l-4.35-2.23c-1.08.25-2.236.393-3.466.393c-7.862%200-12.497-5.756-14.36-8.703a4.27%204.27%200%200%201%200-4.594M16%206C9.21%206%205.097%2010.978%203.33%2013.772a2.27%202.27%200%200%200%200%202.456C5.097%2019.022%209.21%2024%2016%2024c1.2%200%202.311-.154%203.337-.422l.37-.096L24%2025.683v-4.349l.384-.3c2.022-1.58%203.44-3.468%204.286-4.806a2.27%202.27%200%200%200%200-2.456C26.903%2010.978%2022.79%206%2016%206%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%2032%2032%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M1.64%2012.703C3.502%209.756%208.137%204%2016%204s12.497%205.756%2014.36%208.703a4.27%204.27%200%200%201%200%204.594c-.868%201.373-2.305%203.307-4.36%205.005v4.2a1.5%201.5%200%200%201-2.184%201.335l-4.35-2.23c-1.08.25-2.236.393-3.466.393c-7.862%200-12.497-5.756-14.36-8.703a4.27%204.27%200%200%201%200-4.594M16%206C9.21%206%205.097%2010.978%203.33%2013.772a2.27%202.27%200%200%200%200%202.456C5.097%2019.022%209.21%2024%2016%2024c1.2%200%202.311-.154%203.337-.422l.37-.096L24%2025.683v-4.349l.384-.3c2.022-1.58%203.44-3.468%204.286-4.806a2.27%202.27%200%200%200%200-2.456C26.903%2010.978%2022.79%206%2016%206%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent-emoji-high-contrast/left-speech-bubble.svg?color=%231a73e8&size=48
