Genstory icon
thesvg-color:genstory
The Genstory icon (thesvg-color:genstory) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 440 × 438 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
- 440 × 438
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="440" height="438" viewBox="0 0 440 438"><defs><linearGradient id="SVG9JK7sSPy" x1="86" x2="289" y1="36" y2="420" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#7fe6dd"/><stop offset=".52" stop-color="#67b7ff"/><stop offset="1" stop-color="#9a8bff"/></linearGradient></defs><path fill-rule="evenodd" stroke="url(#SVG9JK7sSPy)" stroke-linecap="round" stroke-linejoin="round" stroke-width="8" d="M344 35c-42-18-106-23-167-14c-66 10-114 43-132 93c-18 51-2 98 45 134c33 25 73 38 107 51c29 11 47 25 49 44c2 26-23 44-62 45c-32 1-61-9-95-28l-22 45c44 23 92 33 147 29c86-6 153-47 171-117c16-61-9-111-59-146c-35-24-77-36-102-49c-15-7-18-20-7-29c26-19 78-12 119 8l23-55c-9-5-12-9-15-11m-17 48c-31-14-74-17-105-7c-35 12-51 39-40 62c10 21 36 32 73 45c55 19 93 56 95 116c2 51-26 97-73 115c-48 19-105 16-160-11l12-24c19 9 38 14 58 14c31 0 53-9 65-24c11-14 15-31 12-48c-6-31-32-47-76-64c-42-16-76-34-88-68c-14-40-5-77 27-105c51-45 135-43 215-4Z"/></svg>How to use the Genstory icon
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:genstory" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:genstory" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:genstory" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--genstory]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:genstory"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:genstory"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/thesvg-color/genstory.svg" alt="Genstory icon" width="24" height="24">Genstory icon FAQ
Is the Genstory 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 Genstory icon in React?
Install @iconify/react and render <Icon icon="thesvg-color:genstory" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Genstory icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/thesvg-color/genstory.svg" alt="Genstory icon">, or paste the SVG code inline to style it with CSS.