sfi logo
sfi-background from Web3 Icons Branded by 0xa3k5 · Background · MIT Free for personal and commercial use.
- Name
- sfi-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 sfi 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(#SVGHcSWxdhd105)"><path fill="#c44536" d="M24 0H0v24h24z"/><path fill="#fff" fill-rule="evenodd" d="M6.976 4A2.976 2.976 0 0 0 4 6.978v10.047A2.976 2.976 0 0 0 6.976 20h10.048A2.976 2.976 0 0 0 20 17.024V6.977A2.977 2.977 0 0 0 17.023 4zm3.956 8s.017-.03 0 3.5v2.926h2.14V15.5c0-.734.004-1.428.007-2.002c.004-.83.008-1.41-.006-1.496c.507-.184 1.037-.43 1.48-.637c.64-.3 1.282-.928 1.553-1.52c.389-.849.416-1.489.11-2.525c-.269-.908-.276-1.22-.038-1.603c.078-.126.137-.196.124-.25c-.02-.087-.23-.13-.857-.298c-.556-.149-.556-.149-.655-.017c-.332.44-.35 1.256-.045 2.205c.336 1.045.238 1.82-.306 2.422c-.243.269-.72.53-1.212.666c-.489.135-1.873.136-2.424.003c-1.018-.248-1.594-.814-1.718-1.693c-.064-.453-.013-.796.226-1.522c.24-.724.26-1.4.058-1.85c-.193-.426-.288-.397-.863-.22l-.12.038l-.697.237l.173.331c.227.434.22.7-.044 1.483c-.257.764-.303 1.287-.17 1.89c.196.878.682 1.564 1.465 2.068l.098.063c.533.344.946.61 1.72.726m-.536 4.82H7.72v1.07h2.676zm5.888 0h-2.676v1.07h2.676zm-5.888-2.141H7.72v1.07h2.676zm5.888 0h-2.676v1.07h2.676zm-5.888-2.141H7.72v1.07h2.676zm5.888 0h-2.676v1.07h2.676zm-5.323-2.298C11.3 10.26 11.89 8.41 12 8c.018.05.052.175.098.342c.179.654.536 1.957.782 1.957c.027 0 1.193-.61 1.233-.646c.01-.008-.342-.686-.781-1.505L12.5 6.5h-1l-1.003 1.658L9.7 9.655l.6.29c.33.161.628.293.661.295" clip-rule="evenodd"/></g><defs><clipPath id="SVGHcSWxdhd105"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg>
React
import type { SVGProps } from "react";
export function TokenBrandedSfiBackground(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(#SVGHcSWxdhd105)"><path fill="#c44536" d="M24 0H0v24h24z"/><path fill="#fff" fillRule="evenodd" d="M6.976 4A2.976 2.976 0 0 0 4 6.978v10.047A2.976 2.976 0 0 0 6.976 20h10.048A2.976 2.976 0 0 0 20 17.024V6.977A2.977 2.977 0 0 0 17.023 4zm3.956 8s.017-.03 0 3.5v2.926h2.14V15.5c0-.734.004-1.428.007-2.002c.004-.83.008-1.41-.006-1.496c.507-.184 1.037-.43 1.48-.637c.64-.3 1.282-.928 1.553-1.52c.389-.849.416-1.489.11-2.525c-.269-.908-.276-1.22-.038-1.603c.078-.126.137-.196.124-.25c-.02-.087-.23-.13-.857-.298c-.556-.149-.556-.149-.655-.017c-.332.44-.35 1.256-.045 2.205c.336 1.045.238 1.82-.306 2.422c-.243.269-.72.53-1.212.666c-.489.135-1.873.136-2.424.003c-1.018-.248-1.594-.814-1.718-1.693c-.064-.453-.013-.796.226-1.522c.24-.724.26-1.4.058-1.85c-.193-.426-.288-.397-.863-.22l-.12.038l-.697.237l.173.331c.227.434.22.7-.044 1.483c-.257.764-.303 1.287-.17 1.89c.196.878.682 1.564 1.465 2.068l.098.063c.533.344.946.61 1.72.726m-.536 4.82H7.72v1.07h2.676zm5.888 0h-2.676v1.07h2.676zm-5.888-2.141H7.72v1.07h2.676zm5.888 0h-2.676v1.07h2.676zm-5.888-2.141H7.72v1.07h2.676zm5.888 0h-2.676v1.07h2.676zm-5.323-2.298C11.3 10.26 11.89 8.41 12 8c.018.05.052.175.098.342c.179.654.536 1.957.782 1.957c.027 0 1.193-.61 1.233-.646c.01-.008-.342-.686-.781-1.505L12.5 6.5h-1l-1.003 1.658L9.7 9.655l.6.29c.33.161.628.293.661.295" clipRule="evenodd"/></g><defs><clipPath id="SVGHcSWxdhd105"><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(#SVGHcSWxdhd105)"><path fill="#c44536" d="M24 0H0v24h24z"/><path fill="#fff" fill-rule="evenodd" d="M6.976 4A2.976 2.976 0 0 0 4 6.978v10.047A2.976 2.976 0 0 0 6.976 20h10.048A2.976 2.976 0 0 0 20 17.024V6.977A2.977 2.977 0 0 0 17.023 4zm3.956 8s.017-.03 0 3.5v2.926h2.14V15.5c0-.734.004-1.428.007-2.002c.004-.83.008-1.41-.006-1.496c.507-.184 1.037-.43 1.48-.637c.64-.3 1.282-.928 1.553-1.52c.389-.849.416-1.489.11-2.525c-.269-.908-.276-1.22-.038-1.603c.078-.126.137-.196.124-.25c-.02-.087-.23-.13-.857-.298c-.556-.149-.556-.149-.655-.017c-.332.44-.35 1.256-.045 2.205c.336 1.045.238 1.82-.306 2.422c-.243.269-.72.53-1.212.666c-.489.135-1.873.136-2.424.003c-1.018-.248-1.594-.814-1.718-1.693c-.064-.453-.013-.796.226-1.522c.24-.724.26-1.4.058-1.85c-.193-.426-.288-.397-.863-.22l-.12.038l-.697.237l.173.331c.227.434.22.7-.044 1.483c-.257.764-.303 1.287-.17 1.89c.196.878.682 1.564 1.465 2.068l.098.063c.533.344.946.61 1.72.726m-.536 4.82H7.72v1.07h2.676zm5.888 0h-2.676v1.07h2.676zm-5.888-2.141H7.72v1.07h2.676zm5.888 0h-2.676v1.07h2.676zm-5.888-2.141H7.72v1.07h2.676zm5.888 0h-2.676v1.07h2.676zm-5.323-2.298C11.3 10.26 11.89 8.41 12 8c.018.05.052.175.098.342c.179.654.536 1.957.782 1.957c.027 0 1.193-.61 1.233-.646c.01-.008-.342-.686-.781-1.505L12.5 6.5h-1l-1.003 1.658L9.7 9.655l.6.29c.33.161.628.293.661.295" clip-rule="evenodd"/></g><defs><clipPath id="SVGHcSWxdhd105"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg> </template>
CSS
.icon-sfi-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(%23SVGHcSWxdhd105)%22%3E%3Cpath%20fill%3D%22%23c44536%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-rule%3D%22evenodd%22%20d%3D%22M6.976%204A2.976%202.976%200%200%200%204%206.978v10.047A2.976%202.976%200%200%200%206.976%2020h10.048A2.976%202.976%200%200%200%2020%2017.024V6.977A2.977%202.977%200%200%200%2017.023%204zm3.956%208s.017-.03%200%203.5v2.926h2.14V15.5c0-.734.004-1.428.007-2.002c.004-.83.008-1.41-.006-1.496c.507-.184%201.037-.43%201.48-.637c.64-.3%201.282-.928%201.553-1.52c.389-.849.416-1.489.11-2.525c-.269-.908-.276-1.22-.038-1.603c.078-.126.137-.196.124-.25c-.02-.087-.23-.13-.857-.298c-.556-.149-.556-.149-.655-.017c-.332.44-.35%201.256-.045%202.205c.336%201.045.238%201.82-.306%202.422c-.243.269-.72.53-1.212.666c-.489.135-1.873.136-2.424.003c-1.018-.248-1.594-.814-1.718-1.693c-.064-.453-.013-.796.226-1.522c.24-.724.26-1.4.058-1.85c-.193-.426-.288-.397-.863-.22l-.12.038l-.697.237l.173.331c.227.434.22.7-.044%201.483c-.257.764-.303%201.287-.17%201.89c.196.878.682%201.564%201.465%202.068l.098.063c.533.344.946.61%201.72.726m-.536%204.82H7.72v1.07h2.676zm5.888%200h-2.676v1.07h2.676zm-5.888-2.141H7.72v1.07h2.676zm5.888%200h-2.676v1.07h2.676zm-5.888-2.141H7.72v1.07h2.676zm5.888%200h-2.676v1.07h2.676zm-5.323-2.298C11.3%2010.26%2011.89%208.41%2012%208c.018.05.052.175.098.342c.179.654.536%201.957.782%201.957c.027%200%201.193-.61%201.233-.646c.01-.008-.342-.686-.781-1.505L12.5%206.5h-1l-1.003%201.658L9.7%209.655l.6.29c.33.161.628.293.661.295%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22SVGHcSWxdhd105%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(%23SVGHcSWxdhd105)%22%3E%3Cpath%20fill%3D%22%23c44536%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-rule%3D%22evenodd%22%20d%3D%22M6.976%204A2.976%202.976%200%200%200%204%206.978v10.047A2.976%202.976%200%200%200%206.976%2020h10.048A2.976%202.976%200%200%200%2020%2017.024V6.977A2.977%202.977%200%200%200%2017.023%204zm3.956%208s.017-.03%200%203.5v2.926h2.14V15.5c0-.734.004-1.428.007-2.002c.004-.83.008-1.41-.006-1.496c.507-.184%201.037-.43%201.48-.637c.64-.3%201.282-.928%201.553-1.52c.389-.849.416-1.489.11-2.525c-.269-.908-.276-1.22-.038-1.603c.078-.126.137-.196.124-.25c-.02-.087-.23-.13-.857-.298c-.556-.149-.556-.149-.655-.017c-.332.44-.35%201.256-.045%202.205c.336%201.045.238%201.82-.306%202.422c-.243.269-.72.53-1.212.666c-.489.135-1.873.136-2.424.003c-1.018-.248-1.594-.814-1.718-1.693c-.064-.453-.013-.796.226-1.522c.24-.724.26-1.4.058-1.85c-.193-.426-.288-.397-.863-.22l-.12.038l-.697.237l.173.331c.227.434.22.7-.044%201.483c-.257.764-.303%201.287-.17%201.89c.196.878.682%201.564%201.465%202.068l.098.063c.533.344.946.61%201.72.726m-.536%204.82H7.72v1.07h2.676zm5.888%200h-2.676v1.07h2.676zm-5.888-2.141H7.72v1.07h2.676zm5.888%200h-2.676v1.07h2.676zm-5.888-2.141H7.72v1.07h2.676zm5.888%200h-2.676v1.07h2.676zm-5.323-2.298C11.3%2010.26%2011.89%208.41%2012%208c.018.05.052.175.098.342c.179.654.536%201.957.782%201.957c.027%200%201.193-.61%201.233-.646c.01-.008-.342-.686-.781-1.505L12.5%206.5h-1l-1.003%201.658L9.7%209.655l.6.29c.33.161.628.293.661.295%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22SVGHcSWxdhd105%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/sfi-background.svg?color=%231a73e8&size=48
