yarn icon
yarn-thin from Phosphor by Phosphor Icons · Thin · MIT Free for personal and commercial use.
- Name
- yarn-thin
- Set
- Phosphor
- Style
- Thin
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
The same icon in other sets
yarn-fillAkar IconsyarnBoxicons BrandsyarnCatppuccin IconsyarnCoreUI BrandsyarnDeviconyarnFont Awesome 6 BrandsyarnFont Awesome BrandsyarnFluent EmojiyarnFluent Emoji FlatyarnFluent Emoji High ContrastyarnLine AwesomeyarnSVG LogosyarnMaterial Icon ThemeyarnNoto EmojiyarnOpenMojiyarnSimple Iconsyarn-darkSkill IconsyarnTabler IconsyarnTwitter Emoji
Use the yarn icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M232 220h-64.79a100 100 0 1 0-39.21 8h104a4 4 0 0 0 0-8M128 36a91.5 91.5 0 0 1 52.43 16.44a219.4 219.4 0 0 0-36.38 19.18a218.6 218.6 0 0 0-56.42-26.27A91.3 91.3 0 0 1 128 36M77.85 50.91a210.5 210.5 0 0 1 59 25.6a221 221 0 0 0-26.07 21.77A177.8 177.8 0 0 0 50.81 78a92.6 92.6 0 0 1 27.04-27.09M46.44 85.46a169.8 169.8 0 0 1 58.47 18.73a222 222 0 0 0-20.84 25.32a138.5 138.5 0 0 0-47.36-12.94a91.4 91.4 0 0 1 9.73-31.11m9.32 99.44A91.54 91.54 0 0 1 36 128c0-1.16 0-2.3.07-3.45a130.5 130.5 0 0 1 43.46 11.67a218.4 218.4 0 0 0-23.77 48.68m6.12 7A213.32 213.32 0 0 1 187.79 58.13a92.7 92.7 0 0 1 21.28 26.42a179.87 179.87 0 0 0-119.53 127a92.7 92.7 0 0 1-27.66-19.65M128 220a91.6 91.6 0 0 1-31-5.37A171.82 171.82 0 0 1 212.59 91.84a91.3 91.3 0 0 1 7.28 31.28A140.54 140.54 0 0 0 128.69 220Zm91.92-88.45a92.13 92.13 0 0 1-82.81 88a132.58 132.58 0 0 1 82.81-88"/></svg>
React
import type { SVGProps } from "react";
export function PhYarnThin(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="M232 220h-64.79a100 100 0 1 0-39.21 8h104a4 4 0 0 0 0-8M128 36a91.5 91.5 0 0 1 52.43 16.44a219.4 219.4 0 0 0-36.38 19.18a218.6 218.6 0 0 0-56.42-26.27A91.3 91.3 0 0 1 128 36M77.85 50.91a210.5 210.5 0 0 1 59 25.6a221 221 0 0 0-26.07 21.77A177.8 177.8 0 0 0 50.81 78a92.6 92.6 0 0 1 27.04-27.09M46.44 85.46a169.8 169.8 0 0 1 58.47 18.73a222 222 0 0 0-20.84 25.32a138.5 138.5 0 0 0-47.36-12.94a91.4 91.4 0 0 1 9.73-31.11m9.32 99.44A91.54 91.54 0 0 1 36 128c0-1.16 0-2.3.07-3.45a130.5 130.5 0 0 1 43.46 11.67a218.4 218.4 0 0 0-23.77 48.68m6.12 7A213.32 213.32 0 0 1 187.79 58.13a92.7 92.7 0 0 1 21.28 26.42a179.87 179.87 0 0 0-119.53 127a92.7 92.7 0 0 1-27.66-19.65M128 220a91.6 91.6 0 0 1-31-5.37A171.82 171.82 0 0 1 212.59 91.84a91.3 91.3 0 0 1 7.28 31.28A140.54 140.54 0 0 0 128.69 220Zm91.92-88.45a92.13 92.13 0 0 1-82.81 88a132.58 132.58 0 0 1 82.81-88"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M232 220h-64.79a100 100 0 1 0-39.21 8h104a4 4 0 0 0 0-8M128 36a91.5 91.5 0 0 1 52.43 16.44a219.4 219.4 0 0 0-36.38 19.18a218.6 218.6 0 0 0-56.42-26.27A91.3 91.3 0 0 1 128 36M77.85 50.91a210.5 210.5 0 0 1 59 25.6a221 221 0 0 0-26.07 21.77A177.8 177.8 0 0 0 50.81 78a92.6 92.6 0 0 1 27.04-27.09M46.44 85.46a169.8 169.8 0 0 1 58.47 18.73a222 222 0 0 0-20.84 25.32a138.5 138.5 0 0 0-47.36-12.94a91.4 91.4 0 0 1 9.73-31.11m9.32 99.44A91.54 91.54 0 0 1 36 128c0-1.16 0-2.3.07-3.45a130.5 130.5 0 0 1 43.46 11.67a218.4 218.4 0 0 0-23.77 48.68m6.12 7A213.32 213.32 0 0 1 187.79 58.13a92.7 92.7 0 0 1 21.28 26.42a179.87 179.87 0 0 0-119.53 127a92.7 92.7 0 0 1-27.66-19.65M128 220a91.6 91.6 0 0 1-31-5.37A171.82 171.82 0 0 1 212.59 91.84a91.3 91.3 0 0 1 7.28 31.28A140.54 140.54 0 0 0 128.69 220Zm91.92-88.45a92.13 92.13 0 0 1-82.81 88a132.58 132.58 0 0 1 82.81-88"/></svg> </template>
CSS
.icon-yarn-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%22M232%20220h-64.79a100%20100%200%201%200-39.21%208h104a4%204%200%200%200%200-8M128%2036a91.5%2091.5%200%200%201%2052.43%2016.44a219.4%20219.4%200%200%200-36.38%2019.18a218.6%20218.6%200%200%200-56.42-26.27A91.3%2091.3%200%200%201%20128%2036M77.85%2050.91a210.5%20210.5%200%200%201%2059%2025.6a221%20221%200%200%200-26.07%2021.77A177.8%20177.8%200%200%200%2050.81%2078a92.6%2092.6%200%200%201%2027.04-27.09M46.44%2085.46a169.8%20169.8%200%200%201%2058.47%2018.73a222%20222%200%200%200-20.84%2025.32a138.5%20138.5%200%200%200-47.36-12.94a91.4%2091.4%200%200%201%209.73-31.11m9.32%2099.44A91.54%2091.54%200%200%201%2036%20128c0-1.16%200-2.3.07-3.45a130.5%20130.5%200%200%201%2043.46%2011.67a218.4%20218.4%200%200%200-23.77%2048.68m6.12%207A213.32%20213.32%200%200%201%20187.79%2058.13a92.7%2092.7%200%200%201%2021.28%2026.42a179.87%20179.87%200%200%200-119.53%20127a92.7%2092.7%200%200%201-27.66-19.65M128%20220a91.6%2091.6%200%200%201-31-5.37A171.82%20171.82%200%200%201%20212.59%2091.84a91.3%2091.3%200%200%201%207.28%2031.28A140.54%20140.54%200%200%200%20128.69%20220Zm91.92-88.45a92.13%2092.13%200%200%201-82.81%2088a132.58%20132.58%200%200%201%2082.81-88%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%22M232%20220h-64.79a100%20100%200%201%200-39.21%208h104a4%204%200%200%200%200-8M128%2036a91.5%2091.5%200%200%201%2052.43%2016.44a219.4%20219.4%200%200%200-36.38%2019.18a218.6%20218.6%200%200%200-56.42-26.27A91.3%2091.3%200%200%201%20128%2036M77.85%2050.91a210.5%20210.5%200%200%201%2059%2025.6a221%20221%200%200%200-26.07%2021.77A177.8%20177.8%200%200%200%2050.81%2078a92.6%2092.6%200%200%201%2027.04-27.09M46.44%2085.46a169.8%20169.8%200%200%201%2058.47%2018.73a222%20222%200%200%200-20.84%2025.32a138.5%20138.5%200%200%200-47.36-12.94a91.4%2091.4%200%200%201%209.73-31.11m9.32%2099.44A91.54%2091.54%200%200%201%2036%20128c0-1.16%200-2.3.07-3.45a130.5%20130.5%200%200%201%2043.46%2011.67a218.4%20218.4%200%200%200-23.77%2048.68m6.12%207A213.32%20213.32%200%200%201%20187.79%2058.13a92.7%2092.7%200%200%201%2021.28%2026.42a179.87%20179.87%200%200%200-119.53%20127a92.7%2092.7%200%200%201-27.66-19.65M128%20220a91.6%2091.6%200%200%201-31-5.37A171.82%20171.82%200%200%201%20212.59%2091.84a91.3%2091.3%200%200%201%207.28%2031.28A140.54%20140.54%200%200%200%20128.69%20220Zm91.92-88.45a92.13%2092.13%200%200%201-82.81%2088a132.58%20132.58%200%200%201%2082.81-88%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/yarn-thin.svg?color=%231a73e8&size=48
