wrench screwdriver icon
wrench-screwdriver-20-solid from HeroIcons by Refactoring UI Inc · Solid 20x20 · MIT Free for personal and commercial use.
- Name
- wrench-screwdriver-20-solid
- Set
- HeroIcons
- Style
- Solid 20x20
- Viewbox
- 20×20
- License
- MIT
3 other variants in HeroIcons
The same icon in other sets
Use the wrench screwdriver icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><g fill="currentColor"><path fill-rule="evenodd" d="M14.5 10a4.5 4.5 0 0 0 4.284-5.882c-.105-.324-.51-.391-.751-.15L15.34 6.66a.45.45 0 0 1-.493.11a3 3 0 0 1-1.618-1.616a.455.455 0 0 1 .11-.494l2.694-2.692c.24-.241.174-.647-.15-.752a4.5 4.5 0 0 0-5.873 4.575c.055.873-.128 1.808-.8 2.368l-7.23 6.024a2.724 2.724 0 1 0 3.837 3.837l6.024-7.23c.56-.672 1.495-.855 2.368-.8q.144.01.291.01M5 16a1 1 0 1 1-2 0a1 1 0 0 1 2 0" clip-rule="evenodd"/><path d="M14.5 11.5q.26 0 .514-.022l3.754 3.754a2.5 2.5 0 0 1-3.536 3.536l-4.41-4.41l2.172-2.607c.052-.062.147-.138.342-.196a2.3 2.3 0 0 1 .777-.067q.192.012.387.012M6 4.586l2.33 2.33a.5.5 0 0 1-.08.09L6.8 8.214L4.586 6H3.309a.5.5 0 0 1-.447-.276l-1.7-3.402a.5.5 0 0 1 .093-.577l.49-.49a.5.5 0 0 1 .577-.094l3.402 1.7A.5.5 0 0 1 6 3.31z"/></g></svg>
React
import type { SVGProps } from "react";
export function HeroiconsWrenchScrewdriver20Solid(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><g fill="currentColor"><path fillRule="evenodd" d="M14.5 10a4.5 4.5 0 0 0 4.284-5.882c-.105-.324-.51-.391-.751-.15L15.34 6.66a.45.45 0 0 1-.493.11a3 3 0 0 1-1.618-1.616a.455.455 0 0 1 .11-.494l2.694-2.692c.24-.241.174-.647-.15-.752a4.5 4.5 0 0 0-5.873 4.575c.055.873-.128 1.808-.8 2.368l-7.23 6.024a2.724 2.724 0 1 0 3.837 3.837l6.024-7.23c.56-.672 1.495-.855 2.368-.8q.144.01.291.01M5 16a1 1 0 1 1-2 0a1 1 0 0 1 2 0" clipRule="evenodd"/><path d="M14.5 11.5q.26 0 .514-.022l3.754 3.754a2.5 2.5 0 0 1-3.536 3.536l-4.41-4.41l2.172-2.607c.052-.062.147-.138.342-.196a2.3 2.3 0 0 1 .777-.067q.192.012.387.012M6 4.586l2.33 2.33a.5.5 0 0 1-.08.09L6.8 8.214L4.586 6H3.309a.5.5 0 0 1-.447-.276l-1.7-3.402a.5.5 0 0 1 .093-.577l.49-.49a.5.5 0 0 1 .577-.094l3.402 1.7A.5.5 0 0 1 6 3.31z"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><g fill="currentColor"><path fill-rule="evenodd" d="M14.5 10a4.5 4.5 0 0 0 4.284-5.882c-.105-.324-.51-.391-.751-.15L15.34 6.66a.45.45 0 0 1-.493.11a3 3 0 0 1-1.618-1.616a.455.455 0 0 1 .11-.494l2.694-2.692c.24-.241.174-.647-.15-.752a4.5 4.5 0 0 0-5.873 4.575c.055.873-.128 1.808-.8 2.368l-7.23 6.024a2.724 2.724 0 1 0 3.837 3.837l6.024-7.23c.56-.672 1.495-.855 2.368-.8q.144.01.291.01M5 16a1 1 0 1 1-2 0a1 1 0 0 1 2 0" clip-rule="evenodd"/><path d="M14.5 11.5q.26 0 .514-.022l3.754 3.754a2.5 2.5 0 0 1-3.536 3.536l-4.41-4.41l2.172-2.607c.052-.062.147-.138.342-.196a2.3 2.3 0 0 1 .777-.067q.192.012.387.012M6 4.586l2.33 2.33a.5.5 0 0 1-.08.09L6.8 8.214L4.586 6H3.309a.5.5 0 0 1-.447-.276l-1.7-3.402a.5.5 0 0 1 .093-.577l.49-.49a.5.5 0 0 1 .577-.094l3.402 1.7A.5.5 0 0 1 6 3.31z"/></g></svg> </template>
CSS
.icon-wrench-screwdriver-20-solid {
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%2020%2020%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M14.5%2010a4.5%204.5%200%200%200%204.284-5.882c-.105-.324-.51-.391-.751-.15L15.34%206.66a.45.45%200%200%201-.493.11a3%203%200%200%201-1.618-1.616a.455.455%200%200%201%20.11-.494l2.694-2.692c.24-.241.174-.647-.15-.752a4.5%204.5%200%200%200-5.873%204.575c.055.873-.128%201.808-.8%202.368l-7.23%206.024a2.724%202.724%200%201%200%203.837%203.837l6.024-7.23c.56-.672%201.495-.855%202.368-.8q.144.01.291.01M5%2016a1%201%200%201%201-2%200a1%201%200%200%201%202%200%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20d%3D%22M14.5%2011.5q.26%200%20.514-.022l3.754%203.754a2.5%202.5%200%200%201-3.536%203.536l-4.41-4.41l2.172-2.607c.052-.062.147-.138.342-.196a2.3%202.3%200%200%201%20.777-.067q.192.012.387.012M6%204.586l2.33%202.33a.5.5%200%200%201-.08.09L6.8%208.214L4.586%206H3.309a.5.5%200%200%201-.447-.276l-1.7-3.402a.5.5%200%200%201%20.093-.577l.49-.49a.5.5%200%200%201%20.577-.094l3.402%201.7A.5.5%200%200%201%206%203.31z%22%2F%3E%3C%2Fg%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%2020%2020%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M14.5%2010a4.5%204.5%200%200%200%204.284-5.882c-.105-.324-.51-.391-.751-.15L15.34%206.66a.45.45%200%200%201-.493.11a3%203%200%200%201-1.618-1.616a.455.455%200%200%201%20.11-.494l2.694-2.692c.24-.241.174-.647-.15-.752a4.5%204.5%200%200%200-5.873%204.575c.055.873-.128%201.808-.8%202.368l-7.23%206.024a2.724%202.724%200%201%200%203.837%203.837l6.024-7.23c.56-.672%201.495-.855%202.368-.8q.144.01.291.01M5%2016a1%201%200%201%201-2%200a1%201%200%200%201%202%200%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20d%3D%22M14.5%2011.5q.26%200%20.514-.022l3.754%203.754a2.5%202.5%200%200%201-3.536%203.536l-4.41-4.41l2.172-2.607c.052-.062.147-.138.342-.196a2.3%202.3%200%200%201%20.777-.067q.192.012.387.012M6%204.586l2.33%202.33a.5.5%200%200%201-.08.09L6.8%208.214L4.586%206H3.309a.5.5%200%200%201-.447-.276l-1.7-3.402a.5.5%200%200%201%20.093-.577l.49-.49a.5.5%200%200%201%20.577-.094l3.402%201.7A.5.5%200%200%201%206%203.31z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/heroicons/wrench-screwdriver-20-solid.svg?color=%231a73e8&size=48
