cut icon
cut from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.
- Name
- cut
- Set
- IonIcons
- Style
- Regular
- Viewbox
- 512×512
- License
- MIT
2 other variants in IonIcons
The same icon in other sets
Use the cut icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M103.48 224a71.64 71.64 0 0 0 44.76-15.66l41.5 16.89l6.82-12.63a39 39 0 0 1 4.32-6.37l14.22-14.42l-41.17-24.94A72 72 0 1 0 103.48 224m0-112a40 40 0 1 1-40 40a40 40 0 0 1 40-40"/><path fill="currentColor" d="m480 169l-5.52-12.58c-4.48-10.42-14.74-16-32.78-17.85c-10.12-1-26.95-1.24-49.69 3.81c-20 4.45-122.14 28.2-164.95 58.62c-20.25 14.39-24.06 33.67-27.06 49.16c-2.78 14.14-5 25.31-18 35c-15 11.14-27.27 16.38-33.58 18.6a71.74 71.74 0 1 0 24.79 38Zm-224.52 87a16 16 0 1 1 16-16a16 16 0 0 1-16 16m-152 144a40 40 0 1 1 40-40a40 40 0 0 1-40 40"/><path fill="currentColor" d="m343.79 259.87l-83.74 48.18l27.63 13.08l3.62 1.74C310 331.92 359.74 356 410.53 359c3.89.23 7.47.34 10.78.34C442 359.31 453 354 459.75 350L480 336Z"/></svg>
React
import type { SVGProps } from "react";
export function IonCut(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M103.48 224a71.64 71.64 0 0 0 44.76-15.66l41.5 16.89l6.82-12.63a39 39 0 0 1 4.32-6.37l14.22-14.42l-41.17-24.94A72 72 0 1 0 103.48 224m0-112a40 40 0 1 1-40 40a40 40 0 0 1 40-40"/><path fill="currentColor" d="m480 169l-5.52-12.58c-4.48-10.42-14.74-16-32.78-17.85c-10.12-1-26.95-1.24-49.69 3.81c-20 4.45-122.14 28.2-164.95 58.62c-20.25 14.39-24.06 33.67-27.06 49.16c-2.78 14.14-5 25.31-18 35c-15 11.14-27.27 16.38-33.58 18.6a71.74 71.74 0 1 0 24.79 38Zm-224.52 87a16 16 0 1 1 16-16a16 16 0 0 1-16 16m-152 144a40 40 0 1 1 40-40a40 40 0 0 1-40 40"/><path fill="currentColor" d="m343.79 259.87l-83.74 48.18l27.63 13.08l3.62 1.74C310 331.92 359.74 356 410.53 359c3.89.23 7.47.34 10.78.34C442 359.31 453 354 459.75 350L480 336Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M103.48 224a71.64 71.64 0 0 0 44.76-15.66l41.5 16.89l6.82-12.63a39 39 0 0 1 4.32-6.37l14.22-14.42l-41.17-24.94A72 72 0 1 0 103.48 224m0-112a40 40 0 1 1-40 40a40 40 0 0 1 40-40"/><path fill="currentColor" d="m480 169l-5.52-12.58c-4.48-10.42-14.74-16-32.78-17.85c-10.12-1-26.95-1.24-49.69 3.81c-20 4.45-122.14 28.2-164.95 58.62c-20.25 14.39-24.06 33.67-27.06 49.16c-2.78 14.14-5 25.31-18 35c-15 11.14-27.27 16.38-33.58 18.6a71.74 71.74 0 1 0 24.79 38Zm-224.52 87a16 16 0 1 1 16-16a16 16 0 0 1-16 16m-152 144a40 40 0 1 1 40-40a40 40 0 0 1-40 40"/><path fill="currentColor" d="m343.79 259.87l-83.74 48.18l27.63 13.08l3.62 1.74C310 331.92 359.74 356 410.53 359c3.89.23 7.47.34 10.78.34C442 359.31 453 354 459.75 350L480 336Z"/></svg> </template>
CSS
.icon-cut {
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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M103.48%20224a71.64%2071.64%200%200%200%2044.76-15.66l41.5%2016.89l6.82-12.63a39%2039%200%200%201%204.32-6.37l14.22-14.42l-41.17-24.94A72%2072%200%201%200%20103.48%20224m0-112a40%2040%200%201%201-40%2040a40%2040%200%200%201%2040-40%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m480%20169l-5.52-12.58c-4.48-10.42-14.74-16-32.78-17.85c-10.12-1-26.95-1.24-49.69%203.81c-20%204.45-122.14%2028.2-164.95%2058.62c-20.25%2014.39-24.06%2033.67-27.06%2049.16c-2.78%2014.14-5%2025.31-18%2035c-15%2011.14-27.27%2016.38-33.58%2018.6a71.74%2071.74%200%201%200%2024.79%2038Zm-224.52%2087a16%2016%200%201%201%2016-16a16%2016%200%200%201-16%2016m-152%20144a40%2040%200%201%201%2040-40a40%2040%200%200%201-40%2040%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m343.79%20259.87l-83.74%2048.18l27.63%2013.08l3.62%201.74C310%20331.92%20359.74%20356%20410.53%20359c3.89.23%207.47.34%2010.78.34C442%20359.31%20453%20354%20459.75%20350L480%20336Z%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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M103.48%20224a71.64%2071.64%200%200%200%2044.76-15.66l41.5%2016.89l6.82-12.63a39%2039%200%200%201%204.32-6.37l14.22-14.42l-41.17-24.94A72%2072%200%201%200%20103.48%20224m0-112a40%2040%200%201%201-40%2040a40%2040%200%200%201%2040-40%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m480%20169l-5.52-12.58c-4.48-10.42-14.74-16-32.78-17.85c-10.12-1-26.95-1.24-49.69%203.81c-20%204.45-122.14%2028.2-164.95%2058.62c-20.25%2014.39-24.06%2033.67-27.06%2049.16c-2.78%2014.14-5%2025.31-18%2035c-15%2011.14-27.27%2016.38-33.58%2018.6a71.74%2071.74%200%201%200%2024.79%2038Zm-224.52%2087a16%2016%200%201%201%2016-16a16%2016%200%200%201-16%2016m-152%20144a40%2040%200%201%201%2040-40a40%2040%200%200%201-40%2040%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m343.79%20259.87l-83.74%2048.18l27.63%2013.08l3.62%201.74C310%20331.92%20359.74%20356%20410.53%20359c3.89.23%207.47.34%2010.78.34C442%20359.31%20453%20354%20459.75%20350L480%20336Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/cut.svg?color=%231a73e8&size=48