polygon icon

polygon-thin from Phosphor by Phosphor Icons · Thin · MIT Free for personal and commercial use.

Name
polygon-thin
Set
Phosphor
Style
Thin
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="M227.81 52.19a28 28 0 0 0-39.6 0a27.8 27.8 0 0 0-5.88 8.65l-34.56-9.42a28 28 0 0 0-47.57-23.23a28.05 28.05 0 0 0-3.48 35.37L57.91 98.49a28 28 0 0 0-37.72 1.71a28 28 0 0 0 39.6 39.6l.18-.19l75.32 55.24A28 28 0 1 0 173 183.2l29.56-83.75a28.5 28.5 0 0 0 5.44.55a28 28 0 0 0 19.8-47.79ZM105.86 33.85a20 20 0 1 1 0 28.29a20 20 0 0 1 0-28.29m-80 100.29a20 20 0 1 1 28.28 0a20 20 0 0 1-28.29 0Zm148.3 88a20 20 0 1 1 0-28.28a20 20 0 0 1-.01 28.29Zm-8.7-41.6a28 28 0 0 0-25.25 7.66l-.18.19l-75.32-55.23a28.13 28.13 0 0 0-1.44-28.73l38.81-34.93a28 28 0 0 0 43.6-10.36l34.56 9.43a28 28 0 0 0 8 23.22a27.6 27.6 0 0 0 6.8 5Zm56.7-94.41a20 20 0 1 1 0-28.29a20 20 0 0 1-.01 28.3Z"/></svg>

React

import type { SVGProps } from "react";

export function PhPolygonThin(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="M227.81 52.19a28 28 0 0 0-39.6 0a27.8 27.8 0 0 0-5.88 8.65l-34.56-9.42a28 28 0 0 0-47.57-23.23a28.05 28.05 0 0 0-3.48 35.37L57.91 98.49a28 28 0 0 0-37.72 1.71a28 28 0 0 0 39.6 39.6l.18-.19l75.32 55.24A28 28 0 1 0 173 183.2l29.56-83.75a28.5 28.5 0 0 0 5.44.55a28 28 0 0 0 19.8-47.79ZM105.86 33.85a20 20 0 1 1 0 28.29a20 20 0 0 1 0-28.29m-80 100.29a20 20 0 1 1 28.28 0a20 20 0 0 1-28.29 0Zm148.3 88a20 20 0 1 1 0-28.28a20 20 0 0 1-.01 28.29Zm-8.7-41.6a28 28 0 0 0-25.25 7.66l-.18.19l-75.32-55.23a28.13 28.13 0 0 0-1.44-28.73l38.81-34.93a28 28 0 0 0 43.6-10.36l34.56 9.43a28 28 0 0 0 8 23.22a27.6 27.6 0 0 0 6.8 5Zm56.7-94.41a20 20 0 1 1 0-28.29a20 20 0 0 1-.01 28.3Z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M227.81 52.19a28 28 0 0 0-39.6 0a27.8 27.8 0 0 0-5.88 8.65l-34.56-9.42a28 28 0 0 0-47.57-23.23a28.05 28.05 0 0 0-3.48 35.37L57.91 98.49a28 28 0 0 0-37.72 1.71a28 28 0 0 0 39.6 39.6l.18-.19l75.32 55.24A28 28 0 1 0 173 183.2l29.56-83.75a28.5 28.5 0 0 0 5.44.55a28 28 0 0 0 19.8-47.79ZM105.86 33.85a20 20 0 1 1 0 28.29a20 20 0 0 1 0-28.29m-80 100.29a20 20 0 1 1 28.28 0a20 20 0 0 1-28.29 0Zm148.3 88a20 20 0 1 1 0-28.28a20 20 0 0 1-.01 28.29Zm-8.7-41.6a28 28 0 0 0-25.25 7.66l-.18.19l-75.32-55.23a28.13 28.13 0 0 0-1.44-28.73l38.81-34.93a28 28 0 0 0 43.6-10.36l34.56 9.43a28 28 0 0 0 8 23.22a27.6 27.6 0 0 0 6.8 5Zm56.7-94.41a20 20 0 1 1 0-28.29a20 20 0 0 1-.01 28.3Z"/></svg>
</template>

CSS

.icon-polygon-thin {
  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%22M227.81%2052.19a28%2028%200%200%200-39.6%200a27.8%2027.8%200%200%200-5.88%208.65l-34.56-9.42a28%2028%200%200%200-47.57-23.23a28.05%2028.05%200%200%200-3.48%2035.37L57.91%2098.49a28%2028%200%200%200-37.72%201.71a28%2028%200%200%200%2039.6%2039.6l.18-.19l75.32%2055.24A28%2028%200%201%200%20173%20183.2l29.56-83.75a28.5%2028.5%200%200%200%205.44.55a28%2028%200%200%200%2019.8-47.79ZM105.86%2033.85a20%2020%200%201%201%200%2028.29a20%2020%200%200%201%200-28.29m-80%20100.29a20%2020%200%201%201%2028.28%200a20%2020%200%200%201-28.29%200Zm148.3%2088a20%2020%200%201%201%200-28.28a20%2020%200%200%201-.01%2028.29Zm-8.7-41.6a28%2028%200%200%200-25.25%207.66l-.18.19l-75.32-55.23a28.13%2028.13%200%200%200-1.44-28.73l38.81-34.93a28%2028%200%200%200%2043.6-10.36l34.56%209.43a28%2028%200%200%200%208%2023.22a27.6%2027.6%200%200%200%206.8%205Zm56.7-94.41a20%2020%200%201%201%200-28.29a20%2020%200%200%201-.01%2028.3Z%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%22M227.81%2052.19a28%2028%200%200%200-39.6%200a27.8%2027.8%200%200%200-5.88%208.65l-34.56-9.42a28%2028%200%200%200-47.57-23.23a28.05%2028.05%200%200%200-3.48%2035.37L57.91%2098.49a28%2028%200%200%200-37.72%201.71a28%2028%200%200%200%2039.6%2039.6l.18-.19l75.32%2055.24A28%2028%200%201%200%20173%20183.2l29.56-83.75a28.5%2028.5%200%200%200%205.44.55a28%2028%200%200%200%2019.8-47.79ZM105.86%2033.85a20%2020%200%201%201%200%2028.29a20%2020%200%200%201%200-28.29m-80%20100.29a20%2020%200%201%201%2028.28%200a20%2020%200%200%201-28.29%200Zm148.3%2088a20%2020%200%201%201%200-28.28a20%2020%200%200%201-.01%2028.29Zm-8.7-41.6a28%2028%200%200%200-25.25%207.66l-.18.19l-75.32-55.23a28.13%2028.13%200%200%200-1.44-28.73l38.81-34.93a28%2028%200%200%200%2043.6-10.36l34.56%209.43a28%2028%200%200%200%208%2023.22a27.6%2027.6%200%200%200%206.8%205Zm56.7-94.41a20%2020%200%201%201%200-28.29a20%2020%200%200%201-.01%2028.3Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/polygon-thin.svg?color=%231a73e8&size=48