opium logo
opium-background from Web3 Icons Branded by 0xa3k5 · Background · MIT Free for personal and commercial use.
- Name
- opium-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 opium 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(#SVGHcSWxdhd13)"><path fill="#000" d="M24 0H0v24h24z"/><path fill="url(#SVGD6mAKbXW)" fill-rule="evenodd" d="M4 12.222c.009-1.929 1.111-5.778 5.493-5.778c.551.027 1.89.29 2.827 1.12c1.178 1.036 1.36 1.111 1.96 1.111c.48 0 1.036-.208 1.253-.31c.2-.09.734-.267 1.254-.267c.653 0 3.213.604 3.213 3.88s-2.52 3.933-3.133 3.933a3.65 3.65 0 0 1-1.454-.293c-.266-.116-.666-.29-1.155-.29c-.436 0-1.258.6-1.618.899c-.453.444-1.76 1.328-3.338 1.328C7.333 17.555 4 16.08 4 12.222m3.556.089c-.04-.991.395-2.978 2.457-2.978h.018c.129 0 .769-.018 1.658.556l.084.053c.88.569 1.325.853 2.33.853c.83 0 1.488-.342 1.715-.51a1.9 1.9 0 0 1 .867-.294c.4 0 1.537.391 1.537 2s-1.182 2.049-1.538 2.049c-.284 0-.697-.204-.866-.311a3.5 3.5 0 0 0-1.716-.507a3.4 3.4 0 0 0-1.689.507c-.409.31-1.44.938-2.31.938c-1.08 0-2.543-1.094-2.543-2.356z" clip-rule="evenodd"/></g><defs><linearGradient id="SVGD6mAKbXW" x1="4.156" x2="19.791" y1="12.315" y2="12.315" gradientUnits="userSpaceOnUse"><stop stop-color="#4fef8f"/><stop offset=".23" stop-color="#ffed03"/><stop offset=".34" stop-color="#fd9d37"/><stop offset=".46" stop-color="#f62a81"/><stop offset=".59" stop-color="#9736b6"/><stop offset=".7" stop-color="#6453c5"/><stop offset=".83" stop-color="#1a7bd9"/></linearGradient><clipPath id="SVGHcSWxdhd13"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg>
React
import type { SVGProps } from "react";
export function TokenBrandedOpiumBackground(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(#SVGHcSWxdhd13)"><path fill="#000" d="M24 0H0v24h24z"/><path fill="url(#SVGD6mAKbXW)" fillRule="evenodd" d="M4 12.222c.009-1.929 1.111-5.778 5.493-5.778c.551.027 1.89.29 2.827 1.12c1.178 1.036 1.36 1.111 1.96 1.111c.48 0 1.036-.208 1.253-.31c.2-.09.734-.267 1.254-.267c.653 0 3.213.604 3.213 3.88s-2.52 3.933-3.133 3.933a3.65 3.65 0 0 1-1.454-.293c-.266-.116-.666-.29-1.155-.29c-.436 0-1.258.6-1.618.899c-.453.444-1.76 1.328-3.338 1.328C7.333 17.555 4 16.08 4 12.222m3.556.089c-.04-.991.395-2.978 2.457-2.978h.018c.129 0 .769-.018 1.658.556l.084.053c.88.569 1.325.853 2.33.853c.83 0 1.488-.342 1.715-.51a1.9 1.9 0 0 1 .867-.294c.4 0 1.537.391 1.537 2s-1.182 2.049-1.538 2.049c-.284 0-.697-.204-.866-.311a3.5 3.5 0 0 0-1.716-.507a3.4 3.4 0 0 0-1.689.507c-.409.31-1.44.938-2.31.938c-1.08 0-2.543-1.094-2.543-2.356z" clipRule="evenodd"/></g><defs><linearGradient id="SVGD6mAKbXW" x1="4.156" x2="19.791" y1="12.315" y2="12.315" gradientUnits="userSpaceOnUse"><stop stopColor="#4fef8f"/><stop offset=".23" stopColor="#ffed03"/><stop offset=".34" stopColor="#fd9d37"/><stop offset=".46" stopColor="#f62a81"/><stop offset=".59" stopColor="#9736b6"/><stop offset=".7" stopColor="#6453c5"/><stop offset=".83" stopColor="#1a7bd9"/></linearGradient><clipPath id="SVGHcSWxdhd13"><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(#SVGHcSWxdhd13)"><path fill="#000" d="M24 0H0v24h24z"/><path fill="url(#SVGD6mAKbXW)" fill-rule="evenodd" d="M4 12.222c.009-1.929 1.111-5.778 5.493-5.778c.551.027 1.89.29 2.827 1.12c1.178 1.036 1.36 1.111 1.96 1.111c.48 0 1.036-.208 1.253-.31c.2-.09.734-.267 1.254-.267c.653 0 3.213.604 3.213 3.88s-2.52 3.933-3.133 3.933a3.65 3.65 0 0 1-1.454-.293c-.266-.116-.666-.29-1.155-.29c-.436 0-1.258.6-1.618.899c-.453.444-1.76 1.328-3.338 1.328C7.333 17.555 4 16.08 4 12.222m3.556.089c-.04-.991.395-2.978 2.457-2.978h.018c.129 0 .769-.018 1.658.556l.084.053c.88.569 1.325.853 2.33.853c.83 0 1.488-.342 1.715-.51a1.9 1.9 0 0 1 .867-.294c.4 0 1.537.391 1.537 2s-1.182 2.049-1.538 2.049c-.284 0-.697-.204-.866-.311a3.5 3.5 0 0 0-1.716-.507a3.4 3.4 0 0 0-1.689.507c-.409.31-1.44.938-2.31.938c-1.08 0-2.543-1.094-2.543-2.356z" clip-rule="evenodd"/></g><defs><linearGradient id="SVGD6mAKbXW" x1="4.156" x2="19.791" y1="12.315" y2="12.315" gradientUnits="userSpaceOnUse"><stop stop-color="#4fef8f"/><stop offset=".23" stop-color="#ffed03"/><stop offset=".34" stop-color="#fd9d37"/><stop offset=".46" stop-color="#f62a81"/><stop offset=".59" stop-color="#9736b6"/><stop offset=".7" stop-color="#6453c5"/><stop offset=".83" stop-color="#1a7bd9"/></linearGradient><clipPath id="SVGHcSWxdhd13"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg> </template>
CSS
.icon-opium-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(%23SVGHcSWxdhd13)%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGD6mAKbXW)%22%20fill-rule%3D%22evenodd%22%20d%3D%22M4%2012.222c.009-1.929%201.111-5.778%205.493-5.778c.551.027%201.89.29%202.827%201.12c1.178%201.036%201.36%201.111%201.96%201.111c.48%200%201.036-.208%201.253-.31c.2-.09.734-.267%201.254-.267c.653%200%203.213.604%203.213%203.88s-2.52%203.933-3.133%203.933a3.65%203.65%200%200%201-1.454-.293c-.266-.116-.666-.29-1.155-.29c-.436%200-1.258.6-1.618.899c-.453.444-1.76%201.328-3.338%201.328C7.333%2017.555%204%2016.08%204%2012.222m3.556.089c-.04-.991.395-2.978%202.457-2.978h.018c.129%200%20.769-.018%201.658.556l.084.053c.88.569%201.325.853%202.33.853c.83%200%201.488-.342%201.715-.51a1.9%201.9%200%200%201%20.867-.294c.4%200%201.537.391%201.537%202s-1.182%202.049-1.538%202.049c-.284%200-.697-.204-.866-.311a3.5%203.5%200%200%200-1.716-.507a3.4%203.4%200%200%200-1.689.507c-.409.31-1.44.938-2.31.938c-1.08%200-2.543-1.094-2.543-2.356z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGD6mAKbXW%22%20x1%3D%224.156%22%20x2%3D%2219.791%22%20y1%3D%2212.315%22%20y2%3D%2212.315%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%234fef8f%22%2F%3E%3Cstop%20offset%3D%22.23%22%20stop-color%3D%22%23ffed03%22%2F%3E%3Cstop%20offset%3D%22.34%22%20stop-color%3D%22%23fd9d37%22%2F%3E%3Cstop%20offset%3D%22.46%22%20stop-color%3D%22%23f62a81%22%2F%3E%3Cstop%20offset%3D%22.59%22%20stop-color%3D%22%239736b6%22%2F%3E%3Cstop%20offset%3D%22.7%22%20stop-color%3D%22%236453c5%22%2F%3E%3Cstop%20offset%3D%22.83%22%20stop-color%3D%22%231a7bd9%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22SVGHcSWxdhd13%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(%23SVGHcSWxdhd13)%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGD6mAKbXW)%22%20fill-rule%3D%22evenodd%22%20d%3D%22M4%2012.222c.009-1.929%201.111-5.778%205.493-5.778c.551.027%201.89.29%202.827%201.12c1.178%201.036%201.36%201.111%201.96%201.111c.48%200%201.036-.208%201.253-.31c.2-.09.734-.267%201.254-.267c.653%200%203.213.604%203.213%203.88s-2.52%203.933-3.133%203.933a3.65%203.65%200%200%201-1.454-.293c-.266-.116-.666-.29-1.155-.29c-.436%200-1.258.6-1.618.899c-.453.444-1.76%201.328-3.338%201.328C7.333%2017.555%204%2016.08%204%2012.222m3.556.089c-.04-.991.395-2.978%202.457-2.978h.018c.129%200%20.769-.018%201.658.556l.084.053c.88.569%201.325.853%202.33.853c.83%200%201.488-.342%201.715-.51a1.9%201.9%200%200%201%20.867-.294c.4%200%201.537.391%201.537%202s-1.182%202.049-1.538%202.049c-.284%200-.697-.204-.866-.311a3.5%203.5%200%200%200-1.716-.507a3.4%203.4%200%200%200-1.689.507c-.409.31-1.44.938-2.31.938c-1.08%200-2.543-1.094-2.543-2.356z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGD6mAKbXW%22%20x1%3D%224.156%22%20x2%3D%2219.791%22%20y1%3D%2212.315%22%20y2%3D%2212.315%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%234fef8f%22%2F%3E%3Cstop%20offset%3D%22.23%22%20stop-color%3D%22%23ffed03%22%2F%3E%3Cstop%20offset%3D%22.34%22%20stop-color%3D%22%23fd9d37%22%2F%3E%3Cstop%20offset%3D%22.46%22%20stop-color%3D%22%23f62a81%22%2F%3E%3Cstop%20offset%3D%22.59%22%20stop-color%3D%22%239736b6%22%2F%3E%3Cstop%20offset%3D%22.7%22%20stop-color%3D%22%236453c5%22%2F%3E%3Cstop%20offset%3D%22.83%22%20stop-color%3D%22%231a7bd9%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22SVGHcSWxdhd13%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/opium-background.svg?color=%231a73e8&size=48
