magnet icon
magnet-fill from Phosphor by Phosphor Icons · Fill · MIT Free for personal and commercial use.
- Name
- magnet-fill
- Set
- Phosphor
- Style
- Fill
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
The same icon in other sets
magnetBootstrap IconsmagnetBoxIcons v2magnetBoxIcons v2 SolidmagnetCodiconsmagnetElement PlusmagnetFont Awesome 6 SolidmagnetFont Awesome SolidmagnetFluent EmojimagnetFluent Emoji FlatmagnetFluent Emoji High Contrastmagnetcss.ggmagnetHuge IconsmagnetIconParkmagnetIconPark OutlinemagnetIconPark SolidmagnetIconPark TwoTonemagnetIconoirmagnetIonIconsmagnetJam IconsmagnetLine AwesomemagnetLucidemagnetMaterial Design Iconsmagnet-fillMingCute IconmagnetMyna UI Icons
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="M207 50.25A87.46 87.46 0 0 0 144.6 24h-.33A87.48 87.48 0 0 0 82 49.81L20.61 112a16 16 0 0 0 .06 22.56l28.66 28.66a15.92 15.92 0 0 0 11.32 4.69h.09a16 16 0 0 0 11.36-4.82l60.9-62.4a16.08 16.08 0 0 1 22.41-.21a15.6 15.6 0 0 1 4.73 11.19a16.9 16.9 0 0 1-4.85 12L93 183.88a16 16 0 0 0-.17 22.79l28.66 28.66a16.06 16.06 0 0 0 22.52.12l61.8-60.45c34.45-34.5 34.98-90.44 1.19-124.75M60.65 151.89L32 123.24l29.42-29.81l28.48 28.48ZM132.79 224l-28.68-28.65l30.13-29.13l28.49 28.48Z"/></svg>
React
import type { SVGProps } from "react";
export function PhMagnetFill(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="M207 50.25A87.46 87.46 0 0 0 144.6 24h-.33A87.48 87.48 0 0 0 82 49.81L20.61 112a16 16 0 0 0 .06 22.56l28.66 28.66a15.92 15.92 0 0 0 11.32 4.69h.09a16 16 0 0 0 11.36-4.82l60.9-62.4a16.08 16.08 0 0 1 22.41-.21a15.6 15.6 0 0 1 4.73 11.19a16.9 16.9 0 0 1-4.85 12L93 183.88a16 16 0 0 0-.17 22.79l28.66 28.66a16.06 16.06 0 0 0 22.52.12l61.8-60.45c34.45-34.5 34.98-90.44 1.19-124.75M60.65 151.89L32 123.24l29.42-29.81l28.48 28.48ZM132.79 224l-28.68-28.65l30.13-29.13l28.49 28.48Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M207 50.25A87.46 87.46 0 0 0 144.6 24h-.33A87.48 87.48 0 0 0 82 49.81L20.61 112a16 16 0 0 0 .06 22.56l28.66 28.66a15.92 15.92 0 0 0 11.32 4.69h.09a16 16 0 0 0 11.36-4.82l60.9-62.4a16.08 16.08 0 0 1 22.41-.21a15.6 15.6 0 0 1 4.73 11.19a16.9 16.9 0 0 1-4.85 12L93 183.88a16 16 0 0 0-.17 22.79l28.66 28.66a16.06 16.06 0 0 0 22.52.12l61.8-60.45c34.45-34.5 34.98-90.44 1.19-124.75M60.65 151.89L32 123.24l29.42-29.81l28.48 28.48ZM132.79 224l-28.68-28.65l30.13-29.13l28.49 28.48Z"/></svg> </template>
CSS
.icon-magnet-fill {
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%22M207%2050.25A87.46%2087.46%200%200%200%20144.6%2024h-.33A87.48%2087.48%200%200%200%2082%2049.81L20.61%20112a16%2016%200%200%200%20.06%2022.56l28.66%2028.66a15.92%2015.92%200%200%200%2011.32%204.69h.09a16%2016%200%200%200%2011.36-4.82l60.9-62.4a16.08%2016.08%200%200%201%2022.41-.21a15.6%2015.6%200%200%201%204.73%2011.19a16.9%2016.9%200%200%201-4.85%2012L93%20183.88a16%2016%200%200%200-.17%2022.79l28.66%2028.66a16.06%2016.06%200%200%200%2022.52.12l61.8-60.45c34.45-34.5%2034.98-90.44%201.19-124.75M60.65%20151.89L32%20123.24l29.42-29.81l28.48%2028.48ZM132.79%20224l-28.68-28.65l30.13-29.13l28.49%2028.48Z%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%22M207%2050.25A87.46%2087.46%200%200%200%20144.6%2024h-.33A87.48%2087.48%200%200%200%2082%2049.81L20.61%20112a16%2016%200%200%200%20.06%2022.56l28.66%2028.66a15.92%2015.92%200%200%200%2011.32%204.69h.09a16%2016%200%200%200%2011.36-4.82l60.9-62.4a16.08%2016.08%200%200%201%2022.41-.21a15.6%2015.6%200%200%201%204.73%2011.19a16.9%2016.9%200%200%201-4.85%2012L93%20183.88a16%2016%200%200%200-.17%2022.79l28.66%2028.66a16.06%2016.06%200%200%200%2022.52.12l61.8-60.45c34.45-34.5%2034.98-90.44%201.19-124.75M60.65%20151.89L32%20123.24l29.42-29.81l28.48%2028.48ZM132.79%20224l-28.68-28.65l30.13-29.13l28.49%2028.48Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/magnet-fill.svg?color=%231a73e8&size=48
