Workbuddy icon

thesvg-color:workbuddy

The Workbuddy icon (thesvg-color:workbuddy) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 280 × 280 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: 280 × 280

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="280" height="280" viewBox="0 0 280 280"><g fill="none"><g clip-path="url(#SVGlmbeLd1A)"><rect width="280" height="280" fill="url(#SVGA1Npkd1r)" rx="60.421"/><g filter="url(#SVG1OG3AbNG)"><circle cx="88.25" cy="244.86" r="98.567" fill="#32e6b9" fill-opacity=".4"/></g><g filter="url(#SVG2jOUydHg)"><circle cx="223.384" cy="290.328" r="90.093" fill="#ffe355" fill-opacity=".49"/></g><path fill="url(#SVGYRtF9d8a)" fill-rule="evenodd" d="M204.15 6.894c2.746-2.463 2.911-2.558 4.924-2.679c3.262-.238 6.25 1.327 11.336 5.958c11.881 10.796 28.424 32.992 38.709 51.948l3.974 7.356l5.614 2.79c5.419 2.739 14.308 8.353 18.021 11.364c1.679 1.388 1.914 1.417 3.66.738c7.879-3.068 19.165.999 29.12 10.549c8.962 8.589 17.544 23.263 20.832 35.511c.48 1.971 1.118 6.209 1.35 9.365c.75 11.082-2.804 19.932-9.648 23.939c-1.398.807-1.491 1.026-1.452 4.512c.315 16.596-4.158 33.161-13.145 49.316c-10.144 18.139-28.207 36.903-52.654 54.581c-13.128 9.553-44.187 27.65-58.23 34.003c-33.641 15.145-60.609 20.955-84.034 18.085c-13.973-1.693-29.787-7.147-39.145-13.478c-2.464-1.703-2.853-1.808-4.736-1.269c-10.017 2.877-23.137-3.036-34.283-15.408c-4.446-4.946-11.62-17.089-13.946-23.587c-5.38-15.207-4.31-28.93 2.856-37.125c1.851-2.111 1.91-2.2 1.506-5.749c-.668-5.81-.971-14.408-.666-19.958l.241-5.184l-7.783-13.766c-12.052-21.444-19.706-39.451-22.66-53.209c-1.559-7.543-1.462-10.89.453-13.366c1.165-1.496 4.988-3.044 9.596-3.895c11.6-2.037 36.9-.193 65.046 4.776l2.924.505l6.424-5.683c10.665-9.448 17.751-14.745 30.814-22.89c13.615-8.519 28.98-15.526 46.284-21.075l5.552-1.779l3.05-8.013c10.927-28.844 22.118-50.11 30.096-57.183m-91.525 147.808c-12.35 7.13-18.525 10.695-23.062 14.691c-18.374 16.179-25.24 41.805-17.418 65.003c1.932 5.729 5.497 11.904 12.627 24.254c7.13 12.349 10.695 18.523 14.69 23.061c16.179 18.373 41.805 25.239 65.004 17.417c5.728-1.931 11.903-5.497 24.253-12.627l71.041-41.015c12.349-7.13 18.524-10.695 23.061-14.69c18.373-16.179 25.24-41.806 17.418-65.004c-1.932-5.729-5.497-11.903-12.627-24.252c-7.13-12.35-10.695-18.525-14.69-23.062c-16.179-18.374-41.806-25.24-65.004-17.418c-5.728 1.932-11.903 5.497-24.252 12.627z" clip-rule="evenodd"/><rect width="28.063" height="58.285" x="119.473" y="204.341" fill="#fff" rx="14.032" transform="rotate(-30 119.473 204.341)"/><rect width="28.063" height="58.285" x="195.186" y="160.627" fill="#fff" rx="14.032" transform="rotate(-30 195.186 160.627)"/></g><defs><linearGradient id="SVGA1Npkd1r" x1="140" x2="140" y1="0" y2="280" gradientUnits="userSpaceOnUse"><stop stop-color="#0ec8a9"/><stop offset="1" stop-color="#01c886"/></linearGradient><linearGradient id="SVGYRtF9d8a" x1="106.647" x2="237.632" y1="62.548" y2="289.42" gradientUnits="userSpaceOnUse"><stop stop-color="#fff" stop-opacity=".8"/><stop offset=".438" stop-color="#fff"/></linearGradient><filter id="SVG1OG3AbNG" width="385.327" height="385.328" x="-104.414" y="52.196" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_744_3208" stdDeviation="47.049"/></filter><filter id="SVG2jOUydHg" width="334.191" height="334.192" x="56.288" y="123.233" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_744_3208" stdDeviation="38.501"/></filter><clipPath id="SVGlmbeLd1A"><rect width="280" height="280" fill="#fff" rx="60.421"/></clipPath></defs></g></svg>

How to use the Workbuddy icon

React

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

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

Vue

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

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

Svelte

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

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

Tailwind CSS

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

UnoCSS

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

Web component

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

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

HTML image

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

Workbuddy icon FAQ

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

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

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

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

Browse all theSVG Color icons →