polygon icon
polygon-light from Phosphor by Phosphor Icons · Light · MIT Free for personal and commercial use.
- Name
- polygon-light
- Set
- Phosphor
- Style
- Light
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
The same icon in other sets
Use the polygon icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M229.23 50.78a30 30 0 0 0-42.44 0a29.8 29.8 0 0 0-5.56 7.69l-31.31-8.54a30 30 0 0 0-51.14-23.16a30.09 30.09 0 0 0-4.65 36.43l-36.3 32.67a30.07 30.07 0 0 0-39.06 2.91a30 30 0 0 0 41.38 43.44l72.6 53.25a30 30 0 1 0 48.47-8.68a29.7 29.7 0 0 0-5.77-4.5l28.44-80.59a32 32 0 0 0 4.11.3a30 30 0 0 0 21.22-51.2Zm-122-15.52a18 18 0 1 1 0 25.46a18 18 0 0 1 .04-25.46Zm-80 97.47a18 18 0 1 1 25.46 0a18 18 0 0 1-25.43 0Zm145.47 88a18 18 0 1 1 0-25.46a18 18 0 0 1 .03 25.47Zm-8.61-42.43a30 30 0 0 0-24.27 7.48l-72.58-53.24a30.14 30.14 0 0 0-1.38-27.75l36.3-32.67a30 30 0 0 0 44.62-10.61l31.31 8.54a30 30 0 0 0 8.7 23.16a30.5 30.5 0 0 0 5.78 4.51Zm56.62-93.59a18 18 0 1 1 0-25.46a18 18 0 0 1 .03 25.47Z"/></svg>
React
import type { SVGProps } from "react";
export function PhPolygonLight(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M229.23 50.78a30 30 0 0 0-42.44 0a29.8 29.8 0 0 0-5.56 7.69l-31.31-8.54a30 30 0 0 0-51.14-23.16a30.09 30.09 0 0 0-4.65 36.43l-36.3 32.67a30.07 30.07 0 0 0-39.06 2.91a30 30 0 0 0 41.38 43.44l72.6 53.25a30 30 0 1 0 48.47-8.68a29.7 29.7 0 0 0-5.77-4.5l28.44-80.59a32 32 0 0 0 4.11.3a30 30 0 0 0 21.22-51.2Zm-122-15.52a18 18 0 1 1 0 25.46a18 18 0 0 1 .04-25.46Zm-80 97.47a18 18 0 1 1 25.46 0a18 18 0 0 1-25.43 0Zm145.47 88a18 18 0 1 1 0-25.46a18 18 0 0 1 .03 25.47Zm-8.61-42.43a30 30 0 0 0-24.27 7.48l-72.58-53.24a30.14 30.14 0 0 0-1.38-27.75l36.3-32.67a30 30 0 0 0 44.62-10.61l31.31 8.54a30 30 0 0 0 8.7 23.16a30.5 30.5 0 0 0 5.78 4.51Zm56.62-93.59a18 18 0 1 1 0-25.46a18 18 0 0 1 .03 25.47Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M229.23 50.78a30 30 0 0 0-42.44 0a29.8 29.8 0 0 0-5.56 7.69l-31.31-8.54a30 30 0 0 0-51.14-23.16a30.09 30.09 0 0 0-4.65 36.43l-36.3 32.67a30.07 30.07 0 0 0-39.06 2.91a30 30 0 0 0 41.38 43.44l72.6 53.25a30 30 0 1 0 48.47-8.68a29.7 29.7 0 0 0-5.77-4.5l28.44-80.59a32 32 0 0 0 4.11.3a30 30 0 0 0 21.22-51.2Zm-122-15.52a18 18 0 1 1 0 25.46a18 18 0 0 1 .04-25.46Zm-80 97.47a18 18 0 1 1 25.46 0a18 18 0 0 1-25.43 0Zm145.47 88a18 18 0 1 1 0-25.46a18 18 0 0 1 .03 25.47Zm-8.61-42.43a30 30 0 0 0-24.27 7.48l-72.58-53.24a30.14 30.14 0 0 0-1.38-27.75l36.3-32.67a30 30 0 0 0 44.62-10.61l31.31 8.54a30 30 0 0 0 8.7 23.16a30.5 30.5 0 0 0 5.78 4.51Zm56.62-93.59a18 18 0 1 1 0-25.46a18 18 0 0 1 .03 25.47Z"/></svg> </template>
CSS
.icon-polygon-light {
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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M229.23%2050.78a30%2030%200%200%200-42.44%200a29.8%2029.8%200%200%200-5.56%207.69l-31.31-8.54a30%2030%200%200%200-51.14-23.16a30.09%2030.09%200%200%200-4.65%2036.43l-36.3%2032.67a30.07%2030.07%200%200%200-39.06%202.91a30%2030%200%200%200%2041.38%2043.44l72.6%2053.25a30%2030%200%201%200%2048.47-8.68a29.7%2029.7%200%200%200-5.77-4.5l28.44-80.59a32%2032%200%200%200%204.11.3a30%2030%200%200%200%2021.22-51.2Zm-122-15.52a18%2018%200%201%201%200%2025.46a18%2018%200%200%201%20.04-25.46Zm-80%2097.47a18%2018%200%201%201%2025.46%200a18%2018%200%200%201-25.43%200Zm145.47%2088a18%2018%200%201%201%200-25.46a18%2018%200%200%201%20.03%2025.47Zm-8.61-42.43a30%2030%200%200%200-24.27%207.48l-72.58-53.24a30.14%2030.14%200%200%200-1.38-27.75l36.3-32.67a30%2030%200%200%200%2044.62-10.61l31.31%208.54a30%2030%200%200%200%208.7%2023.16a30.5%2030.5%200%200%200%205.78%204.51Zm56.62-93.59a18%2018%200%201%201%200-25.46a18%2018%200%200%201%20.03%2025.47Z%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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M229.23%2050.78a30%2030%200%200%200-42.44%200a29.8%2029.8%200%200%200-5.56%207.69l-31.31-8.54a30%2030%200%200%200-51.14-23.16a30.09%2030.09%200%200%200-4.65%2036.43l-36.3%2032.67a30.07%2030.07%200%200%200-39.06%202.91a30%2030%200%200%200%2041.38%2043.44l72.6%2053.25a30%2030%200%201%200%2048.47-8.68a29.7%2029.7%200%200%200-5.77-4.5l28.44-80.59a32%2032%200%200%200%204.11.3a30%2030%200%200%200%2021.22-51.2Zm-122-15.52a18%2018%200%201%201%200%2025.46a18%2018%200%200%201%20.04-25.46Zm-80%2097.47a18%2018%200%201%201%2025.46%200a18%2018%200%200%201-25.43%200Zm145.47%2088a18%2018%200%201%201%200-25.46a18%2018%200%200%201%20.03%2025.47Zm-8.61-42.43a30%2030%200%200%200-24.27%207.48l-72.58-53.24a30.14%2030.14%200%200%200-1.38-27.75l36.3-32.67a30%2030%200%200%200%2044.62-10.61l31.31%208.54a30%2030%200%200%200%208.7%2023.16a30.5%2030.5%200%200%200%205.78%204.51Zm56.62-93.59a18%2018%200%201%201%200-25.46a18%2018%200%200%201%20.03%2025.47Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/polygon-light.svg?color=%231a73e8&size=48