moonbeam logo
moonbeam-background from Web3 Icons Branded by 0xa3k5 · Background · MIT Free for personal and commercial use.
- Name
- moonbeam-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 moonbeam 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(#SVGHcSWxdhd2)"><path fill="#cb1f7a" d="M24 0H0v24h24z"/><path fill="#fff" d="M8.757 10.184a4.93 4.93 0 0 1 4.973-4.886a4.93 4.93 0 0 1 4.973 4.886a.303.303 0 0 1-.303.303H9.06a.303.303 0 0 1-.303-.303m-1.298 1.6c0-.238.16-.432.36-.432h11.39c.199 0 .358.194.358.431c0 .239-.16.433-.358.433H7.819c-.2 0-.36-.194-.36-.433M5.297 13.08c0-.238.165-.432.363-.432h8.355c.2 0 .363.194.363.432s-.164.433-.363.433H5.66c-.198 0-.363-.195-.363-.433m2.526.865c-.2 0-.364.194-.364.433c0 .238.165.431.364.431h10.084c.2 0 .364-.193.364-.431c0-.239-.165-.433-.364-.433zm-2.093 1.73c0-.238.168-.433.372-.433h4.013c.203 0 .371.195.371.432c0 .238-.168.434-.371.434H6.102c-.204 0-.372-.196-.372-.434m7.269.865c-.195 0-.35.194-.35.432s.155.433.35.433h4.925c.195 0 .35-.195.35-.433s-.155-.432-.35-.432h-4.93zm-3.377 1.73c0-.239.155-.434.35-.434h4.926c.194 0 .35.195.35.433s-.156.432-.35.432h-4.93c-.195 0-.35-.194-.35-.432zm1.664-3.028c-.202 0-.367.195-.367.432c0 .238.165.434.367.434h8.347c.203 0 .367-.196.367-.434c0-.237-.165-.432-.367-.432zm-5.123-3.46a.432.432 0 1 1 .863-.042a.432.432 0 0 1-.863.041m-1.73.864a.433.433 0 1 0 0 .866a.433.433 0 0 0 0-.866m1.73 1.73a.433.433 0 1 1 .864-.041a.433.433 0 0 1-.864.041m-1.298.866a.433.433 0 1 0 0 .866a.433.433 0 0 0 0-.866m6.486 1.73a.433.433 0 1 1 .865 0a.433.433 0 0 1-.865 0m-2.594.864a.433.433 0 1 0-.042.864a.433.433 0 0 0 .042-.864"/></g><defs><clipPath id="SVGHcSWxdhd2"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg>
React
import type { SVGProps } from "react";
export function TokenBrandedMoonbeamBackground(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(#SVGHcSWxdhd2)"><path fill="#cb1f7a" d="M24 0H0v24h24z"/><path fill="#fff" d="M8.757 10.184a4.93 4.93 0 0 1 4.973-4.886a4.93 4.93 0 0 1 4.973 4.886a.303.303 0 0 1-.303.303H9.06a.303.303 0 0 1-.303-.303m-1.298 1.6c0-.238.16-.432.36-.432h11.39c.199 0 .358.194.358.431c0 .239-.16.433-.358.433H7.819c-.2 0-.36-.194-.36-.433M5.297 13.08c0-.238.165-.432.363-.432h8.355c.2 0 .363.194.363.432s-.164.433-.363.433H5.66c-.198 0-.363-.195-.363-.433m2.526.865c-.2 0-.364.194-.364.433c0 .238.165.431.364.431h10.084c.2 0 .364-.193.364-.431c0-.239-.165-.433-.364-.433zm-2.093 1.73c0-.238.168-.433.372-.433h4.013c.203 0 .371.195.371.432c0 .238-.168.434-.371.434H6.102c-.204 0-.372-.196-.372-.434m7.269.865c-.195 0-.35.194-.35.432s.155.433.35.433h4.925c.195 0 .35-.195.35-.433s-.155-.432-.35-.432h-4.93zm-3.377 1.73c0-.239.155-.434.35-.434h4.926c.194 0 .35.195.35.433s-.156.432-.35.432h-4.93c-.195 0-.35-.194-.35-.432zm1.664-3.028c-.202 0-.367.195-.367.432c0 .238.165.434.367.434h8.347c.203 0 .367-.196.367-.434c0-.237-.165-.432-.367-.432zm-5.123-3.46a.432.432 0 1 1 .863-.042a.432.432 0 0 1-.863.041m-1.73.864a.433.433 0 1 0 0 .866a.433.433 0 0 0 0-.866m1.73 1.73a.433.433 0 1 1 .864-.041a.433.433 0 0 1-.864.041m-1.298.866a.433.433 0 1 0 0 .866a.433.433 0 0 0 0-.866m6.486 1.73a.433.433 0 1 1 .865 0a.433.433 0 0 1-.865 0m-2.594.864a.433.433 0 1 0-.042.864a.433.433 0 0 0 .042-.864"/></g><defs><clipPath id="SVGHcSWxdhd2"><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(#SVGHcSWxdhd2)"><path fill="#cb1f7a" d="M24 0H0v24h24z"/><path fill="#fff" d="M8.757 10.184a4.93 4.93 0 0 1 4.973-4.886a4.93 4.93 0 0 1 4.973 4.886a.303.303 0 0 1-.303.303H9.06a.303.303 0 0 1-.303-.303m-1.298 1.6c0-.238.16-.432.36-.432h11.39c.199 0 .358.194.358.431c0 .239-.16.433-.358.433H7.819c-.2 0-.36-.194-.36-.433M5.297 13.08c0-.238.165-.432.363-.432h8.355c.2 0 .363.194.363.432s-.164.433-.363.433H5.66c-.198 0-.363-.195-.363-.433m2.526.865c-.2 0-.364.194-.364.433c0 .238.165.431.364.431h10.084c.2 0 .364-.193.364-.431c0-.239-.165-.433-.364-.433zm-2.093 1.73c0-.238.168-.433.372-.433h4.013c.203 0 .371.195.371.432c0 .238-.168.434-.371.434H6.102c-.204 0-.372-.196-.372-.434m7.269.865c-.195 0-.35.194-.35.432s.155.433.35.433h4.925c.195 0 .35-.195.35-.433s-.155-.432-.35-.432h-4.93zm-3.377 1.73c0-.239.155-.434.35-.434h4.926c.194 0 .35.195.35.433s-.156.432-.35.432h-4.93c-.195 0-.35-.194-.35-.432zm1.664-3.028c-.202 0-.367.195-.367.432c0 .238.165.434.367.434h8.347c.203 0 .367-.196.367-.434c0-.237-.165-.432-.367-.432zm-5.123-3.46a.432.432 0 1 1 .863-.042a.432.432 0 0 1-.863.041m-1.73.864a.433.433 0 1 0 0 .866a.433.433 0 0 0 0-.866m1.73 1.73a.433.433 0 1 1 .864-.041a.433.433 0 0 1-.864.041m-1.298.866a.433.433 0 1 0 0 .866a.433.433 0 0 0 0-.866m6.486 1.73a.433.433 0 1 1 .865 0a.433.433 0 0 1-.865 0m-2.594.864a.433.433 0 1 0-.042.864a.433.433 0 0 0 .042-.864"/></g><defs><clipPath id="SVGHcSWxdhd2"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg> </template>
CSS
.icon-moonbeam-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(%23SVGHcSWxdhd2)%22%3E%3Cpath%20fill%3D%22%23cb1f7a%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M8.757%2010.184a4.93%204.93%200%200%201%204.973-4.886a4.93%204.93%200%200%201%204.973%204.886a.303.303%200%200%201-.303.303H9.06a.303.303%200%200%201-.303-.303m-1.298%201.6c0-.238.16-.432.36-.432h11.39c.199%200%20.358.194.358.431c0%20.239-.16.433-.358.433H7.819c-.2%200-.36-.194-.36-.433M5.297%2013.08c0-.238.165-.432.363-.432h8.355c.2%200%20.363.194.363.432s-.164.433-.363.433H5.66c-.198%200-.363-.195-.363-.433m2.526.865c-.2%200-.364.194-.364.433c0%20.238.165.431.364.431h10.084c.2%200%20.364-.193.364-.431c0-.239-.165-.433-.364-.433zm-2.093%201.73c0-.238.168-.433.372-.433h4.013c.203%200%20.371.195.371.432c0%20.238-.168.434-.371.434H6.102c-.204%200-.372-.196-.372-.434m7.269.865c-.195%200-.35.194-.35.432s.155.433.35.433h4.925c.195%200%20.35-.195.35-.433s-.155-.432-.35-.432h-4.93zm-3.377%201.73c0-.239.155-.434.35-.434h4.926c.194%200%20.35.195.35.433s-.156.432-.35.432h-4.93c-.195%200-.35-.194-.35-.432zm1.664-3.028c-.202%200-.367.195-.367.432c0%20.238.165.434.367.434h8.347c.203%200%20.367-.196.367-.434c0-.237-.165-.432-.367-.432zm-5.123-3.46a.432.432%200%201%201%20.863-.042a.432.432%200%200%201-.863.041m-1.73.864a.433.433%200%201%200%200%20.866a.433.433%200%200%200%200-.866m1.73%201.73a.433.433%200%201%201%20.864-.041a.433.433%200%200%201-.864.041m-1.298.866a.433.433%200%201%200%200%20.866a.433.433%200%200%200%200-.866m6.486%201.73a.433.433%200%201%201%20.865%200a.433.433%200%200%201-.865%200m-2.594.864a.433.433%200%201%200-.042.864a.433.433%200%200%200%20.042-.864%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22SVGHcSWxdhd2%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(%23SVGHcSWxdhd2)%22%3E%3Cpath%20fill%3D%22%23cb1f7a%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M8.757%2010.184a4.93%204.93%200%200%201%204.973-4.886a4.93%204.93%200%200%201%204.973%204.886a.303.303%200%200%201-.303.303H9.06a.303.303%200%200%201-.303-.303m-1.298%201.6c0-.238.16-.432.36-.432h11.39c.199%200%20.358.194.358.431c0%20.239-.16.433-.358.433H7.819c-.2%200-.36-.194-.36-.433M5.297%2013.08c0-.238.165-.432.363-.432h8.355c.2%200%20.363.194.363.432s-.164.433-.363.433H5.66c-.198%200-.363-.195-.363-.433m2.526.865c-.2%200-.364.194-.364.433c0%20.238.165.431.364.431h10.084c.2%200%20.364-.193.364-.431c0-.239-.165-.433-.364-.433zm-2.093%201.73c0-.238.168-.433.372-.433h4.013c.203%200%20.371.195.371.432c0%20.238-.168.434-.371.434H6.102c-.204%200-.372-.196-.372-.434m7.269.865c-.195%200-.35.194-.35.432s.155.433.35.433h4.925c.195%200%20.35-.195.35-.433s-.155-.432-.35-.432h-4.93zm-3.377%201.73c0-.239.155-.434.35-.434h4.926c.194%200%20.35.195.35.433s-.156.432-.35.432h-4.93c-.195%200-.35-.194-.35-.432zm1.664-3.028c-.202%200-.367.195-.367.432c0%20.238.165.434.367.434h8.347c.203%200%20.367-.196.367-.434c0-.237-.165-.432-.367-.432zm-5.123-3.46a.432.432%200%201%201%20.863-.042a.432.432%200%200%201-.863.041m-1.73.864a.433.433%200%201%200%200%20.866a.433.433%200%200%200%200-.866m1.73%201.73a.433.433%200%201%201%20.864-.041a.433.433%200%200%201-.864.041m-1.298.866a.433.433%200%201%200%200%20.866a.433.433%200%200%200%200-.866m6.486%201.73a.433.433%200%201%201%20.865%200a.433.433%200%200%201-.865%200m-2.594.864a.433.433%200%201%200-.042.864a.433.433%200%200%200%20.042-.864%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22SVGHcSWxdhd2%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/moonbeam-background.svg?color=%231a73e8&size=48
