Avenping icon
thesvg-color:avenping
The Avenping icon (thesvg-color:avenping) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 1896 × 1896 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
- 1896 × 1896
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="1896" height="1896" viewBox="0 0 1896 1896"><mask id="SVGR2gOCdJg" fill="#fff"><path d="M1012.98 221.12c104.79-30.001 218.41-20.27 315.85 27.053s170.72 128.362 203.73 225.288c33 96.926 23.03 201.801-27.74 291.552c-50.76 89.751-138.15 157.027-242.95 187.029l-124.45-365.461z"/></mask><g fill="none"><path fill="#1a687d" d="m760.477 1780.51l-201.974-557.92l673.767-244.435z"/><path fill="#008d9f" d="m1223.32 994.234l-91.9 154.556l-370.727 630.92l36.537-449.9z"/><path stroke="#00bcd4" stroke-width="178.8" d="m387.13 406.72l212.873 650.78l265.552-115.842"/><path fill="#00bcd4" stroke="#00bcd4" stroke-width="100" d="M1012.98 221.12c104.79-30.001 218.41-20.27 315.85 27.053s170.72 128.362 203.73 225.288c33 96.926 23.03 201.801-27.74 291.552c-50.76 89.751-138.15 157.027-242.95 187.029l-124.45-365.461z" mask="url(#SVGR2gOCdJg)"/><path stroke="#00bcd4" stroke-width="178.8" d="M1057.84 301.177L434.86 480.629m803.55 383.976L622.87 1057.17"/><path fill="#00bcd4" d="m505.62 526.134l-165.788 24.573l-97.158-108.556l181.858-52.217zm727.81 276.487L619.908 985.765l-133.78-448.156l613.522-183.144z"/><path fill="#00bcd4" d="m1340.5 917.578l-70.56-157.688L1029 217.004l325.91 268.439z"/><path fill="#008d9f" d="m242 442.004l215.858 57.662L546 1179L339.136 550.121z"/><path fill="#00bcd4" d="m650.049 1142.15l-4.86-15.13L544.997 1179z"/></g></svg>How to use the Avenping icon
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:avenping" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:avenping" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:avenping" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--avenping]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:avenping"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:avenping"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/thesvg-color/avenping.svg" alt="Avenping icon" width="24" height="24">Avenping icon FAQ
Is the Avenping 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 Avenping icon in React?
Install @iconify/react and render <Icon icon="thesvg-color:avenping" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Avenping icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/thesvg-color/avenping.svg" alt="Avenping icon">, or paste the SVG code inline to style it with CSS.