metamask logo

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

Name: metamask-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 metamask 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(#SVGHcSWxdhd23)"><path fill="#fff" d="M24 0H0v24h24z"/><path fill="#ff5c16" d="m18.9 18.925l-3.434-.993l-2.59 1.504h-1.807l-2.592-1.504l-3.433.993L4 15.5l1.044-3.802L4 8.484L5.044 4.5l5.365 3.114h3.127L18.9 4.5l1.045 3.984l-1.045 3.214l1.045 3.802z"/><path fill="#ff5c16" d="m5.045 4.5l5.364 3.116l-.213 2.14zm3.433 11.001l2.36 1.747l-2.36.684zm2.172-2.888l-.454-2.856l-2.904 1.942h-.001l.009 2l1.177-1.086zM18.9 4.5l-5.364 3.116l.213 2.14zm-3.433 11.001l-2.36 1.747l2.36.684zm1.187-3.801v-.002h-.001l-2.904-1.941l-.453 2.856h2.171l1.178 1.086z"/><path fill="#e34807" d="m8.477 17.932l-3.433.993L4 15.501h4.477zm2.172-5.32l.656 4.13l-.91-2.297l-3.097-.746l1.178-1.087zm4.818 5.32l3.433.993l1.045-3.424h-4.478zm-2.171-5.32l-.656 4.13l.909-2.297l3.097-.746l-1.179-1.087z"/><path fill="#ff8d5d" d="m4 15.5l1.044-3.802H7.29l.008 2l3.098.747l.909 2.296l-.468.505l-2.36-1.747zm15.945 0L18.9 11.698h-2.245l-.009 2l-3.097.747l-.909 2.296l.467.505l2.36-1.747zm-6.409-7.886h-3.127l-.213 2.139l1.109 6.985h1.335l1.11-6.985z"/><path fill="#661800" d="M5.044 4.5L4 8.484l1.044 3.214H7.29l2.905-1.943zM10 13.441H8.982l-.553.528l1.967.474zM18.9 4.5l1.045 3.984l-1.045 3.214h-2.245l-2.906-1.943zm-4.954 8.941h1.02l.553.529l-1.97.475zm-1.071 4.632l.232-.825l-.467-.506h-1.336l-.467.506l.232.825"/><path fill="#c0c4cd" d="M12.875 18.073v1.364h-1.806v-1.364z"/><path fill="#e7ebf6" d="m8.478 17.93l2.592 1.506v-1.363l-.232-.826zm6.99 0l-2.593 1.506v-1.363l.232-.826z"/></g><defs><clipPath id="SVGHcSWxdhd23"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg>

React

import type { SVGProps } from "react";

export function TokenBrandedMetamaskBackground(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(#SVGHcSWxdhd23)"><path fill="#fff" d="M24 0H0v24h24z"/><path fill="#ff5c16" d="m18.9 18.925l-3.434-.993l-2.59 1.504h-1.807l-2.592-1.504l-3.433.993L4 15.5l1.044-3.802L4 8.484L5.044 4.5l5.365 3.114h3.127L18.9 4.5l1.045 3.984l-1.045 3.214l1.045 3.802z"/><path fill="#ff5c16" d="m5.045 4.5l5.364 3.116l-.213 2.14zm3.433 11.001l2.36 1.747l-2.36.684zm2.172-2.888l-.454-2.856l-2.904 1.942h-.001l.009 2l1.177-1.086zM18.9 4.5l-5.364 3.116l.213 2.14zm-3.433 11.001l-2.36 1.747l2.36.684zm1.187-3.801v-.002h-.001l-2.904-1.941l-.453 2.856h2.171l1.178 1.086z"/><path fill="#e34807" d="m8.477 17.932l-3.433.993L4 15.501h4.477zm2.172-5.32l.656 4.13l-.91-2.297l-3.097-.746l1.178-1.087zm4.818 5.32l3.433.993l1.045-3.424h-4.478zm-2.171-5.32l-.656 4.13l.909-2.297l3.097-.746l-1.179-1.087z"/><path fill="#ff8d5d" d="m4 15.5l1.044-3.802H7.29l.008 2l3.098.747l.909 2.296l-.468.505l-2.36-1.747zm15.945 0L18.9 11.698h-2.245l-.009 2l-3.097.747l-.909 2.296l.467.505l2.36-1.747zm-6.409-7.886h-3.127l-.213 2.139l1.109 6.985h1.335l1.11-6.985z"/><path fill="#661800" d="M5.044 4.5L4 8.484l1.044 3.214H7.29l2.905-1.943zM10 13.441H8.982l-.553.528l1.967.474zM18.9 4.5l1.045 3.984l-1.045 3.214h-2.245l-2.906-1.943zm-4.954 8.941h1.02l.553.529l-1.97.475zm-1.071 4.632l.232-.825l-.467-.506h-1.336l-.467.506l.232.825"/><path fill="#c0c4cd" d="M12.875 18.073v1.364h-1.806v-1.364z"/><path fill="#e7ebf6" d="m8.478 17.93l2.592 1.506v-1.363l-.232-.826zm6.99 0l-2.593 1.506v-1.363l.232-.826z"/></g><defs><clipPath id="SVGHcSWxdhd23"><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(#SVGHcSWxdhd23)"><path fill="#fff" d="M24 0H0v24h24z"/><path fill="#ff5c16" d="m18.9 18.925l-3.434-.993l-2.59 1.504h-1.807l-2.592-1.504l-3.433.993L4 15.5l1.044-3.802L4 8.484L5.044 4.5l5.365 3.114h3.127L18.9 4.5l1.045 3.984l-1.045 3.214l1.045 3.802z"/><path fill="#ff5c16" d="m5.045 4.5l5.364 3.116l-.213 2.14zm3.433 11.001l2.36 1.747l-2.36.684zm2.172-2.888l-.454-2.856l-2.904 1.942h-.001l.009 2l1.177-1.086zM18.9 4.5l-5.364 3.116l.213 2.14zm-3.433 11.001l-2.36 1.747l2.36.684zm1.187-3.801v-.002h-.001l-2.904-1.941l-.453 2.856h2.171l1.178 1.086z"/><path fill="#e34807" d="m8.477 17.932l-3.433.993L4 15.501h4.477zm2.172-5.32l.656 4.13l-.91-2.297l-3.097-.746l1.178-1.087zm4.818 5.32l3.433.993l1.045-3.424h-4.478zm-2.171-5.32l-.656 4.13l.909-2.297l3.097-.746l-1.179-1.087z"/><path fill="#ff8d5d" d="m4 15.5l1.044-3.802H7.29l.008 2l3.098.747l.909 2.296l-.468.505l-2.36-1.747zm15.945 0L18.9 11.698h-2.245l-.009 2l-3.097.747l-.909 2.296l.467.505l2.36-1.747zm-6.409-7.886h-3.127l-.213 2.139l1.109 6.985h1.335l1.11-6.985z"/><path fill="#661800" d="M5.044 4.5L4 8.484l1.044 3.214H7.29l2.905-1.943zM10 13.441H8.982l-.553.528l1.967.474zM18.9 4.5l1.045 3.984l-1.045 3.214h-2.245l-2.906-1.943zm-4.954 8.941h1.02l.553.529l-1.97.475zm-1.071 4.632l.232-.825l-.467-.506h-1.336l-.467.506l.232.825"/><path fill="#c0c4cd" d="M12.875 18.073v1.364h-1.806v-1.364z"/><path fill="#e7ebf6" d="m8.478 17.93l2.592 1.506v-1.363l-.232-.826zm6.99 0l-2.593 1.506v-1.363l.232-.826z"/></g><defs><clipPath id="SVGHcSWxdhd23"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg>
</template>

CSS

.icon-metamask-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(%23SVGHcSWxdhd23)%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23ff5c16%22%20d%3D%22m18.9%2018.925l-3.434-.993l-2.59%201.504h-1.807l-2.592-1.504l-3.433.993L4%2015.5l1.044-3.802L4%208.484L5.044%204.5l5.365%203.114h3.127L18.9%204.5l1.045%203.984l-1.045%203.214l1.045%203.802z%22%2F%3E%3Cpath%20fill%3D%22%23ff5c16%22%20d%3D%22m5.045%204.5l5.364%203.116l-.213%202.14zm3.433%2011.001l2.36%201.747l-2.36.684zm2.172-2.888l-.454-2.856l-2.904%201.942h-.001l.009%202l1.177-1.086zM18.9%204.5l-5.364%203.116l.213%202.14zm-3.433%2011.001l-2.36%201.747l2.36.684zm1.187-3.801v-.002h-.001l-2.904-1.941l-.453%202.856h2.171l1.178%201.086z%22%2F%3E%3Cpath%20fill%3D%22%23e34807%22%20d%3D%22m8.477%2017.932l-3.433.993L4%2015.501h4.477zm2.172-5.32l.656%204.13l-.91-2.297l-3.097-.746l1.178-1.087zm4.818%205.32l3.433.993l1.045-3.424h-4.478zm-2.171-5.32l-.656%204.13l.909-2.297l3.097-.746l-1.179-1.087z%22%2F%3E%3Cpath%20fill%3D%22%23ff8d5d%22%20d%3D%22m4%2015.5l1.044-3.802H7.29l.008%202l3.098.747l.909%202.296l-.468.505l-2.36-1.747zm15.945%200L18.9%2011.698h-2.245l-.009%202l-3.097.747l-.909%202.296l.467.505l2.36-1.747zm-6.409-7.886h-3.127l-.213%202.139l1.109%206.985h1.335l1.11-6.985z%22%2F%3E%3Cpath%20fill%3D%22%23661800%22%20d%3D%22M5.044%204.5L4%208.484l1.044%203.214H7.29l2.905-1.943zM10%2013.441H8.982l-.553.528l1.967.474zM18.9%204.5l1.045%203.984l-1.045%203.214h-2.245l-2.906-1.943zm-4.954%208.941h1.02l.553.529l-1.97.475zm-1.071%204.632l.232-.825l-.467-.506h-1.336l-.467.506l.232.825%22%2F%3E%3Cpath%20fill%3D%22%23c0c4cd%22%20d%3D%22M12.875%2018.073v1.364h-1.806v-1.364z%22%2F%3E%3Cpath%20fill%3D%22%23e7ebf6%22%20d%3D%22m8.478%2017.93l2.592%201.506v-1.363l-.232-.826zm6.99%200l-2.593%201.506v-1.363l.232-.826z%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22SVGHcSWxdhd23%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(%23SVGHcSWxdhd23)%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23ff5c16%22%20d%3D%22m18.9%2018.925l-3.434-.993l-2.59%201.504h-1.807l-2.592-1.504l-3.433.993L4%2015.5l1.044-3.802L4%208.484L5.044%204.5l5.365%203.114h3.127L18.9%204.5l1.045%203.984l-1.045%203.214l1.045%203.802z%22%2F%3E%3Cpath%20fill%3D%22%23ff5c16%22%20d%3D%22m5.045%204.5l5.364%203.116l-.213%202.14zm3.433%2011.001l2.36%201.747l-2.36.684zm2.172-2.888l-.454-2.856l-2.904%201.942h-.001l.009%202l1.177-1.086zM18.9%204.5l-5.364%203.116l.213%202.14zm-3.433%2011.001l-2.36%201.747l2.36.684zm1.187-3.801v-.002h-.001l-2.904-1.941l-.453%202.856h2.171l1.178%201.086z%22%2F%3E%3Cpath%20fill%3D%22%23e34807%22%20d%3D%22m8.477%2017.932l-3.433.993L4%2015.501h4.477zm2.172-5.32l.656%204.13l-.91-2.297l-3.097-.746l1.178-1.087zm4.818%205.32l3.433.993l1.045-3.424h-4.478zm-2.171-5.32l-.656%204.13l.909-2.297l3.097-.746l-1.179-1.087z%22%2F%3E%3Cpath%20fill%3D%22%23ff8d5d%22%20d%3D%22m4%2015.5l1.044-3.802H7.29l.008%202l3.098.747l.909%202.296l-.468.505l-2.36-1.747zm15.945%200L18.9%2011.698h-2.245l-.009%202l-3.097.747l-.909%202.296l.467.505l2.36-1.747zm-6.409-7.886h-3.127l-.213%202.139l1.109%206.985h1.335l1.11-6.985z%22%2F%3E%3Cpath%20fill%3D%22%23661800%22%20d%3D%22M5.044%204.5L4%208.484l1.044%203.214H7.29l2.905-1.943zM10%2013.441H8.982l-.553.528l1.967.474zM18.9%204.5l1.045%203.984l-1.045%203.214h-2.245l-2.906-1.943zm-4.954%208.941h1.02l.553.529l-1.97.475zm-1.071%204.632l.232-.825l-.467-.506h-1.336l-.467.506l.232.825%22%2F%3E%3Cpath%20fill%3D%22%23c0c4cd%22%20d%3D%22M12.875%2018.073v1.364h-1.806v-1.364z%22%2F%3E%3Cpath%20fill%3D%22%23e7ebf6%22%20d%3D%22m8.478%2017.93l2.592%201.506v-1.363l-.232-.826zm6.99%200l-2.593%201.506v-1.363l.232-.826z%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22SVGHcSWxdhd23%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/metamask-background.svg?color=%231a73e8&size=48