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

Name
iris-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 iris 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(#SVGHcSWxdhd59)"><path fill="url(#SVG1c0MNdGb)" d="M24 0H0v24h24z"/><path fill="#fff" d="M11.202 4c-2.925.25-5 2.26-5.68 3.24l1.145-.1a6.98 6.98 0 0 1 4.19-2.295l.35-.845zm0 16c-2.925-.25-5.065-2.255-5.7-3.325l.93-.1c1.215 1.56 3.29 2.45 4.12 2.515zm1.61-16c2.9.2 4.925 2.225 5.685 3.295l-.94.13c-1.4-1.73-3.215-2.425-4.1-2.515zm0 16c2.9-.2 4.925-2.225 5.685-3.295l-1.115.095a7.04 7.04 0 0 1-4.21 2.34zm-8.11-4.695c-1.27-2.915-.53-5.645 0-6.64l.56.735a7.7 7.7 0 0 0-.1 4.89zm14.6 0c1.275-2.915.515-5.62-.015-6.62l-.44 1.02c.715 1.915.17 4.05-.115 4.85l.575.75z"/><path fill="#fff" fill-rule="evenodd" d="m11.967 4.055l-1.46 3.325l-5.335.635l2.165 3.025l-2.165 4.97l3.665-.42l3.21 4.34l1.465-3.39l5.355-.61l-2.2-2.985l2.15-4.935l-3.65.38zm.19 1.674l-1.25 2.82a1 1 0 0 0-.07.375l3.026-.31l-1.37 3.31l1.27 1.726l1.185-2.616a1.9 1.9 0 0 0-.15-1.685c-.384-.592-1.72-2.383-2.47-3.392zm3.53 3.46l1.766-.205h.005l-1.37 3.196c-.07-.09-.28-.31-.535-.46c.235-.33.585-1.31.135-2.53m-5.574-.895l-3.45.39l1.1 1.5a2.77 2.77 0 0 1 2.23-1.16c0-.385.08-.65.12-.73m2.42 1.3l-2.965.33a1.68 1.68 0 0 0-1.265.986a521 521 0 0 0-1.785 4.1l2.765-.306c.14-.02.475-.08.66-.17l-1.8-2.475l3.55-.455zm-.74 2.856l-2.115.274q.849 1.18 1.71 2.35c.525.71 1.45.7 1.925.65l4.015-.485l-1.74-2.355a1.6 1.6 0 0 0-.39-.37l-1.225 2.776zm-1.97 3.03a3.7 3.7 0 0 0 .615-.23v.005a3.05 3.05 0 0 0 2.135 1.35l-.7 1.65z" clip-rule="evenodd"/></g><defs><linearGradient id="SVG1c0MNdGb" x1="5.506" x2="18.248" y1="16.694" y2="9.212" gradientUnits="userSpaceOnUse"><stop stop-color="#1190d4"/><stop offset=".34" stop-color="#5060ae"/><stop offset=".69" stop-color="#ac4179"/><stop offset="1" stop-color="#e0375c"/></linearGradient><clipPath id="SVGHcSWxdhd59"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg>

React

import type { SVGProps } from "react";

export function TokenBrandedIrisBackground(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(#SVGHcSWxdhd59)"><path fill="url(#SVG1c0MNdGb)" d="M24 0H0v24h24z"/><path fill="#fff" d="M11.202 4c-2.925.25-5 2.26-5.68 3.24l1.145-.1a6.98 6.98 0 0 1 4.19-2.295l.35-.845zm0 16c-2.925-.25-5.065-2.255-5.7-3.325l.93-.1c1.215 1.56 3.29 2.45 4.12 2.515zm1.61-16c2.9.2 4.925 2.225 5.685 3.295l-.94.13c-1.4-1.73-3.215-2.425-4.1-2.515zm0 16c2.9-.2 4.925-2.225 5.685-3.295l-1.115.095a7.04 7.04 0 0 1-4.21 2.34zm-8.11-4.695c-1.27-2.915-.53-5.645 0-6.64l.56.735a7.7 7.7 0 0 0-.1 4.89zm14.6 0c1.275-2.915.515-5.62-.015-6.62l-.44 1.02c.715 1.915.17 4.05-.115 4.85l.575.75z"/><path fill="#fff" fillRule="evenodd" d="m11.967 4.055l-1.46 3.325l-5.335.635l2.165 3.025l-2.165 4.97l3.665-.42l3.21 4.34l1.465-3.39l5.355-.61l-2.2-2.985l2.15-4.935l-3.65.38zm.19 1.674l-1.25 2.82a1 1 0 0 0-.07.375l3.026-.31l-1.37 3.31l1.27 1.726l1.185-2.616a1.9 1.9 0 0 0-.15-1.685c-.384-.592-1.72-2.383-2.47-3.392zm3.53 3.46l1.766-.205h.005l-1.37 3.196c-.07-.09-.28-.31-.535-.46c.235-.33.585-1.31.135-2.53m-5.574-.895l-3.45.39l1.1 1.5a2.77 2.77 0 0 1 2.23-1.16c0-.385.08-.65.12-.73m2.42 1.3l-2.965.33a1.68 1.68 0 0 0-1.265.986a521 521 0 0 0-1.785 4.1l2.765-.306c.14-.02.475-.08.66-.17l-1.8-2.475l3.55-.455zm-.74 2.856l-2.115.274q.849 1.18 1.71 2.35c.525.71 1.45.7 1.925.65l4.015-.485l-1.74-2.355a1.6 1.6 0 0 0-.39-.37l-1.225 2.776zm-1.97 3.03a3.7 3.7 0 0 0 .615-.23v.005a3.05 3.05 0 0 0 2.135 1.35l-.7 1.65z" clipRule="evenodd"/></g><defs><linearGradient id="SVG1c0MNdGb" x1="5.506" x2="18.248" y1="16.694" y2="9.212" gradientUnits="userSpaceOnUse"><stop stopColor="#1190d4"/><stop offset=".34" stopColor="#5060ae"/><stop offset=".69" stopColor="#ac4179"/><stop offset="1" stopColor="#e0375c"/></linearGradient><clipPath id="SVGHcSWxdhd59"><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(#SVGHcSWxdhd59)"><path fill="url(#SVG1c0MNdGb)" d="M24 0H0v24h24z"/><path fill="#fff" d="M11.202 4c-2.925.25-5 2.26-5.68 3.24l1.145-.1a6.98 6.98 0 0 1 4.19-2.295l.35-.845zm0 16c-2.925-.25-5.065-2.255-5.7-3.325l.93-.1c1.215 1.56 3.29 2.45 4.12 2.515zm1.61-16c2.9.2 4.925 2.225 5.685 3.295l-.94.13c-1.4-1.73-3.215-2.425-4.1-2.515zm0 16c2.9-.2 4.925-2.225 5.685-3.295l-1.115.095a7.04 7.04 0 0 1-4.21 2.34zm-8.11-4.695c-1.27-2.915-.53-5.645 0-6.64l.56.735a7.7 7.7 0 0 0-.1 4.89zm14.6 0c1.275-2.915.515-5.62-.015-6.62l-.44 1.02c.715 1.915.17 4.05-.115 4.85l.575.75z"/><path fill="#fff" fill-rule="evenodd" d="m11.967 4.055l-1.46 3.325l-5.335.635l2.165 3.025l-2.165 4.97l3.665-.42l3.21 4.34l1.465-3.39l5.355-.61l-2.2-2.985l2.15-4.935l-3.65.38zm.19 1.674l-1.25 2.82a1 1 0 0 0-.07.375l3.026-.31l-1.37 3.31l1.27 1.726l1.185-2.616a1.9 1.9 0 0 0-.15-1.685c-.384-.592-1.72-2.383-2.47-3.392zm3.53 3.46l1.766-.205h.005l-1.37 3.196c-.07-.09-.28-.31-.535-.46c.235-.33.585-1.31.135-2.53m-5.574-.895l-3.45.39l1.1 1.5a2.77 2.77 0 0 1 2.23-1.16c0-.385.08-.65.12-.73m2.42 1.3l-2.965.33a1.68 1.68 0 0 0-1.265.986a521 521 0 0 0-1.785 4.1l2.765-.306c.14-.02.475-.08.66-.17l-1.8-2.475l3.55-.455zm-.74 2.856l-2.115.274q.849 1.18 1.71 2.35c.525.71 1.45.7 1.925.65l4.015-.485l-1.74-2.355a1.6 1.6 0 0 0-.39-.37l-1.225 2.776zm-1.97 3.03a3.7 3.7 0 0 0 .615-.23v.005a3.05 3.05 0 0 0 2.135 1.35l-.7 1.65z" clip-rule="evenodd"/></g><defs><linearGradient id="SVG1c0MNdGb" x1="5.506" x2="18.248" y1="16.694" y2="9.212" gradientUnits="userSpaceOnUse"><stop stop-color="#1190d4"/><stop offset=".34" stop-color="#5060ae"/><stop offset=".69" stop-color="#ac4179"/><stop offset="1" stop-color="#e0375c"/></linearGradient><clipPath id="SVGHcSWxdhd59"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg>
</template>

CSS

.icon-iris-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(%23SVGHcSWxdhd59)%22%3E%3Cpath%20fill%3D%22url(%23SVG1c0MNdGb)%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M11.202%204c-2.925.25-5%202.26-5.68%203.24l1.145-.1a6.98%206.98%200%200%201%204.19-2.295l.35-.845zm0%2016c-2.925-.25-5.065-2.255-5.7-3.325l.93-.1c1.215%201.56%203.29%202.45%204.12%202.515zm1.61-16c2.9.2%204.925%202.225%205.685%203.295l-.94.13c-1.4-1.73-3.215-2.425-4.1-2.515zm0%2016c2.9-.2%204.925-2.225%205.685-3.295l-1.115.095a7.04%207.04%200%200%201-4.21%202.34zm-8.11-4.695c-1.27-2.915-.53-5.645%200-6.64l.56.735a7.7%207.7%200%200%200-.1%204.89zm14.6%200c1.275-2.915.515-5.62-.015-6.62l-.44%201.02c.715%201.915.17%204.05-.115%204.85l.575.75z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-rule%3D%22evenodd%22%20d%3D%22m11.967%204.055l-1.46%203.325l-5.335.635l2.165%203.025l-2.165%204.97l3.665-.42l3.21%204.34l1.465-3.39l5.355-.61l-2.2-2.985l2.15-4.935l-3.65.38zm.19%201.674l-1.25%202.82a1%201%200%200%200-.07.375l3.026-.31l-1.37%203.31l1.27%201.726l1.185-2.616a1.9%201.9%200%200%200-.15-1.685c-.384-.592-1.72-2.383-2.47-3.392zm3.53%203.46l1.766-.205h.005l-1.37%203.196c-.07-.09-.28-.31-.535-.46c.235-.33.585-1.31.135-2.53m-5.574-.895l-3.45.39l1.1%201.5a2.77%202.77%200%200%201%202.23-1.16c0-.385.08-.65.12-.73m2.42%201.3l-2.965.33a1.68%201.68%200%200%200-1.265.986a521%20521%200%200%200-1.785%204.1l2.765-.306c.14-.02.475-.08.66-.17l-1.8-2.475l3.55-.455zm-.74%202.856l-2.115.274q.849%201.18%201.71%202.35c.525.71%201.45.7%201.925.65l4.015-.485l-1.74-2.355a1.6%201.6%200%200%200-.39-.37l-1.225%202.776zm-1.97%203.03a3.7%203.7%200%200%200%20.615-.23v.005a3.05%203.05%200%200%200%202.135%201.35l-.7%201.65z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVG1c0MNdGb%22%20x1%3D%225.506%22%20x2%3D%2218.248%22%20y1%3D%2216.694%22%20y2%3D%229.212%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%231190d4%22%2F%3E%3Cstop%20offset%3D%22.34%22%20stop-color%3D%22%235060ae%22%2F%3E%3Cstop%20offset%3D%22.69%22%20stop-color%3D%22%23ac4179%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23e0375c%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22SVGHcSWxdhd59%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(%23SVGHcSWxdhd59)%22%3E%3Cpath%20fill%3D%22url(%23SVG1c0MNdGb)%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M11.202%204c-2.925.25-5%202.26-5.68%203.24l1.145-.1a6.98%206.98%200%200%201%204.19-2.295l.35-.845zm0%2016c-2.925-.25-5.065-2.255-5.7-3.325l.93-.1c1.215%201.56%203.29%202.45%204.12%202.515zm1.61-16c2.9.2%204.925%202.225%205.685%203.295l-.94.13c-1.4-1.73-3.215-2.425-4.1-2.515zm0%2016c2.9-.2%204.925-2.225%205.685-3.295l-1.115.095a7.04%207.04%200%200%201-4.21%202.34zm-8.11-4.695c-1.27-2.915-.53-5.645%200-6.64l.56.735a7.7%207.7%200%200%200-.1%204.89zm14.6%200c1.275-2.915.515-5.62-.015-6.62l-.44%201.02c.715%201.915.17%204.05-.115%204.85l.575.75z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-rule%3D%22evenodd%22%20d%3D%22m11.967%204.055l-1.46%203.325l-5.335.635l2.165%203.025l-2.165%204.97l3.665-.42l3.21%204.34l1.465-3.39l5.355-.61l-2.2-2.985l2.15-4.935l-3.65.38zm.19%201.674l-1.25%202.82a1%201%200%200%200-.07.375l3.026-.31l-1.37%203.31l1.27%201.726l1.185-2.616a1.9%201.9%200%200%200-.15-1.685c-.384-.592-1.72-2.383-2.47-3.392zm3.53%203.46l1.766-.205h.005l-1.37%203.196c-.07-.09-.28-.31-.535-.46c.235-.33.585-1.31.135-2.53m-5.574-.895l-3.45.39l1.1%201.5a2.77%202.77%200%200%201%202.23-1.16c0-.385.08-.65.12-.73m2.42%201.3l-2.965.33a1.68%201.68%200%200%200-1.265.986a521%20521%200%200%200-1.785%204.1l2.765-.306c.14-.02.475-.08.66-.17l-1.8-2.475l3.55-.455zm-.74%202.856l-2.115.274q.849%201.18%201.71%202.35c.525.71%201.45.7%201.925.65l4.015-.485l-1.74-2.355a1.6%201.6%200%200%200-.39-.37l-1.225%202.776zm-1.97%203.03a3.7%203.7%200%200%200%20.615-.23v.005a3.05%203.05%200%200%200%202.135%201.35l-.7%201.65z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVG1c0MNdGb%22%20x1%3D%225.506%22%20x2%3D%2218.248%22%20y1%3D%2216.694%22%20y2%3D%229.212%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%231190d4%22%2F%3E%3Cstop%20offset%3D%22.34%22%20stop-color%3D%22%235060ae%22%2F%3E%3Cstop%20offset%3D%22.69%22%20stop-color%3D%22%23ac4179%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23e0375c%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22SVGHcSWxdhd59%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/iris-background.svg?color=%231a73e8&size=48