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

Name
magnet-thin
Set
Phosphor
Style
Thin
Viewbox
256×256
License
MIT

5 other variants in Phosphor

The same icon in other sets

Related icons in Phosphor

Use the magnet icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M204.13 53.06A83.4 83.4 0 0 0 144.59 28h-.32a83.46 83.46 0 0 0-59.42 24.62L23.46 114.8a12 12 0 0 0 0 16.92l28.67 28.66a11.9 11.9 0 0 0 8.48 3.51h.07a12 12 0 0 0 8.52-3.61l60.89-62.42a20.1 20.1 0 0 1 28-.27a19.54 19.54 0 0 1 6 14a20.87 20.87 0 0 1-6 14.86l-62.33 60.3a12 12 0 0 0-.12 17.09l28.66 28.66a12 12 0 0 0 16.89.08L203 172.12c32.88-32.91 33.4-86.32 1.13-119.06M63.51 154.69a3.93 3.93 0 0 1-2.83 1.2a4 4 0 0 1-2.83-1.17l-28.69-28.66a4 4 0 0 1 0-5.64l26.63-27l34.15 34.18Zm72.08 72.18a4 4 0 0 1-5.63 0l-28.67-28.66a4 4 0 0 1 0-5.69l27.2-26.3l34.16 34.15Zm61.76-60.44l-28.94 28.32l-34.12-34.12l29.41-28.44a29 29 0 0 0 8.4-20.64a27.5 27.5 0 0 0-8.41-19.72a28.14 28.14 0 0 0-39.25.41l-28.91 29.63L61.4 87.75l29.12-29.49A75.5 75.5 0 0 1 144.27 36h.29a75.53 75.53 0 0 1 53.87 22.67c29.2 29.63 28.7 77.98-1.08 107.76"/></svg>

React

import type { SVGProps } from "react";

export function PhMagnetThin(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="M204.13 53.06A83.4 83.4 0 0 0 144.59 28h-.32a83.46 83.46 0 0 0-59.42 24.62L23.46 114.8a12 12 0 0 0 0 16.92l28.67 28.66a11.9 11.9 0 0 0 8.48 3.51h.07a12 12 0 0 0 8.52-3.61l60.89-62.42a20.1 20.1 0 0 1 28-.27a19.54 19.54 0 0 1 6 14a20.87 20.87 0 0 1-6 14.86l-62.33 60.3a12 12 0 0 0-.12 17.09l28.66 28.66a12 12 0 0 0 16.89.08L203 172.12c32.88-32.91 33.4-86.32 1.13-119.06M63.51 154.69a3.93 3.93 0 0 1-2.83 1.2a4 4 0 0 1-2.83-1.17l-28.69-28.66a4 4 0 0 1 0-5.64l26.63-27l34.15 34.18Zm72.08 72.18a4 4 0 0 1-5.63 0l-28.67-28.66a4 4 0 0 1 0-5.69l27.2-26.3l34.16 34.15Zm61.76-60.44l-28.94 28.32l-34.12-34.12l29.41-28.44a29 29 0 0 0 8.4-20.64a27.5 27.5 0 0 0-8.41-19.72a28.14 28.14 0 0 0-39.25.41l-28.91 29.63L61.4 87.75l29.12-29.49A75.5 75.5 0 0 1 144.27 36h.29a75.53 75.53 0 0 1 53.87 22.67c29.2 29.63 28.7 77.98-1.08 107.76"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M204.13 53.06A83.4 83.4 0 0 0 144.59 28h-.32a83.46 83.46 0 0 0-59.42 24.62L23.46 114.8a12 12 0 0 0 0 16.92l28.67 28.66a11.9 11.9 0 0 0 8.48 3.51h.07a12 12 0 0 0 8.52-3.61l60.89-62.42a20.1 20.1 0 0 1 28-.27a19.54 19.54 0 0 1 6 14a20.87 20.87 0 0 1-6 14.86l-62.33 60.3a12 12 0 0 0-.12 17.09l28.66 28.66a12 12 0 0 0 16.89.08L203 172.12c32.88-32.91 33.4-86.32 1.13-119.06M63.51 154.69a3.93 3.93 0 0 1-2.83 1.2a4 4 0 0 1-2.83-1.17l-28.69-28.66a4 4 0 0 1 0-5.64l26.63-27l34.15 34.18Zm72.08 72.18a4 4 0 0 1-5.63 0l-28.67-28.66a4 4 0 0 1 0-5.69l27.2-26.3l34.16 34.15Zm61.76-60.44l-28.94 28.32l-34.12-34.12l29.41-28.44a29 29 0 0 0 8.4-20.64a27.5 27.5 0 0 0-8.41-19.72a28.14 28.14 0 0 0-39.25.41l-28.91 29.63L61.4 87.75l29.12-29.49A75.5 75.5 0 0 1 144.27 36h.29a75.53 75.53 0 0 1 53.87 22.67c29.2 29.63 28.7 77.98-1.08 107.76"/></svg>
</template>

CSS

.icon-magnet-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%22M204.13%2053.06A83.4%2083.4%200%200%200%20144.59%2028h-.32a83.46%2083.46%200%200%200-59.42%2024.62L23.46%20114.8a12%2012%200%200%200%200%2016.92l28.67%2028.66a11.9%2011.9%200%200%200%208.48%203.51h.07a12%2012%200%200%200%208.52-3.61l60.89-62.42a20.1%2020.1%200%200%201%2028-.27a19.54%2019.54%200%200%201%206%2014a20.87%2020.87%200%200%201-6%2014.86l-62.33%2060.3a12%2012%200%200%200-.12%2017.09l28.66%2028.66a12%2012%200%200%200%2016.89.08L203%20172.12c32.88-32.91%2033.4-86.32%201.13-119.06M63.51%20154.69a3.93%203.93%200%200%201-2.83%201.2a4%204%200%200%201-2.83-1.17l-28.69-28.66a4%204%200%200%201%200-5.64l26.63-27l34.15%2034.18Zm72.08%2072.18a4%204%200%200%201-5.63%200l-28.67-28.66a4%204%200%200%201%200-5.69l27.2-26.3l34.16%2034.15Zm61.76-60.44l-28.94%2028.32l-34.12-34.12l29.41-28.44a29%2029%200%200%200%208.4-20.64a27.5%2027.5%200%200%200-8.41-19.72a28.14%2028.14%200%200%200-39.25.41l-28.91%2029.63L61.4%2087.75l29.12-29.49A75.5%2075.5%200%200%201%20144.27%2036h.29a75.53%2075.53%200%200%201%2053.87%2022.67c29.2%2029.63%2028.7%2077.98-1.08%20107.76%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%22M204.13%2053.06A83.4%2083.4%200%200%200%20144.59%2028h-.32a83.46%2083.46%200%200%200-59.42%2024.62L23.46%20114.8a12%2012%200%200%200%200%2016.92l28.67%2028.66a11.9%2011.9%200%200%200%208.48%203.51h.07a12%2012%200%200%200%208.52-3.61l60.89-62.42a20.1%2020.1%200%200%201%2028-.27a19.54%2019.54%200%200%201%206%2014a20.87%2020.87%200%200%201-6%2014.86l-62.33%2060.3a12%2012%200%200%200-.12%2017.09l28.66%2028.66a12%2012%200%200%200%2016.89.08L203%20172.12c32.88-32.91%2033.4-86.32%201.13-119.06M63.51%20154.69a3.93%203.93%200%200%201-2.83%201.2a4%204%200%200%201-2.83-1.17l-28.69-28.66a4%204%200%200%201%200-5.64l26.63-27l34.15%2034.18Zm72.08%2072.18a4%204%200%200%201-5.63%200l-28.67-28.66a4%204%200%200%201%200-5.69l27.2-26.3l34.16%2034.15Zm61.76-60.44l-28.94%2028.32l-34.12-34.12l29.41-28.44a29%2029%200%200%200%208.4-20.64a27.5%2027.5%200%200%200-8.41-19.72a28.14%2028.14%200%200%200-39.25.41l-28.91%2029.63L61.4%2087.75l29.12-29.49A75.5%2075.5%200%200%201%20144.27%2036h.29a75.53%2075.53%200%200%201%2053.87%2022.67c29.2%2029.63%2028.7%2077.98-1.08%20107.76%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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