ICONYZ
English
Convex icon from theSVG Color

Convex icon

thesvg-color:convex

The Convex icon (thesvg-color:convex) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 128 × 132 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
128 × 132
Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="128" height="132" viewBox="0 0 128 132"><g fill="none"><path fill="#f3b01c" d="M108.092 130.021c18.166-2.018 35.293-11.698 44.723-27.854c-4.466 39.961-48.162 65.218-83.83 49.711c-3.286-1.425-6.115-3.796-8.056-6.844c-8.016-12.586-10.65-28.601-6.865-43.135c10.817 18.668 32.81 30.111 54.028 28.122"/><path fill="#8d2676" d="M53.401 90.174c-7.364 17.017-7.682 36.94 1.345 53.336c-31.77-23.902-31.423-75.052-.388-98.715c2.87-2.187 6.282-3.485 9.86-3.683c14.713-.776 29.662 4.91 40.146 15.507c-21.3.212-42.046 13.857-50.963 33.555"/><path fill="#ee342f" d="M114.637 61.855C103.89 46.87 87.069 36.668 68.639 36.358c35.625-16.17 79.446 10.047 84.217 48.807c.444 3.598-.139 7.267-1.734 10.512c-6.656 13.518-18.998 24.002-33.42 27.882c10.567-19.599 9.263-43.544-3.065-61.704"/></g></svg>

How to use the Convex icon

React

import { Icon } from "@iconify/react";

<Icon icon="thesvg-color:convex" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="thesvg-color:convex" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="thesvg-color:convex" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--convex]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:convex"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="thesvg-color:convex"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/thesvg-color/convex.svg" alt="Convex icon" width="24" height="24">

Convex icon in other icon sets

Convex icon FAQ

Is the Convex 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 Convex icon in React?

Install @iconify/react and render <Icon icon="thesvg-color:convex" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Convex icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/thesvg-color/convex.svg" alt="Convex icon">, or paste the SVG code inline to style it with CSS.

Browse all theSVG Color icons →