ecoin-background from Web3 Icons Branded by 0xa3k5 · Background · MIT Free for personal and commercial use.

Name
ecoin-background
Set
Web3 Icons Branded
Style
Background
Viewbox
24×24
License
MIT

1 other variant in Web3 Icons Branded

The same logo in other sets

Use the ecoin logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><g clip-path="url(#SVGHcSWxdhd140)"><path fill="url(#SVGJpzv3b7Q)" d="M24 0H0v24h24z"/><path fill="#fff" fill-rule="evenodd" d="M12 19.5a7.5 7.5 0 1 0 0-15a7.5 7.5 0 0 0 0 15m0 .5a8 8 0 1 0 0-16a8 8 0 0 0-8 8a8 8 0 0 0 8 8" clip-rule="evenodd"/><path fill="#fff" d="M11.929 5.502c-2.137 0-3.335.93-3.689 1.157l2.331 1.047c.591-.172 1.396-.2 1.725-.193c3.509.227 4.239 3.44 4.165 4.986H8.877c.42 2.009 1.698 2.5 3.253 2.5c1.352 0 2.374-1.045 2.374-1.5h1.58c-.618 2.184-2.428 3.012-3.788 3.012a6 6 0 0 1-1.726-.238L8.23 17.34c1.337 1.007 3.268 1.194 4.067 1.16c4.604 0 6.204-4.138 6.204-6.392c0-5.189-4.267-6.606-6.571-6.606"/><path fill="#fff" d="M12.125 9C10.122 9 9.207 10.653 9 11.5h6c-.123-.82-1.113-2.5-2.875-2.5"/></g><defs><linearGradient id="SVGJpzv3b7Q" x1="12" x2="12" y1="4" y2="20" gradientUnits="userSpaceOnUse"><stop stop-color="#cdae26"/><stop offset=".409" stop-color="#f9da3b"/><stop offset=".757" stop-color="#edc62d"/><stop offset="1" stop-color="#ceaf26"/></linearGradient><clipPath id="SVGHcSWxdhd140"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg>

React

import type { SVGProps } from "react";

export function TokenBrandedEcoinBackground(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"><g clipPath="url(#SVGHcSWxdhd140)"><path fill="url(#SVGJpzv3b7Q)" d="M24 0H0v24h24z"/><path fill="#fff" fillRule="evenodd" d="M12 19.5a7.5 7.5 0 1 0 0-15a7.5 7.5 0 0 0 0 15m0 .5a8 8 0 1 0 0-16a8 8 0 0 0-8 8a8 8 0 0 0 8 8" clipRule="evenodd"/><path fill="#fff" d="M11.929 5.502c-2.137 0-3.335.93-3.689 1.157l2.331 1.047c.591-.172 1.396-.2 1.725-.193c3.509.227 4.239 3.44 4.165 4.986H8.877c.42 2.009 1.698 2.5 3.253 2.5c1.352 0 2.374-1.045 2.374-1.5h1.58c-.618 2.184-2.428 3.012-3.788 3.012a6 6 0 0 1-1.726-.238L8.23 17.34c1.337 1.007 3.268 1.194 4.067 1.16c4.604 0 6.204-4.138 6.204-6.392c0-5.189-4.267-6.606-6.571-6.606"/><path fill="#fff" d="M12.125 9C10.122 9 9.207 10.653 9 11.5h6c-.123-.82-1.113-2.5-2.875-2.5"/></g><defs><linearGradient id="SVGJpzv3b7Q" x1="12" x2="12" y1="4" y2="20" gradientUnits="userSpaceOnUse"><stop stopColor="#cdae26"/><stop offset=".409" stopColor="#f9da3b"/><stop offset=".757" stopColor="#edc62d"/><stop offset="1" stopColor="#ceaf26"/></linearGradient><clipPath id="SVGHcSWxdhd140"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></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"><g clip-path="url(#SVGHcSWxdhd140)"><path fill="url(#SVGJpzv3b7Q)" d="M24 0H0v24h24z"/><path fill="#fff" fill-rule="evenodd" d="M12 19.5a7.5 7.5 0 1 0 0-15a7.5 7.5 0 0 0 0 15m0 .5a8 8 0 1 0 0-16a8 8 0 0 0-8 8a8 8 0 0 0 8 8" clip-rule="evenodd"/><path fill="#fff" d="M11.929 5.502c-2.137 0-3.335.93-3.689 1.157l2.331 1.047c.591-.172 1.396-.2 1.725-.193c3.509.227 4.239 3.44 4.165 4.986H8.877c.42 2.009 1.698 2.5 3.253 2.5c1.352 0 2.374-1.045 2.374-1.5h1.58c-.618 2.184-2.428 3.012-3.788 3.012a6 6 0 0 1-1.726-.238L8.23 17.34c1.337 1.007 3.268 1.194 4.067 1.16c4.604 0 6.204-4.138 6.204-6.392c0-5.189-4.267-6.606-6.571-6.606"/><path fill="#fff" d="M12.125 9C10.122 9 9.207 10.653 9 11.5h6c-.123-.82-1.113-2.5-2.875-2.5"/></g><defs><linearGradient id="SVGJpzv3b7Q" x1="12" x2="12" y1="4" y2="20" gradientUnits="userSpaceOnUse"><stop stop-color="#cdae26"/><stop offset=".409" stop-color="#f9da3b"/><stop offset=".757" stop-color="#edc62d"/><stop offset="1" stop-color="#ceaf26"/></linearGradient><clipPath id="SVGHcSWxdhd140"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg>
</template>

CSS

.icon-ecoin-background {
  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%3Cg%20clip-path%3D%22url(%23SVGHcSWxdhd140)%22%3E%3Cpath%20fill%3D%22url(%23SVGJpzv3b7Q)%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-rule%3D%22evenodd%22%20d%3D%22M12%2019.5a7.5%207.5%200%201%200%200-15a7.5%207.5%200%200%200%200%2015m0%20.5a8%208%200%201%200%200-16a8%208%200%200%200-8%208a8%208%200%200%200%208%208%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M11.929%205.502c-2.137%200-3.335.93-3.689%201.157l2.331%201.047c.591-.172%201.396-.2%201.725-.193c3.509.227%204.239%203.44%204.165%204.986H8.877c.42%202.009%201.698%202.5%203.253%202.5c1.352%200%202.374-1.045%202.374-1.5h1.58c-.618%202.184-2.428%203.012-3.788%203.012a6%206%200%200%201-1.726-.238L8.23%2017.34c1.337%201.007%203.268%201.194%204.067%201.16c4.604%200%206.204-4.138%206.204-6.392c0-5.189-4.267-6.606-6.571-6.606%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M12.125%209C10.122%209%209.207%2010.653%209%2011.5h6c-.123-.82-1.113-2.5-2.875-2.5%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGJpzv3b7Q%22%20x1%3D%2212%22%20x2%3D%2212%22%20y1%3D%224%22%20y2%3D%2220%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23cdae26%22%2F%3E%3Cstop%20offset%3D%22.409%22%20stop-color%3D%22%23f9da3b%22%2F%3E%3Cstop%20offset%3D%22.757%22%20stop-color%3D%22%23edc62d%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23ceaf26%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22SVGHcSWxdhd140%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M0%200h24v24H0z%22%2F%3E%3C%2FclipPath%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%3Cg%20clip-path%3D%22url(%23SVGHcSWxdhd140)%22%3E%3Cpath%20fill%3D%22url(%23SVGJpzv3b7Q)%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-rule%3D%22evenodd%22%20d%3D%22M12%2019.5a7.5%207.5%200%201%200%200-15a7.5%207.5%200%200%200%200%2015m0%20.5a8%208%200%201%200%200-16a8%208%200%200%200-8%208a8%208%200%200%200%208%208%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M11.929%205.502c-2.137%200-3.335.93-3.689%201.157l2.331%201.047c.591-.172%201.396-.2%201.725-.193c3.509.227%204.239%203.44%204.165%204.986H8.877c.42%202.009%201.698%202.5%203.253%202.5c1.352%200%202.374-1.045%202.374-1.5h1.58c-.618%202.184-2.428%203.012-3.788%203.012a6%206%200%200%201-1.726-.238L8.23%2017.34c1.337%201.007%203.268%201.194%204.067%201.16c4.604%200%206.204-4.138%206.204-6.392c0-5.189-4.267-6.606-6.571-6.606%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M12.125%209C10.122%209%209.207%2010.653%209%2011.5h6c-.123-.82-1.113-2.5-2.875-2.5%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGJpzv3b7Q%22%20x1%3D%2212%22%20x2%3D%2212%22%20y1%3D%224%22%20y2%3D%2220%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23cdae26%22%2F%3E%3Cstop%20offset%3D%22.409%22%20stop-color%3D%22%23f9da3b%22%2F%3E%3Cstop%20offset%3D%22.757%22%20stop-color%3D%22%23edc62d%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23ceaf26%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22SVGHcSWxdhd140%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M0%200h24v24H0z%22%2F%3E%3C%2FclipPath%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/ecoin-background.svg?color=%231a73e8&size=48