shft logo
shft-background from Web3 Icons Branded by 0xa3k5 · Background · MIT Free for personal and commercial use.
- Name
- shft-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 shft 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(#SVGHcSWxdhd98)"><path fill="#662c5e" d="M24 0H0v24h24z"/><path fill="#fff" d="M17.053 11.386v4.012C16.917 17.996 14.702 20 12 20s-4.918-2.034-5.052-4.631v-.072a.632.632 0 0 1 1.263 0v.215c.21 1.848 1.84 3.225 3.79 3.225s3.578-1.31 3.788-3.158v-3.692l-2.105-2.05v-.708c0-.905-.758-1.76-1.684-1.76s-1.684.855-1.684 1.76v2.004l2.316 2.303v1.693c0 .337-.282.66-.632.66s-.631-.32-.631-.66v-1.18l-2.106-2.117v-3.2C9.373 7.255 10.56 6.106 12 6.106a2.77 2.77 0 0 1 2.737 2.526v.476l2.315 2.274z"/><path fill="#fff" d="M16.42 8.926c.35 0 .637-.286.59-.631A5.05 5.05 0 0 0 12 4C9.213 4 6.948 6.202 6.948 8.926v3.671l2.315 2.283v.454A2.804 2.804 0 0 0 12 17.894a2.774 2.774 0 0 0 2.737-2.526v-3.032l-2.105-2.084V8.838a.63.63 0 0 0-.64-.623a.63.63 0 0 0-.623.64v1.89l2.315 2.316v2.042c-.017.896-.766 1.528-1.684 1.528s-1.663-.665-1.675-1.558h-.009v-.91l-2.105-2.037v-3.2c0-2.042 1.697-3.663 3.79-3.663a3.764 3.764 0 0 1 3.734 3.032c.059.345.337.631.686.631"/></g><defs><clipPath id="SVGHcSWxdhd98"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg>
React
import type { SVGProps } from "react";
export function TokenBrandedShftBackground(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(#SVGHcSWxdhd98)"><path fill="#662c5e" d="M24 0H0v24h24z"/><path fill="#fff" d="M17.053 11.386v4.012C16.917 17.996 14.702 20 12 20s-4.918-2.034-5.052-4.631v-.072a.632.632 0 0 1 1.263 0v.215c.21 1.848 1.84 3.225 3.79 3.225s3.578-1.31 3.788-3.158v-3.692l-2.105-2.05v-.708c0-.905-.758-1.76-1.684-1.76s-1.684.855-1.684 1.76v2.004l2.316 2.303v1.693c0 .337-.282.66-.632.66s-.631-.32-.631-.66v-1.18l-2.106-2.117v-3.2C9.373 7.255 10.56 6.106 12 6.106a2.77 2.77 0 0 1 2.737 2.526v.476l2.315 2.274z"/><path fill="#fff" d="M16.42 8.926c.35 0 .637-.286.59-.631A5.05 5.05 0 0 0 12 4C9.213 4 6.948 6.202 6.948 8.926v3.671l2.315 2.283v.454A2.804 2.804 0 0 0 12 17.894a2.774 2.774 0 0 0 2.737-2.526v-3.032l-2.105-2.084V8.838a.63.63 0 0 0-.64-.623a.63.63 0 0 0-.623.64v1.89l2.315 2.316v2.042c-.017.896-.766 1.528-1.684 1.528s-1.663-.665-1.675-1.558h-.009v-.91l-2.105-2.037v-3.2c0-2.042 1.697-3.663 3.79-3.663a3.764 3.764 0 0 1 3.734 3.032c.059.345.337.631.686.631"/></g><defs><clipPath id="SVGHcSWxdhd98"><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(#SVGHcSWxdhd98)"><path fill="#662c5e" d="M24 0H0v24h24z"/><path fill="#fff" d="M17.053 11.386v4.012C16.917 17.996 14.702 20 12 20s-4.918-2.034-5.052-4.631v-.072a.632.632 0 0 1 1.263 0v.215c.21 1.848 1.84 3.225 3.79 3.225s3.578-1.31 3.788-3.158v-3.692l-2.105-2.05v-.708c0-.905-.758-1.76-1.684-1.76s-1.684.855-1.684 1.76v2.004l2.316 2.303v1.693c0 .337-.282.66-.632.66s-.631-.32-.631-.66v-1.18l-2.106-2.117v-3.2C9.373 7.255 10.56 6.106 12 6.106a2.77 2.77 0 0 1 2.737 2.526v.476l2.315 2.274z"/><path fill="#fff" d="M16.42 8.926c.35 0 .637-.286.59-.631A5.05 5.05 0 0 0 12 4C9.213 4 6.948 6.202 6.948 8.926v3.671l2.315 2.283v.454A2.804 2.804 0 0 0 12 17.894a2.774 2.774 0 0 0 2.737-2.526v-3.032l-2.105-2.084V8.838a.63.63 0 0 0-.64-.623a.63.63 0 0 0-.623.64v1.89l2.315 2.316v2.042c-.017.896-.766 1.528-1.684 1.528s-1.663-.665-1.675-1.558h-.009v-.91l-2.105-2.037v-3.2c0-2.042 1.697-3.663 3.79-3.663a3.764 3.764 0 0 1 3.734 3.032c.059.345.337.631.686.631"/></g><defs><clipPath id="SVGHcSWxdhd98"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg> </template>
CSS
.icon-shft-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(%23SVGHcSWxdhd98)%22%3E%3Cpath%20fill%3D%22%23662c5e%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M17.053%2011.386v4.012C16.917%2017.996%2014.702%2020%2012%2020s-4.918-2.034-5.052-4.631v-.072a.632.632%200%200%201%201.263%200v.215c.21%201.848%201.84%203.225%203.79%203.225s3.578-1.31%203.788-3.158v-3.692l-2.105-2.05v-.708c0-.905-.758-1.76-1.684-1.76s-1.684.855-1.684%201.76v2.004l2.316%202.303v1.693c0%20.337-.282.66-.632.66s-.631-.32-.631-.66v-1.18l-2.106-2.117v-3.2C9.373%207.255%2010.56%206.106%2012%206.106a2.77%202.77%200%200%201%202.737%202.526v.476l2.315%202.274z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M16.42%208.926c.35%200%20.637-.286.59-.631A5.05%205.05%200%200%200%2012%204C9.213%204%206.948%206.202%206.948%208.926v3.671l2.315%202.283v.454A2.804%202.804%200%200%200%2012%2017.894a2.774%202.774%200%200%200%202.737-2.526v-3.032l-2.105-2.084V8.838a.63.63%200%200%200-.64-.623a.63.63%200%200%200-.623.64v1.89l2.315%202.316v2.042c-.017.896-.766%201.528-1.684%201.528s-1.663-.665-1.675-1.558h-.009v-.91l-2.105-2.037v-3.2c0-2.042%201.697-3.663%203.79-3.663a3.764%203.764%200%200%201%203.734%203.032c.059.345.337.631.686.631%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22SVGHcSWxdhd98%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(%23SVGHcSWxdhd98)%22%3E%3Cpath%20fill%3D%22%23662c5e%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M17.053%2011.386v4.012C16.917%2017.996%2014.702%2020%2012%2020s-4.918-2.034-5.052-4.631v-.072a.632.632%200%200%201%201.263%200v.215c.21%201.848%201.84%203.225%203.79%203.225s3.578-1.31%203.788-3.158v-3.692l-2.105-2.05v-.708c0-.905-.758-1.76-1.684-1.76s-1.684.855-1.684%201.76v2.004l2.316%202.303v1.693c0%20.337-.282.66-.632.66s-.631-.32-.631-.66v-1.18l-2.106-2.117v-3.2C9.373%207.255%2010.56%206.106%2012%206.106a2.77%202.77%200%200%201%202.737%202.526v.476l2.315%202.274z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M16.42%208.926c.35%200%20.637-.286.59-.631A5.05%205.05%200%200%200%2012%204C9.213%204%206.948%206.202%206.948%208.926v3.671l2.315%202.283v.454A2.804%202.804%200%200%200%2012%2017.894a2.774%202.774%200%200%200%202.737-2.526v-3.032l-2.105-2.084V8.838a.63.63%200%200%200-.64-.623a.63.63%200%200%200-.623.64v1.89l2.315%202.316v2.042c-.017.896-.766%201.528-1.684%201.528s-1.663-.665-1.675-1.558h-.009v-.91l-2.105-2.037v-3.2c0-2.042%201.697-3.663%203.79-3.663a3.764%203.764%200%200%201%203.734%203.032c.059.345.337.631.686.631%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22SVGHcSWxdhd98%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/shft-background.svg?color=%231a73e8&size=48
