Chat X icon
reicon:chat-x
The Chat X icon (reicon:chat-x) is a free SVG icon from the Reicon set. It is drawn on a 24 × 24 grid. Reicon icons are released under the MIT license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.
- Icon set
- Reicon
- Author
- REICON
- License
- MIT
- Size
- 24 × 24
- Category
- Messages
- Tags
- chatx
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="currentColor"><path d="M15.03 13.53a.75.75 0 0 1-1.06 0L12 11.56l-1.97 1.97a.75.75 0 1 1-1.06-1.06l1.97-1.97l-1.97-1.97a.75.75 0 1 1 1.06-1.06L12 9.44l1.97-1.97a.75.75 0 0 1 1.06 1.06l-1.97 1.97l1.97 1.97a.75.75 0 0 1 0 1.06"/><path fill-rule="evenodd" d="M8.367 1.25h7.266c1.092 0 1.958 0 2.655.057c.714.058 1.317.18 1.869.46a4.75 4.75 0 0 1 2.075 2.077c.281.55.403 1.154.461 1.868c.057.697.057 1.563.057 2.655v4.43c0 1.015 0 1.82-.05 2.471c-.05.665-.156 1.23-.4 1.75a4.75 4.75 0 0 1-2.282 2.282c-.52.244-1.085.35-1.75.4c-.65.05-1.456.05-2.472.05h-.03c-.486 0-.582.007-.66.029a.75.75 0 0 0-.286.155c-.06.052-.118.13-.384.536l-.486.745c-.208.318-.391.6-.56.813c-.174.22-.397.454-.713.586a1.75 1.75 0 0 1-1.354 0c-.316-.133-.54-.367-.713-.587c-.169-.213-.352-.494-.56-.812l-.486-.745c-.266-.407-.324-.484-.384-.536a.75.75 0 0 0-.287-.155c-.077-.022-.173-.029-.659-.029h-.03c-1.016 0-1.822 0-2.472-.05c-.665-.05-1.23-.156-1.75-.4A4.75 4.75 0 0 1 1.7 17.018c-.244-.52-.35-1.085-.4-1.75c-.05-.65-.05-1.456-.05-2.472V8.368c0-1.092 0-1.958.057-2.655c.058-.714.18-1.317.46-1.868a4.75 4.75 0 0 1 2.077-2.076c.55-.281 1.154-.403 1.868-.461c.697-.057 1.563-.057 2.655-.057M5.834 2.802c-.62.05-1.005.147-1.31.302a3.25 3.25 0 0 0-1.42 1.42c-.155.305-.251.69-.302 1.31c-.051.63-.052 1.434-.052 2.566v4.366c0 1.053 0 1.801.045 2.388c.044.58.128.94.263 1.226a3.25 3.25 0 0 0 1.562 1.562c.287.135.647.219 1.226.263c.587.045 1.335.045 2.388.045h.076c.367 0 .689 0 .994.086c.317.09.61.25.86.466c.239.207.415.477.614.784l.51.781c.232.355.378.577.498.73a1 1 0 0 0 .127.138a.25.25 0 0 0 .174 0a1 1 0 0 0 .127-.138c.12-.153.266-.375.498-.73l.51-.78c.2-.308.375-.578.614-.785a2.25 2.25 0 0 1 .86-.466c.305-.087.627-.086.994-.086h.076c1.053 0 1.801 0 2.388-.045c.58-.044.94-.128 1.226-.263a3.25 3.25 0 0 0 1.562-1.562c.135-.287.219-.647.263-1.226c.045-.587.045-1.335.045-2.388V8.4c0-1.132 0-1.937-.052-2.566c-.05-.62-.147-1.005-.302-1.31a3.25 3.25 0 0 0-1.42-1.42c-.305-.155-.69-.251-1.31-.302c-.63-.051-1.433-.052-2.566-.052H8.4c-1.132 0-1.937 0-2.566.052" clip-rule="evenodd"/></g></svg>
How to use the Chat X icon
React
import { Icon } from "@iconify/react";
<Icon icon="reicon:chat-x" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="reicon:chat-x" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="reicon:chat-x" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[reicon--chat-x]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/reicon -->
<div class="i-reicon:chat-x"></div>
Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="reicon:chat-x"></iconify-icon>
HTML image
<img src="https://iconyz.com/api/public/svg/reicon/chat-x.svg" alt="Chat X icon" width="24" height="24">
Chat X icon in other icon sets
Chat X icon FAQ
Is the Chat X icon free for commercial use?
Yes. Reicon icons are released under the MIT license, which allows use in personal and commercial projects.
How do I use the Chat X icon in React?
Install @iconify/react and render <Icon icon="reicon:chat-x" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Chat X icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/reicon/chat-x.svg" alt="Chat X icon">, or paste the SVG code inline to style it with CSS.
Browse all Reicon icons →
