front logo
front from Web3 Icons Branded by 0xa3k5 · Branded · MIT Free for personal and commercial use.
- Name
- front
- Set
- Web3 Icons Branded
- Style
- Branded
- Viewbox
- 24×24
- License
- MIT
1 other variant in Web3 Icons Branded
The same logo in other sets
Use the front logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="#fff" d="m18.187 3l-.618 1.654c-1.603 4.078-2.847 6.018-4.163 6.018c-.815 0-1.4-.382-1.969-.916c-.421-.4-.596-.501-1-.501c-.209 0-.586.281-1.07.928a15.6 15.6 0 0 0-1.665 2.942h5.67l-.81 1.688H7.5V21H5.813V3zm-2.25 1.687L7.5 4.671v6.001c1.057-1.9 2.74-4.06 4.849-2.143c.31.287.596.62 1.052.62c.37 0 1.305-1.424 2.536-4.462"/></svg>
React
import type { SVGProps } from "react";
export function TokenBrandedFront(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="#fff" d="m18.187 3l-.618 1.654c-1.603 4.078-2.847 6.018-4.163 6.018c-.815 0-1.4-.382-1.969-.916c-.421-.4-.596-.501-1-.501c-.209 0-.586.281-1.07.928a15.6 15.6 0 0 0-1.665 2.942h5.67l-.81 1.688H7.5V21H5.813V3zm-2.25 1.687L7.5 4.671v6.001c1.057-1.9 2.74-4.06 4.849-2.143c.31.287.596.62 1.052.62c.37 0 1.305-1.424 2.536-4.462"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="#fff" d="m18.187 3l-.618 1.654c-1.603 4.078-2.847 6.018-4.163 6.018c-.815 0-1.4-.382-1.969-.916c-.421-.4-.596-.501-1-.501c-.209 0-.586.281-1.07.928a15.6 15.6 0 0 0-1.665 2.942h5.67l-.81 1.688H7.5V21H5.813V3zm-2.25 1.687L7.5 4.671v6.001c1.057-1.9 2.74-4.06 4.849-2.143c.31.287.596.62 1.052.62c.37 0 1.305-1.424 2.536-4.462"/></svg> </template>
CSS
.icon-front {
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%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m18.187%203l-.618%201.654c-1.603%204.078-2.847%206.018-4.163%206.018c-.815%200-1.4-.382-1.969-.916c-.421-.4-.596-.501-1-.501c-.209%200-.586.281-1.07.928a15.6%2015.6%200%200%200-1.665%202.942h5.67l-.81%201.688H7.5V21H5.813V3zm-2.25%201.687L7.5%204.671v6.001c1.057-1.9%202.74-4.06%204.849-2.143c.31.287.596.62%201.052.62c.37%200%201.305-1.424%202.536-4.462%22%2F%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%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m18.187%203l-.618%201.654c-1.603%204.078-2.847%206.018-4.163%206.018c-.815%200-1.4-.382-1.969-.916c-.421-.4-.596-.501-1-.501c-.209%200-.586.281-1.07.928a15.6%2015.6%200%200%200-1.665%202.942h5.67l-.81%201.688H7.5V21H5.813V3zm-2.25%201.687L7.5%204.671v6.001c1.057-1.9%202.74-4.06%204.849-2.143c.31.287.596.62%201.052.62c.37%200%201.305-1.424%202.536-4.462%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/token-branded/front.svg?color=%231a73e8&size=48
