polygon logo
polygon-background from Web3 Icons Branded by 0xa3k5 · Background · MIT Free for personal and commercial use.
- Name
- polygon-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
Related icons in Web3 Icons Branded
Use the polygon 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(#SVGHcSWxdhd115)"><path fill="url(#SVGt6CtBbxE)" d="M24 0H0v24h24z"/><path fill="#fff" d="m15.88 14.86l3.794-2.165a.64.64 0 0 0 .326-.558v-4.33a.64.64 0 0 0-.326-.556L15.88 5.086a.66.66 0 0 0-.65 0L11.432 7.25a.64.64 0 0 0-.325.557v7.737l-2.662 1.517l-2.661-1.517v-3.036l2.661-1.517l1.755 1.001V9.958l-1.43-.816a.66.66 0 0 0-.65 0l-3.796 2.165a.64.64 0 0 0-.325.557v4.33c0 .229.124.442.325.557l3.796 2.165c.2.114.45.114.65 0l3.796-2.165a.64.64 0 0 0 .325-.557V8.455l.048-.026l2.613-1.49l2.661 1.516v3.036l-2.661 1.517l-1.753-.999v2.037l1.427.814a.66.66 0 0 0 .651 0z"/></g><defs><linearGradient id="SVGt6CtBbxE" x1="3.948" x2="19.217" y1="16.617" y2="7.645" gradientUnits="userSpaceOnUse"><stop stop-color="#a726c1"/><stop offset=".88" stop-color="#803bdf"/><stop offset="1" stop-color="#7b3fe4"/></linearGradient><clipPath id="SVGHcSWxdhd115"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg>
React
import type { SVGProps } from "react";
export function TokenBrandedPolygonBackground(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(#SVGHcSWxdhd115)"><path fill="url(#SVGt6CtBbxE)" d="M24 0H0v24h24z"/><path fill="#fff" d="m15.88 14.86l3.794-2.165a.64.64 0 0 0 .326-.558v-4.33a.64.64 0 0 0-.326-.556L15.88 5.086a.66.66 0 0 0-.65 0L11.432 7.25a.64.64 0 0 0-.325.557v7.737l-2.662 1.517l-2.661-1.517v-3.036l2.661-1.517l1.755 1.001V9.958l-1.43-.816a.66.66 0 0 0-.65 0l-3.796 2.165a.64.64 0 0 0-.325.557v4.33c0 .229.124.442.325.557l3.796 2.165c.2.114.45.114.65 0l3.796-2.165a.64.64 0 0 0 .325-.557V8.455l.048-.026l2.613-1.49l2.661 1.516v3.036l-2.661 1.517l-1.753-.999v2.037l1.427.814a.66.66 0 0 0 .651 0z"/></g><defs><linearGradient id="SVGt6CtBbxE" x1="3.948" x2="19.217" y1="16.617" y2="7.645" gradientUnits="userSpaceOnUse"><stop stopColor="#a726c1"/><stop offset=".88" stopColor="#803bdf"/><stop offset="1" stopColor="#7b3fe4"/></linearGradient><clipPath id="SVGHcSWxdhd115"><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(#SVGHcSWxdhd115)"><path fill="url(#SVGt6CtBbxE)" d="M24 0H0v24h24z"/><path fill="#fff" d="m15.88 14.86l3.794-2.165a.64.64 0 0 0 .326-.558v-4.33a.64.64 0 0 0-.326-.556L15.88 5.086a.66.66 0 0 0-.65 0L11.432 7.25a.64.64 0 0 0-.325.557v7.737l-2.662 1.517l-2.661-1.517v-3.036l2.661-1.517l1.755 1.001V9.958l-1.43-.816a.66.66 0 0 0-.65 0l-3.796 2.165a.64.64 0 0 0-.325.557v4.33c0 .229.124.442.325.557l3.796 2.165c.2.114.45.114.65 0l3.796-2.165a.64.64 0 0 0 .325-.557V8.455l.048-.026l2.613-1.49l2.661 1.516v3.036l-2.661 1.517l-1.753-.999v2.037l1.427.814a.66.66 0 0 0 .651 0z"/></g><defs><linearGradient id="SVGt6CtBbxE" x1="3.948" x2="19.217" y1="16.617" y2="7.645" gradientUnits="userSpaceOnUse"><stop stop-color="#a726c1"/><stop offset=".88" stop-color="#803bdf"/><stop offset="1" stop-color="#7b3fe4"/></linearGradient><clipPath id="SVGHcSWxdhd115"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></g></svg> </template>
CSS
.icon-polygon-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(%23SVGHcSWxdhd115)%22%3E%3Cpath%20fill%3D%22url(%23SVGt6CtBbxE)%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m15.88%2014.86l3.794-2.165a.64.64%200%200%200%20.326-.558v-4.33a.64.64%200%200%200-.326-.556L15.88%205.086a.66.66%200%200%200-.65%200L11.432%207.25a.64.64%200%200%200-.325.557v7.737l-2.662%201.517l-2.661-1.517v-3.036l2.661-1.517l1.755%201.001V9.958l-1.43-.816a.66.66%200%200%200-.65%200l-3.796%202.165a.64.64%200%200%200-.325.557v4.33c0%20.229.124.442.325.557l3.796%202.165c.2.114.45.114.65%200l3.796-2.165a.64.64%200%200%200%20.325-.557V8.455l.048-.026l2.613-1.49l2.661%201.516v3.036l-2.661%201.517l-1.753-.999v2.037l1.427.814a.66.66%200%200%200%20.651%200z%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGt6CtBbxE%22%20x1%3D%223.948%22%20x2%3D%2219.217%22%20y1%3D%2216.617%22%20y2%3D%227.645%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23a726c1%22%2F%3E%3Cstop%20offset%3D%22.88%22%20stop-color%3D%22%23803bdf%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%237b3fe4%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22SVGHcSWxdhd115%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(%23SVGHcSWxdhd115)%22%3E%3Cpath%20fill%3D%22url(%23SVGt6CtBbxE)%22%20d%3D%22M24%200H0v24h24z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m15.88%2014.86l3.794-2.165a.64.64%200%200%200%20.326-.558v-4.33a.64.64%200%200%200-.326-.556L15.88%205.086a.66.66%200%200%200-.65%200L11.432%207.25a.64.64%200%200%200-.325.557v7.737l-2.662%201.517l-2.661-1.517v-3.036l2.661-1.517l1.755%201.001V9.958l-1.43-.816a.66.66%200%200%200-.65%200l-3.796%202.165a.64.64%200%200%200-.325.557v4.33c0%20.229.124.442.325.557l3.796%202.165c.2.114.45.114.65%200l3.796-2.165a.64.64%200%200%200%20.325-.557V8.455l.048-.026l2.613-1.49l2.661%201.516v3.036l-2.661%201.517l-1.753-.999v2.037l1.427.814a.66.66%200%200%200%20.651%200z%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGt6CtBbxE%22%20x1%3D%223.948%22%20x2%3D%2219.217%22%20y1%3D%2216.617%22%20y2%3D%227.645%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23a726c1%22%2F%3E%3Cstop%20offset%3D%22.88%22%20stop-color%3D%22%23803bdf%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%237b3fe4%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22SVGHcSWxdhd115%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/polygon-background.svg?color=%231a73e8&size=48
