line segments icon

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

Name: line-segments-thin
Set: Phosphor
Style: Thin
Viewbox: 256×256
License: MIT

5 other variants in Phosphor

line-segments line-segments-bold line-segments-duotone line-segments-fill line-segments-light

Related icons in Phosphor

Use the line segments icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M235.81 36.19a28 28 0 0 0-39.6 0a28 28 0 0 0 0 39.6a26.6 26.6 0 0 0 3.14 2.71l-29.73 55.21a28.08 28.08 0 0 0-26.38 3.87l-24.82-24.82A28 28 0 0 0 76.2 76.19a28 28 0 0 0 3.14 42.31L49.6 173.72a28 28 0 0 0-29.41 6.49a28 28 0 1 0 39.6 0a29 29 0 0 0-3.14-2.71l29.73-55.21a28 28 0 0 0 26.38-3.87l24.82 24.82a28 28 0 1 0 39.09-5.74l29.73-55.22a28 28 0 0 0 29.41-46.09m-181.68 178a20 20 0 1 1 0-28.28a20 20 0 0 1 0 28.24Zm27.72-104a20 20 0 1 1 28.29 0a20 20 0 0 1-28.29-.05Zm92.3 64a20 20 0 1 1 0-28.29a20 20 0 0 1 0 28.25Zm56-104a20 20 0 1 1 0-28.29a20 20 0 0 1 0 28.24Z"/></svg>

React

import type { SVGProps } from "react";

export function PhLineSegmentsThin(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="M235.81 36.19a28 28 0 0 0-39.6 0a28 28 0 0 0 0 39.6a26.6 26.6 0 0 0 3.14 2.71l-29.73 55.21a28.08 28.08 0 0 0-26.38 3.87l-24.82-24.82A28 28 0 0 0 76.2 76.19a28 28 0 0 0 3.14 42.31L49.6 173.72a28 28 0 0 0-29.41 6.49a28 28 0 1 0 39.6 0a29 29 0 0 0-3.14-2.71l29.73-55.21a28 28 0 0 0 26.38-3.87l24.82 24.82a28 28 0 1 0 39.09-5.74l29.73-55.22a28 28 0 0 0 29.41-46.09m-181.68 178a20 20 0 1 1 0-28.28a20 20 0 0 1 0 28.24Zm27.72-104a20 20 0 1 1 28.29 0a20 20 0 0 1-28.29-.05Zm92.3 64a20 20 0 1 1 0-28.29a20 20 0 0 1 0 28.25Zm56-104a20 20 0 1 1 0-28.29a20 20 0 0 1 0 28.24Z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M235.81 36.19a28 28 0 0 0-39.6 0a28 28 0 0 0 0 39.6a26.6 26.6 0 0 0 3.14 2.71l-29.73 55.21a28.08 28.08 0 0 0-26.38 3.87l-24.82-24.82A28 28 0 0 0 76.2 76.19a28 28 0 0 0 3.14 42.31L49.6 173.72a28 28 0 0 0-29.41 6.49a28 28 0 1 0 39.6 0a29 29 0 0 0-3.14-2.71l29.73-55.21a28 28 0 0 0 26.38-3.87l24.82 24.82a28 28 0 1 0 39.09-5.74l29.73-55.22a28 28 0 0 0 29.41-46.09m-181.68 178a20 20 0 1 1 0-28.28a20 20 0 0 1 0 28.24Zm27.72-104a20 20 0 1 1 28.29 0a20 20 0 0 1-28.29-.05Zm92.3 64a20 20 0 1 1 0-28.29a20 20 0 0 1 0 28.25Zm56-104a20 20 0 1 1 0-28.29a20 20 0 0 1 0 28.24Z"/></svg>
</template>

CSS

.icon-line-segments-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%22M235.81%2036.19a28%2028%200%200%200-39.6%200a28%2028%200%200%200%200%2039.6a26.6%2026.6%200%200%200%203.14%202.71l-29.73%2055.21a28.08%2028.08%200%200%200-26.38%203.87l-24.82-24.82A28%2028%200%200%200%2076.2%2076.19a28%2028%200%200%200%203.14%2042.31L49.6%20173.72a28%2028%200%200%200-29.41%206.49a28%2028%200%201%200%2039.6%200a29%2029%200%200%200-3.14-2.71l29.73-55.21a28%2028%200%200%200%2026.38-3.87l24.82%2024.82a28%2028%200%201%200%2039.09-5.74l29.73-55.22a28%2028%200%200%200%2029.41-46.09m-181.68%20178a20%2020%200%201%201%200-28.28a20%2020%200%200%201%200%2028.24Zm27.72-104a20%2020%200%201%201%2028.29%200a20%2020%200%200%201-28.29-.05Zm92.3%2064a20%2020%200%201%201%200-28.29a20%2020%200%200%201%200%2028.25Zm56-104a20%2020%200%201%201%200-28.29a20%2020%200%200%201%200%2028.24Z%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%22M235.81%2036.19a28%2028%200%200%200-39.6%200a28%2028%200%200%200%200%2039.6a26.6%2026.6%200%200%200%203.14%202.71l-29.73%2055.21a28.08%2028.08%200%200%200-26.38%203.87l-24.82-24.82A28%2028%200%200%200%2076.2%2076.19a28%2028%200%200%200%203.14%2042.31L49.6%20173.72a28%2028%200%200%200-29.41%206.49a28%2028%200%201%200%2039.6%200a29%2029%200%200%200-3.14-2.71l29.73-55.21a28%2028%200%200%200%2026.38-3.87l24.82%2024.82a28%2028%200%201%200%2039.09-5.74l29.73-55.22a28%2028%200%200%200%2029.41-46.09m-181.68%20178a20%2020%200%201%201%200-28.28a20%2020%200%200%201%200%2028.24Zm27.72-104a20%2020%200%201%201%2028.29%200a20%2020%200%200%201-28.29-.05Zm92.3%2064a20%2020%200%201%201%200-28.29a20%2020%200%200%201%200%2028.25Zm56-104a20%2020%200%201%201%200-28.29a20%2020%200%200%201%200%2028.24Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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