Xstate Light icon
thesvg-color:xstate-light
The Xstate Light icon (thesvg-color:xstate-light) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 800 × 405 grid. theSVG Color 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
- theSVG Color
- Author
- thesvg.org
- License
- MIT
- Size
- 800 × 405
- Tags
- xstatelight
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="800" height="405" viewBox="0 0 800 405"><path fill-rule="evenodd" d="M342.953 156.14c20.78 0 33.34 8.767 35.358 24.687l.061.48H366.49l-.074-.333c-2.34-10.754-9.356-15.342-23.463-15.342c-12.799 0-20.752 5.323-20.752 13.889c0 8.456 3.477 12.681 24.072 15.378c21.535 2.94 34.883 8.334 34.883 26.096c0 15.089-15.264 26.467-35.5 26.467c-29.518 0-37.608-15.437-39.196-28.39l-.059-.478h12.76l.054.363c1.47 9.876 5.691 19.016 26.438 19.016c13.178 0 22.74-6.83 22.74-16.239c0-10.026-5.659-13.879-24.218-16.485c-17.819-2.376-34.307-7.016-34.307-24.738c0-14.122 13.914-24.371 33.085-24.371m122.576 1.11v11.316h-29.547v77.787H422.79v-77.787h-29.547V157.25zm52.908 0l34.709 89.103h-13.108l-9.947-25.427h-41.344l-9.8 25.427h-12.549l35.283-89.104zm108.826 0v11.316h-29.547v77.787h-13.188v-77.784H554.98v-11.317h72.282zm81.737 0v11.316h-49.311v27.44h25.027v11.195h-25.027v27.832H709v11.317h-62.5v-89.1zm-199.51 10.462l-16.154 42.994h32.306zM99.363 113l33.464.272a10.62 10.62 0 0 1 8.304 4.108l119.56 154.056c2.71 3.488.22 8.564-4.192 8.564h-35.035c-3.31 0-6.432-1.543-8.44-4.172l-33.345-45.635l-36.905 45.777a10.62 10.62 0 0 1-8.33 4.03H99.32c-4.437 0-6.917-5.122-4.165-8.603l58.543-74.144l-58.595-75.718c-2.68-3.51-.154-8.569 4.263-8.532zm157.091 0c4.46-.034 6.973 5.108 4.207 8.603l-52.239 66.006c-3.726-2.932-32.644-27.14-4.745-59.556c0 0 2.183-2.554 4.435-5.195l.436-.511l.435-.51a676 676 0 0 0 3.842-4.533c2.759-3.339 5.03-4.005 8.247-4.03z"/></svg>How to use the Xstate Light icon
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:xstate-light" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:xstate-light" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:xstate-light" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--xstate-light]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:xstate-light"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:xstate-light"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/thesvg-color/xstate-light.svg" alt="Xstate Light icon" width="24" height="24">Related icons in theSVG Color
Xstate Light icon FAQ
Is the Xstate Light icon free for commercial use?
Yes. theSVG Color icons are released under the MIT license, which allows use in personal and commercial projects.
How do I use the Xstate Light icon in React?
Install @iconify/react and render <Icon icon="thesvg-color:xstate-light" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Xstate Light icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/thesvg-color/xstate-light.svg" alt="Xstate Light icon">, or paste the SVG code inline to style it with CSS.