chat bubble left icon

Common uses

• Displaying incoming chat messages
• Indicating a user's reply in a thread
• Representing a comment section

Use it in React

npm i @heroicons/react

import { ChatBubbleLeftIcon } from '@heroicons/react/24/outline';

<ChatBubbleLeftIcon className="size-6" />

Styles

Heroicons ships this icon in 4 styles — each its own import:

<ChatBubbleLeftIcon className="size-6" />

<ChatBubbleLeftIcon className="size-6" />

<ChatBubbleLeftIcon className="size-6" />

<ChatBubbleLeftIcon className="size-6" />

Details

Library

Heroicons (324 icons)

License

MIT

viewBox

0 0 24 24

Keywords

chatbubbleleftspeech bubblemessage iconcomment icondialogue

FAQ

What is this icon for?

This icon represents a chat bubble pointing left, typically used for incoming messages or replies in communication interfaces.

How do I use this in React?

Import it from Heroicons like this: `import { ChatBubbleLeftIcon } from '@heroicons/react/24/outline'`. Then use it as a React component: `<ChatBubbleLeftIcon className="h-6 w-6" />`.

What is the license for this icon?

The Heroicons chat bubble left icon is available under the MIT license.

Related icons

The same idea in other libraries, and near matches in Heroicons.