hbb logo
hbb-background from Web3 Icons Branded by 0xa3k5 · Background · MIT Free for personal and commercial use.
- Name
- hbb-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 hbb 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(#SVGHcSWxdhd236)"><path fill="url(#SVGmsjlYdcy)" d="M24 0H0v24h24z"/><path fill="#fff" fill-rule="evenodd" d="M8.706 9.412H6.824v1.412h1.882zm-2.353 0v1.412H4.47V9.412zM4.47 12.706v-1.412h1.882v1.412zm0 .47v1.412h1.882v-1.411zm1.882 3.751a2.12 2.12 0 0 1-1.868-1.868h1.868zm.47 0V15.06h1.869a2.12 2.12 0 0 1-1.868 1.868m1.883-3.75v1.412H6.824v-1.412zm0-.47v-1.413H6.824v1.412zM6.824 8.94V7.073a2.12 2.12 0 0 1 1.868 1.868zm-.471 0H4.485a2.12 2.12 0 0 1 1.868-1.868zM4 9.177a2.59 2.59 0 0 1 2.353-2.58v-.009h.47v.01a2.59 2.59 0 0 1 2.353 2.579v5.647a2.588 2.588 0 0 1-5.176 0zm15.53.235h-1.883v1.412h1.882zm-2.354 0v1.412h-1.882V9.412zm-1.882 3.294v-1.412h1.883v1.412zm0 .47v1.412h1.883v-1.411zm1.883 3.751a2.12 2.12 0 0 1-1.869-1.868h1.869zm.47 0V15.06h1.868a2.12 2.12 0 0 1-1.868 1.868m1.882-3.75v1.412h-1.882v-1.412zm0-.47v-1.413h-1.882v1.412zM17.647 8.94V7.073a2.12 2.12 0 0 1 1.868 1.868zm-.47 0h-1.869a2.12 2.12 0 0 1 1.869-1.868zm-2.354.236a2.59 2.59 0 0 1 2.354-2.58v-.009h.47v.01A2.59 2.59 0 0 1 20 9.177v5.647a2.588 2.588 0 0 1-5.177 0zm-4.705.705h1.411v1.412h-1.411zm3.764 0h-1.411v1.412h1.411zm-1.411 2.354h1.411v1.411h-1.411zm-.942 0h-1.411v1.411h1.411z" clip-rule="evenodd"/></g><defs><linearGradient id="SVGmsjlYdcy" x1="18.118" x2="5.176" y1="6.118" y2="17.412" gradientUnits="userSpaceOnUse"><stop stop-color="#36c9ff"/><stop offset=".53" stop-color="#7d81ff"/><stop offset="1" stop-color="#da26ff"/></linearGradient><clipPath id="SVGHcSWxdhd236"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg>
React
import type { SVGProps } from "react";
export function TokenBrandedHbbBackground(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(#SVGHcSWxdhd236)"><path fill="url(#SVGmsjlYdcy)" d="M24 0H0v24h24z"/><path fill="#fff" fillRule="evenodd" d="M8.706 9.412H6.824v1.412h1.882zm-2.353 0v1.412H4.47V9.412zM4.47 12.706v-1.412h1.882v1.412zm0 .47v1.412h1.882v-1.411zm1.882 3.751a2.12 2.12 0 0 1-1.868-1.868h1.868zm.47 0V15.06h1.869a2.12 2.12 0 0 1-1.868 1.868m1.883-3.75v1.412H6.824v-1.412zm0-.47v-1.413H6.824v1.412zM6.824 8.94V7.073a2.12 2.12 0 0 1 1.868 1.868zm-.471 0H4.485a2.12 2.12 0 0 1 1.868-1.868zM4 9.177a2.59 2.59 0 0 1 2.353-2.58v-.009h.47v.01a2.59 2.59 0 0 1 2.353 2.579v5.647a2.588 2.588 0 0 1-5.176 0zm15.53.235h-1.883v1.412h1.882zm-2.354 0v1.412h-1.882V9.412zm-1.882 3.294v-1.412h1.883v1.412zm0 .47v1.412h1.883v-1.411zm1.883 3.751a2.12 2.12 0 0 1-1.869-1.868h1.869zm.47 0V15.06h1.868a2.12 2.12 0 0 1-1.868 1.868m1.882-3.75v1.412h-1.882v-1.412zm0-.47v-1.413h-1.882v1.412zM17.647 8.94V7.073a2.12 2.12 0 0 1 1.868 1.868zm-.47 0h-1.869a2.12 2.12 0 0 1 1.869-1.868zm-2.354.236a2.59 2.59 0 0 1 2.354-2.58v-.009h.47v.01A2.59 2.59 0 0 1 20 9.177v5.647a2.588 2.588 0 0 1-5.177 0zm-4.705.705h1.411v1.412h-1.411zm3.764 0h-1.411v1.412h1.411zm-1.411 2.354h1.411v1.411h-1.411zm-.942 0h-1.411v1.411h1.411z" clipRule="evenodd"/></g><defs><linearGradient id="SVGmsjlYdcy" x1="18.118" x2="5.176" y1="6.118" y2="17.412" gradientUnits="userSpaceOnUse"><stop stopColor="#36c9ff"/><stop offset=".53" stopColor="#7d81ff"/><stop offset="1" stopColor="#da26ff"/></linearGradient><clipPath id="SVGHcSWxdhd236"><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(#SVGHcSWxdhd236)"><path fill="url(#SVGmsjlYdcy)" d="M24 0H0v24h24z"/><path fill="#fff" fill-rule="evenodd" d="M8.706 9.412H6.824v1.412h1.882zm-2.353 0v1.412H4.47V9.412zM4.47 12.706v-1.412h1.882v1.412zm0 .47v1.412h1.882v-1.411zm1.882 3.751a2.12 2.12 0 0 1-1.868-1.868h1.868zm.47 0V15.06h1.869a2.12 2.12 0 0 1-1.868 1.868m1.883-3.75v1.412H6.824v-1.412zm0-.47v-1.413H6.824v1.412zM6.824 8.94V7.073a2.12 2.12 0 0 1 1.868 1.868zm-.471 0H4.485a2.12 2.12 0 0 1 1.868-1.868zM4 9.177a2.59 2.59 0 0 1 2.353-2.58v-.009h.47v.01a2.59 2.59 0 0 1 2.353 2.579v5.647a2.588 2.588 0 0 1-5.176 0zm15.53.235h-1.883v1.412h1.882zm-2.354 0v1.412h-1.882V9.412zm-1.882 3.294v-1.412h1.883v1.412zm0 .47v1.412h1.883v-1.411zm1.883 3.751a2.12 2.12 0 0 1-1.869-1.868h1.869zm.47 0V15.06h1.868a2.12 2.12 0 0 1-1.868 1.868m1.882-3.75v1.412h-1.882v-1.412zm0-.47v-1.413h-1.882v1.412zM17.647 8.94V7.073a2.12 2.12 0 0 1 1.868 1.868zm-.47 0h-1.869a2.12 2.12 0 0 1 1.869-1.868zm-2.354.236a2.59 2.59 0 0 1 2.354-2.58v-.009h.47v.01A2.59 2.59 0 0 1 20 9.177v5.647a2.588 2.588 0 0 1-5.177 0zm-4.705.705h1.411v1.412h-1.411zm3.764 0h-1.411v1.412h1.411zm-1.411 2.354h1.411v1.411h-1.411zm-.942 0h-1.411v1.411h1.411z" clip-rule="evenodd"/></g><defs><linearGradient id="SVGmsjlYdcy" x1="18.118" x2="5.176" y1="6.118" y2="17.412" gradientUnits="userSpaceOnUse"><stop stop-color="#36c9ff"/><stop offset=".53" stop-color="#7d81ff"/><stop offset="1" stop-color="#da26ff"/></linearGradient><clipPath id="SVGHcSWxdhd236"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg> </template>
CSS
.icon-hbb-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(%23SVGHcSWxdhd236)%22%3E%3Cpath%20fill%3D%22url(%23SVGmsjlYdcy)%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-rule%3D%22evenodd%22%20d%3D%22M8.706%209.412H6.824v1.412h1.882zm-2.353%200v1.412H4.47V9.412zM4.47%2012.706v-1.412h1.882v1.412zm0%20.47v1.412h1.882v-1.411zm1.882%203.751a2.12%202.12%200%200%201-1.868-1.868h1.868zm.47%200V15.06h1.869a2.12%202.12%200%200%201-1.868%201.868m1.883-3.75v1.412H6.824v-1.412zm0-.47v-1.413H6.824v1.412zM6.824%208.94V7.073a2.12%202.12%200%200%201%201.868%201.868zm-.471%200H4.485a2.12%202.12%200%200%201%201.868-1.868zM4%209.177a2.59%202.59%200%200%201%202.353-2.58v-.009h.47v.01a2.59%202.59%200%200%201%202.353%202.579v5.647a2.588%202.588%200%200%201-5.176%200zm15.53.235h-1.883v1.412h1.882zm-2.354%200v1.412h-1.882V9.412zm-1.882%203.294v-1.412h1.883v1.412zm0%20.47v1.412h1.883v-1.411zm1.883%203.751a2.12%202.12%200%200%201-1.869-1.868h1.869zm.47%200V15.06h1.868a2.12%202.12%200%200%201-1.868%201.868m1.882-3.75v1.412h-1.882v-1.412zm0-.47v-1.413h-1.882v1.412zM17.647%208.94V7.073a2.12%202.12%200%200%201%201.868%201.868zm-.47%200h-1.869a2.12%202.12%200%200%201%201.869-1.868zm-2.354.236a2.59%202.59%200%200%201%202.354-2.58v-.009h.47v.01A2.59%202.59%200%200%201%2020%209.177v5.647a2.588%202.588%200%200%201-5.177%200zm-4.705.705h1.411v1.412h-1.411zm3.764%200h-1.411v1.412h1.411zm-1.411%202.354h1.411v1.411h-1.411zm-.942%200h-1.411v1.411h1.411z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGmsjlYdcy%22%20x1%3D%2218.118%22%20x2%3D%225.176%22%20y1%3D%226.118%22%20y2%3D%2217.412%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2336c9ff%22%2F%3E%3Cstop%20offset%3D%22.53%22%20stop-color%3D%22%237d81ff%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23da26ff%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22SVGHcSWxdhd236%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(%23SVGHcSWxdhd236)%22%3E%3Cpath%20fill%3D%22url(%23SVGmsjlYdcy)%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-rule%3D%22evenodd%22%20d%3D%22M8.706%209.412H6.824v1.412h1.882zm-2.353%200v1.412H4.47V9.412zM4.47%2012.706v-1.412h1.882v1.412zm0%20.47v1.412h1.882v-1.411zm1.882%203.751a2.12%202.12%200%200%201-1.868-1.868h1.868zm.47%200V15.06h1.869a2.12%202.12%200%200%201-1.868%201.868m1.883-3.75v1.412H6.824v-1.412zm0-.47v-1.413H6.824v1.412zM6.824%208.94V7.073a2.12%202.12%200%200%201%201.868%201.868zm-.471%200H4.485a2.12%202.12%200%200%201%201.868-1.868zM4%209.177a2.59%202.59%200%200%201%202.353-2.58v-.009h.47v.01a2.59%202.59%200%200%201%202.353%202.579v5.647a2.588%202.588%200%200%201-5.176%200zm15.53.235h-1.883v1.412h1.882zm-2.354%200v1.412h-1.882V9.412zm-1.882%203.294v-1.412h1.883v1.412zm0%20.47v1.412h1.883v-1.411zm1.883%203.751a2.12%202.12%200%200%201-1.869-1.868h1.869zm.47%200V15.06h1.868a2.12%202.12%200%200%201-1.868%201.868m1.882-3.75v1.412h-1.882v-1.412zm0-.47v-1.413h-1.882v1.412zM17.647%208.94V7.073a2.12%202.12%200%200%201%201.868%201.868zm-.47%200h-1.869a2.12%202.12%200%200%201%201.869-1.868zm-2.354.236a2.59%202.59%200%200%201%202.354-2.58v-.009h.47v.01A2.59%202.59%200%200%201%2020%209.177v5.647a2.588%202.588%200%200%201-5.177%200zm-4.705.705h1.411v1.412h-1.411zm3.764%200h-1.411v1.412h1.411zm-1.411%202.354h1.411v1.411h-1.411zm-.942%200h-1.411v1.411h1.411z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGmsjlYdcy%22%20x1%3D%2218.118%22%20x2%3D%225.176%22%20y1%3D%226.118%22%20y2%3D%2217.412%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2336c9ff%22%2F%3E%3Cstop%20offset%3D%22.53%22%20stop-color%3D%22%237d81ff%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23da26ff%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22SVGHcSWxdhd236%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/hbb-background.svg?color=%231a73e8&size=48
