harmony from Web3 Icons Branded by 0xa3k5 · Branded · MIT Free for personal and commercial use.

Name
harmony
Set
Web3 Icons Branded
Style
Branded
Viewbox
24×24
License
MIT

1 other variant in Web3 Icons Branded

The same logo in other sets

Use the harmony logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="url(#SVG3peijcDH)" d="M17.117 3.025a3.88 3.88 0 0 0-3.884 3.87v4.293q-.598.042-1.233.044c-.424 0-.831.017-1.233.04V6.897a3.884 3.884 0 0 0-7.767 0v10.258a3.884 3.884 0 0 0 7.767 0v-4.292q.598-.042 1.233-.044c.424 0 .831-.017 1.233-.041v4.377a3.884 3.884 0 0 0 7.767 0V6.896a3.88 3.88 0 0 0-3.883-3.871M6.883 4.61a2.29 2.29 0 0 1 2.292 2.285v4.545a13 13 0 0 0-3.3.933c-.457.2-.887.457-1.28.764V6.896A2.29 2.29 0 0 1 6.883 4.61m2.292 12.543a2.292 2.292 0 0 1-4.584 0v-1.03c0-.908.72-1.77 1.927-2.305c.85-.367 1.743-.628 2.657-.777zm7.942 2.285a2.29 2.29 0 0 1-2.292-2.285v-4.545a13 13 0 0 0 3.3-.933c.457-.2.887-.457 1.28-.764v6.242a2.29 2.29 0 0 1-2.288 2.285m.365-9.214c-.85.367-1.743.627-2.657.777V6.896a2.292 2.292 0 0 1 4.584 0v1.029c0 .905-.72 1.766-1.927 2.3"/><defs><linearGradient id="SVG3peijcDH" x1="4.14" x2="19.757" y1="19.638" y2="3.978" gradientUnits="userSpaceOnUse"><stop stop-color="#00aee9"/><stop offset="1" stop-color="#69fabd"/></linearGradient></defs></g></svg>

React

import type { SVGProps } from "react";

export function TokenBrandedHarmony(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="url(#SVG3peijcDH)" d="M17.117 3.025a3.88 3.88 0 0 0-3.884 3.87v4.293q-.598.042-1.233.044c-.424 0-.831.017-1.233.04V6.897a3.884 3.884 0 0 0-7.767 0v10.258a3.884 3.884 0 0 0 7.767 0v-4.292q.598-.042 1.233-.044c.424 0 .831-.017 1.233-.041v4.377a3.884 3.884 0 0 0 7.767 0V6.896a3.88 3.88 0 0 0-3.883-3.871M6.883 4.61a2.29 2.29 0 0 1 2.292 2.285v4.545a13 13 0 0 0-3.3.933c-.457.2-.887.457-1.28.764V6.896A2.29 2.29 0 0 1 6.883 4.61m2.292 12.543a2.292 2.292 0 0 1-4.584 0v-1.03c0-.908.72-1.77 1.927-2.305c.85-.367 1.743-.628 2.657-.777zm7.942 2.285a2.29 2.29 0 0 1-2.292-2.285v-4.545a13 13 0 0 0 3.3-.933c.457-.2.887-.457 1.28-.764v6.242a2.29 2.29 0 0 1-2.288 2.285m.365-9.214c-.85.367-1.743.627-2.657.777V6.896a2.292 2.292 0 0 1 4.584 0v1.029c0 .905-.72 1.766-1.927 2.3"/><defs><linearGradient id="SVG3peijcDH" x1="4.14" x2="19.757" y1="19.638" y2="3.978" gradientUnits="userSpaceOnUse"><stop stopColor="#00aee9"/><stop offset="1" stopColor="#69fabd"/></linearGradient></defs></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="url(#SVG3peijcDH)" d="M17.117 3.025a3.88 3.88 0 0 0-3.884 3.87v4.293q-.598.042-1.233.044c-.424 0-.831.017-1.233.04V6.897a3.884 3.884 0 0 0-7.767 0v10.258a3.884 3.884 0 0 0 7.767 0v-4.292q.598-.042 1.233-.044c.424 0 .831-.017 1.233-.041v4.377a3.884 3.884 0 0 0 7.767 0V6.896a3.88 3.88 0 0 0-3.883-3.871M6.883 4.61a2.29 2.29 0 0 1 2.292 2.285v4.545a13 13 0 0 0-3.3.933c-.457.2-.887.457-1.28.764V6.896A2.29 2.29 0 0 1 6.883 4.61m2.292 12.543a2.292 2.292 0 0 1-4.584 0v-1.03c0-.908.72-1.77 1.927-2.305c.85-.367 1.743-.628 2.657-.777zm7.942 2.285a2.29 2.29 0 0 1-2.292-2.285v-4.545a13 13 0 0 0 3.3-.933c.457-.2.887-.457 1.28-.764v6.242a2.29 2.29 0 0 1-2.288 2.285m.365-9.214c-.85.367-1.743.627-2.657.777V6.896a2.292 2.292 0 0 1 4.584 0v1.029c0 .905-.72 1.766-1.927 2.3"/><defs><linearGradient id="SVG3peijcDH" x1="4.14" x2="19.757" y1="19.638" y2="3.978" gradientUnits="userSpaceOnUse"><stop stop-color="#00aee9"/><stop offset="1" stop-color="#69fabd"/></linearGradient></defs></g></svg>
</template>

CSS

.icon-harmony {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVG3peijcDH)%22%20d%3D%22M17.117%203.025a3.88%203.88%200%200%200-3.884%203.87v4.293q-.598.042-1.233.044c-.424%200-.831.017-1.233.04V6.897a3.884%203.884%200%200%200-7.767%200v10.258a3.884%203.884%200%200%200%207.767%200v-4.292q.598-.042%201.233-.044c.424%200%20.831-.017%201.233-.041v4.377a3.884%203.884%200%200%200%207.767%200V6.896a3.88%203.88%200%200%200-3.883-3.871M6.883%204.61a2.29%202.29%200%200%201%202.292%202.285v4.545a13%2013%200%200%200-3.3.933c-.457.2-.887.457-1.28.764V6.896A2.29%202.29%200%200%201%206.883%204.61m2.292%2012.543a2.292%202.292%200%200%201-4.584%200v-1.03c0-.908.72-1.77%201.927-2.305c.85-.367%201.743-.628%202.657-.777zm7.942%202.285a2.29%202.29%200%200%201-2.292-2.285v-4.545a13%2013%200%200%200%203.3-.933c.457-.2.887-.457%201.28-.764v6.242a2.29%202.29%200%200%201-2.288%202.285m.365-9.214c-.85.367-1.743.627-2.657.777V6.896a2.292%202.292%200%200%201%204.584%200v1.029c0%20.905-.72%201.766-1.927%202.3%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVG3peijcDH%22%20x1%3D%224.14%22%20x2%3D%2219.757%22%20y1%3D%2219.638%22%20y2%3D%223.978%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2300aee9%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2369fabd%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVG3peijcDH)%22%20d%3D%22M17.117%203.025a3.88%203.88%200%200%200-3.884%203.87v4.293q-.598.042-1.233.044c-.424%200-.831.017-1.233.04V6.897a3.884%203.884%200%200%200-7.767%200v10.258a3.884%203.884%200%200%200%207.767%200v-4.292q.598-.042%201.233-.044c.424%200%20.831-.017%201.233-.041v4.377a3.884%203.884%200%200%200%207.767%200V6.896a3.88%203.88%200%200%200-3.883-3.871M6.883%204.61a2.29%202.29%200%200%201%202.292%202.285v4.545a13%2013%200%200%200-3.3.933c-.457.2-.887.457-1.28.764V6.896A2.29%202.29%200%200%201%206.883%204.61m2.292%2012.543a2.292%202.292%200%200%201-4.584%200v-1.03c0-.908.72-1.77%201.927-2.305c.85-.367%201.743-.628%202.657-.777zm7.942%202.285a2.29%202.29%200%200%201-2.292-2.285v-4.545a13%2013%200%200%200%203.3-.933c.457-.2.887-.457%201.28-.764v6.242a2.29%202.29%200%200%201-2.288%202.285m.365-9.214c-.85.367-1.743.627-2.657.777V6.896a2.292%202.292%200%200%201%204.584%200v1.029c0%20.905-.72%201.766-1.927%202.3%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVG3peijcDH%22%20x1%3D%224.14%22%20x2%3D%2219.757%22%20y1%3D%2219.638%22%20y2%3D%223.978%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2300aee9%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2369fabd%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/token-branded/harmony.svg?color=%231a73e8&size=48