fluid logo
fluid-background from Web3 Icons Branded by 0xa3k5 · Background · MIT Free for personal and commercial use.
- Name
- fluid-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 fluid 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(#SVGHcSWxdhd274)"><path fill="#38aade" d="M24 0H0v24h24z"/><path fill="#fff" d="M17.174 8.535c0-1.289-.6-2.617-.824-3.121c.81.586 3.645 2.205 3.645 7.091c0 5.438-5.128 7.26-7.697 7.493H7.296V18.86c0-3.344 3.756-4.517 6.446-5.695c2.686-1.173 3.437-3.01 3.437-4.629z"/><path fill="#fff" d="M7.297 19.9v-1.042q-.002-.306.038-.591c1.319-2.705 4.038-3.456 4.78-3.558c.775-.111 4.565-.882 6.335-1.803c.954-.494 1.294-1.537 1.362-2.424c.116.602.184 1.275.184 2.022a7.4 7.4 0 0 1-.35 2.302l-7.163 5.118l-.3.073H7.407a1 1 0 0 1-.116-.097z"/><path fill="#fff" d="M19.995 12.67c-.107 5.307-5.157 7.096-7.697 7.329H7.296v-.267l.039-.32c.591-3.82 5.598-4.483 9.059-4.629c2.18-.097 3.213-1.216 3.606-2.113zM4 11.264v5.913c1.028-2.19 4.256-3.504 5.976-4.052c1.726-.548 3.432-1.24 3.432-2.007c0-.765-2.35-1.056-2.35-1.822c0-.33.499-1.095 1.526-1.75c1.028-.659 2.235-1.716 2.235-2.409c0-.964-2.177-1.158-3.262-1.134C6.18 4.003 4 9.19 4 11.263"/><path fill="#fff" d="M4 17.177v-5.914c0-1.114.63-3.121 2.04-4.745c2.938-1.163 7.276-2.666 7.276-1.822c0 .97-1.396 1.89-3.238 3.102c-.45.3-.93.61-1.42.95c-2.496 1.716-3.34 2.734-3.34 4.343c0 .95.272 1.638.51 2.03c-.786.573-1.455 1.256-1.828 2.056"/><path fill="#fff" d="M12.725 4.05c.29.19.518.403.518.612c0 .508-.882 1.643-3.557 2.845C7.015 8.709 4.015 10.599 4 12.49v-1.227c0-2.074 2.186-7.26 7.557-7.26c.32-.005.736.004 1.163.048z"/></g><defs><clipPath id="SVGHcSWxdhd274"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg>
React
import type { SVGProps } from "react";
export function TokenBrandedFluidBackground(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(#SVGHcSWxdhd274)"><path fill="#38aade" d="M24 0H0v24h24z"/><path fill="#fff" d="M17.174 8.535c0-1.289-.6-2.617-.824-3.121c.81.586 3.645 2.205 3.645 7.091c0 5.438-5.128 7.26-7.697 7.493H7.296V18.86c0-3.344 3.756-4.517 6.446-5.695c2.686-1.173 3.437-3.01 3.437-4.629z"/><path fill="#fff" d="M7.297 19.9v-1.042q-.002-.306.038-.591c1.319-2.705 4.038-3.456 4.78-3.558c.775-.111 4.565-.882 6.335-1.803c.954-.494 1.294-1.537 1.362-2.424c.116.602.184 1.275.184 2.022a7.4 7.4 0 0 1-.35 2.302l-7.163 5.118l-.3.073H7.407a1 1 0 0 1-.116-.097z"/><path fill="#fff" d="M19.995 12.67c-.107 5.307-5.157 7.096-7.697 7.329H7.296v-.267l.039-.32c.591-3.82 5.598-4.483 9.059-4.629c2.18-.097 3.213-1.216 3.606-2.113zM4 11.264v5.913c1.028-2.19 4.256-3.504 5.976-4.052c1.726-.548 3.432-1.24 3.432-2.007c0-.765-2.35-1.056-2.35-1.822c0-.33.499-1.095 1.526-1.75c1.028-.659 2.235-1.716 2.235-2.409c0-.964-2.177-1.158-3.262-1.134C6.18 4.003 4 9.19 4 11.263"/><path fill="#fff" d="M4 17.177v-5.914c0-1.114.63-3.121 2.04-4.745c2.938-1.163 7.276-2.666 7.276-1.822c0 .97-1.396 1.89-3.238 3.102c-.45.3-.93.61-1.42.95c-2.496 1.716-3.34 2.734-3.34 4.343c0 .95.272 1.638.51 2.03c-.786.573-1.455 1.256-1.828 2.056"/><path fill="#fff" d="M12.725 4.05c.29.19.518.403.518.612c0 .508-.882 1.643-3.557 2.845C7.015 8.709 4.015 10.599 4 12.49v-1.227c0-2.074 2.186-7.26 7.557-7.26c.32-.005.736.004 1.163.048z"/></g><defs><clipPath id="SVGHcSWxdhd274"><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(#SVGHcSWxdhd274)"><path fill="#38aade" d="M24 0H0v24h24z"/><path fill="#fff" d="M17.174 8.535c0-1.289-.6-2.617-.824-3.121c.81.586 3.645 2.205 3.645 7.091c0 5.438-5.128 7.26-7.697 7.493H7.296V18.86c0-3.344 3.756-4.517 6.446-5.695c2.686-1.173 3.437-3.01 3.437-4.629z"/><path fill="#fff" d="M7.297 19.9v-1.042q-.002-.306.038-.591c1.319-2.705 4.038-3.456 4.78-3.558c.775-.111 4.565-.882 6.335-1.803c.954-.494 1.294-1.537 1.362-2.424c.116.602.184 1.275.184 2.022a7.4 7.4 0 0 1-.35 2.302l-7.163 5.118l-.3.073H7.407a1 1 0 0 1-.116-.097z"/><path fill="#fff" d="M19.995 12.67c-.107 5.307-5.157 7.096-7.697 7.329H7.296v-.267l.039-.32c.591-3.82 5.598-4.483 9.059-4.629c2.18-.097 3.213-1.216 3.606-2.113zM4 11.264v5.913c1.028-2.19 4.256-3.504 5.976-4.052c1.726-.548 3.432-1.24 3.432-2.007c0-.765-2.35-1.056-2.35-1.822c0-.33.499-1.095 1.526-1.75c1.028-.659 2.235-1.716 2.235-2.409c0-.964-2.177-1.158-3.262-1.134C6.18 4.003 4 9.19 4 11.263"/><path fill="#fff" d="M4 17.177v-5.914c0-1.114.63-3.121 2.04-4.745c2.938-1.163 7.276-2.666 7.276-1.822c0 .97-1.396 1.89-3.238 3.102c-.45.3-.93.61-1.42.95c-2.496 1.716-3.34 2.734-3.34 4.343c0 .95.272 1.638.51 2.03c-.786.573-1.455 1.256-1.828 2.056"/><path fill="#fff" d="M12.725 4.05c.29.19.518.403.518.612c0 .508-.882 1.643-3.557 2.845C7.015 8.709 4.015 10.599 4 12.49v-1.227c0-2.074 2.186-7.26 7.557-7.26c.32-.005.736.004 1.163.048z"/></g><defs><clipPath id="SVGHcSWxdhd274"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg> </template>
CSS
.icon-fluid-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(%23SVGHcSWxdhd274)%22%3E%3Cpath%20fill%3D%22%2338aade%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M17.174%208.535c0-1.289-.6-2.617-.824-3.121c.81.586%203.645%202.205%203.645%207.091c0%205.438-5.128%207.26-7.697%207.493H7.296V18.86c0-3.344%203.756-4.517%206.446-5.695c2.686-1.173%203.437-3.01%203.437-4.629z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M7.297%2019.9v-1.042q-.002-.306.038-.591c1.319-2.705%204.038-3.456%204.78-3.558c.775-.111%204.565-.882%206.335-1.803c.954-.494%201.294-1.537%201.362-2.424c.116.602.184%201.275.184%202.022a7.4%207.4%200%200%201-.35%202.302l-7.163%205.118l-.3.073H7.407a1%201%200%200%201-.116-.097z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M19.995%2012.67c-.107%205.307-5.157%207.096-7.697%207.329H7.296v-.267l.039-.32c.591-3.82%205.598-4.483%209.059-4.629c2.18-.097%203.213-1.216%203.606-2.113zM4%2011.264v5.913c1.028-2.19%204.256-3.504%205.976-4.052c1.726-.548%203.432-1.24%203.432-2.007c0-.765-2.35-1.056-2.35-1.822c0-.33.499-1.095%201.526-1.75c1.028-.659%202.235-1.716%202.235-2.409c0-.964-2.177-1.158-3.262-1.134C6.18%204.003%204%209.19%204%2011.263%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M4%2017.177v-5.914c0-1.114.63-3.121%202.04-4.745c2.938-1.163%207.276-2.666%207.276-1.822c0%20.97-1.396%201.89-3.238%203.102c-.45.3-.93.61-1.42.95c-2.496%201.716-3.34%202.734-3.34%204.343c0%20.95.272%201.638.51%202.03c-.786.573-1.455%201.256-1.828%202.056%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M12.725%204.05c.29.19.518.403.518.612c0%20.508-.882%201.643-3.557%202.845C7.015%208.709%204.015%2010.599%204%2012.49v-1.227c0-2.074%202.186-7.26%207.557-7.26c.32-.005.736.004%201.163.048z%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22SVGHcSWxdhd274%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(%23SVGHcSWxdhd274)%22%3E%3Cpath%20fill%3D%22%2338aade%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M17.174%208.535c0-1.289-.6-2.617-.824-3.121c.81.586%203.645%202.205%203.645%207.091c0%205.438-5.128%207.26-7.697%207.493H7.296V18.86c0-3.344%203.756-4.517%206.446-5.695c2.686-1.173%203.437-3.01%203.437-4.629z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M7.297%2019.9v-1.042q-.002-.306.038-.591c1.319-2.705%204.038-3.456%204.78-3.558c.775-.111%204.565-.882%206.335-1.803c.954-.494%201.294-1.537%201.362-2.424c.116.602.184%201.275.184%202.022a7.4%207.4%200%200%201-.35%202.302l-7.163%205.118l-.3.073H7.407a1%201%200%200%201-.116-.097z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M19.995%2012.67c-.107%205.307-5.157%207.096-7.697%207.329H7.296v-.267l.039-.32c.591-3.82%205.598-4.483%209.059-4.629c2.18-.097%203.213-1.216%203.606-2.113zM4%2011.264v5.913c1.028-2.19%204.256-3.504%205.976-4.052c1.726-.548%203.432-1.24%203.432-2.007c0-.765-2.35-1.056-2.35-1.822c0-.33.499-1.095%201.526-1.75c1.028-.659%202.235-1.716%202.235-2.409c0-.964-2.177-1.158-3.262-1.134C6.18%204.003%204%209.19%204%2011.263%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M4%2017.177v-5.914c0-1.114.63-3.121%202.04-4.745c2.938-1.163%207.276-2.666%207.276-1.822c0%20.97-1.396%201.89-3.238%203.102c-.45.3-.93.61-1.42.95c-2.496%201.716-3.34%202.734-3.34%204.343c0%20.95.272%201.638.51%202.03c-.786.573-1.455%201.256-1.828%202.056%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M12.725%204.05c.29.19.518.403.518.612c0%20.508-.882%201.643-3.557%202.845C7.015%208.709%204.015%2010.599%204%2012.49v-1.227c0-2.074%202.186-7.26%207.557-7.26c.32-.005.736.004%201.163.048z%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22SVGHcSWxdhd274%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/fluid-background.svg?color=%231a73e8&size=48
