wrench icon
wrench from Framework7 Icons by Vladimir Kharlampidi · Outline · MIT Free for personal and commercial use.
- Name
- wrench
- Set
- Framework7 Icons
- Style
- Outline
- Viewbox
- 56×56
- License
- MIT
1 other variant in Framework7 Icons
The same icon in other sets
wrenchBootstrap IconswrenchBoxIcons v2wrenchBoxIcons v2 SolidwrenchEmoji One (Colored)wrenchFont Awesome 6 SolidwrenchFont Awesome Solidwrench-16-filledFluent UI System Iconswrench-16Fluent UI System Color IconswrenchFluent EmojiwrenchFluent Emoji FlatwrenchFluent Emoji High ContrastwrenchFirefox OS EmojiwrenchHeroIconswrenchIconoirwrenchIonIconswrenchJam IconswrenchLine AwesomewrenchLucidewrenchMage IconswrenchMaterial Design IconswrenchMyna UI IconswrenchNoto EmojiwrenchOpenMojiwrenchPhosphor
Use the wrench icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M4.673 52.303c3.698 3.697 8.807 3.495 12.84-.516c4.617-4.616 9.188-13.849 15.62-20.28c4.997-4.997 10.667-.135 17.546-6.723c2.756-2.621 4.28-6.386 3.72-9.12l-8.605 2.353c-1.434.38-2.465-.538-2.913-2.084l-.65-2.264c-.448-1.546.09-2.846 1.523-3.226l8.583-2.331c-.246-.784-.986-1.86-1.905-2.801C45.256 0 36.585.6 31.588 4.818c-7.463 7.104-1.816 14.61-6.723 19.518c-5.849 5.849-15.104 10.51-19.698 15.126c-4.033 4.011-4.212 9.12-.493 12.84m2.13-2.152c-2.42-2.465-2.242-5.938.447-8.605c4.64-4.616 14.454-9.77 19.765-15.081c5.782-5.782-.314-12.997 6.745-19.518c3.563-3.294 9.681-3.54 13.804-.381L43.15 7.73c-3.272.852-4.706 3.361-3.72 6.768l.627 2.173l2.487 9.12c-3.854.56-7.843-.111-11.562 3.564c-5.827 5.826-10.914 15.708-15.552 20.37c-2.712 2.733-6.208 2.913-8.628.425m26.06-31.798l4.819-1.277c.426-.112.672-.538.56-1.009a.79.79 0 0 0-.964-.56l-4.84 1.3a.79.79 0 0 0-.56.963c.134.47.515.717.986.583m.606 2.465l4.795-1.277a.79.79 0 0 0 .56-1.009c-.111-.426-.56-.65-.963-.56l-4.84 1.322c-.426.09-.672.538-.56.941c.134.47.537.717 1.008.583m12.885-.112l4.639-1.255c-.516 1.21-1.255 2.42-2.33 3.473c-1.323 1.278-2.69 2.017-4.102 2.42l-1.254-4.57c.896.268 1.927.246 3.047-.068m-12.302 2.577l4.862-1.3c.404-.112.65-.56.56-.986a.783.783 0 0 0-.985-.538l-4.818 1.3a.813.813 0 0 0-.583.964c.09.47.538.672.964.56M8.393 48.627c1.412 1.367 3.832 1.39 5.177-.022c1.412-1.479 1.479-3.832.022-5.244c-1.456-1.389-3.832-1.456-5.244.023c-1.389 1.434-1.411 3.832.045 5.243"/></svg>
React
import type { SVGProps } from "react";
export function F7Wrench(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M4.673 52.303c3.698 3.697 8.807 3.495 12.84-.516c4.617-4.616 9.188-13.849 15.62-20.28c4.997-4.997 10.667-.135 17.546-6.723c2.756-2.621 4.28-6.386 3.72-9.12l-8.605 2.353c-1.434.38-2.465-.538-2.913-2.084l-.65-2.264c-.448-1.546.09-2.846 1.523-3.226l8.583-2.331c-.246-.784-.986-1.86-1.905-2.801C45.256 0 36.585.6 31.588 4.818c-7.463 7.104-1.816 14.61-6.723 19.518c-5.849 5.849-15.104 10.51-19.698 15.126c-4.033 4.011-4.212 9.12-.493 12.84m2.13-2.152c-2.42-2.465-2.242-5.938.447-8.605c4.64-4.616 14.454-9.77 19.765-15.081c5.782-5.782-.314-12.997 6.745-19.518c3.563-3.294 9.681-3.54 13.804-.381L43.15 7.73c-3.272.852-4.706 3.361-3.72 6.768l.627 2.173l2.487 9.12c-3.854.56-7.843-.111-11.562 3.564c-5.827 5.826-10.914 15.708-15.552 20.37c-2.712 2.733-6.208 2.913-8.628.425m26.06-31.798l4.819-1.277c.426-.112.672-.538.56-1.009a.79.79 0 0 0-.964-.56l-4.84 1.3a.79.79 0 0 0-.56.963c.134.47.515.717.986.583m.606 2.465l4.795-1.277a.79.79 0 0 0 .56-1.009c-.111-.426-.56-.65-.963-.56l-4.84 1.322c-.426.09-.672.538-.56.941c.134.47.537.717 1.008.583m12.885-.112l4.639-1.255c-.516 1.21-1.255 2.42-2.33 3.473c-1.323 1.278-2.69 2.017-4.102 2.42l-1.254-4.57c.896.268 1.927.246 3.047-.068m-12.302 2.577l4.862-1.3c.404-.112.65-.56.56-.986a.783.783 0 0 0-.985-.538l-4.818 1.3a.813.813 0 0 0-.583.964c.09.47.538.672.964.56M8.393 48.627c1.412 1.367 3.832 1.39 5.177-.022c1.412-1.479 1.479-3.832.022-5.244c-1.456-1.389-3.832-1.456-5.244.023c-1.389 1.434-1.411 3.832.045 5.243"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M4.673 52.303c3.698 3.697 8.807 3.495 12.84-.516c4.617-4.616 9.188-13.849 15.62-20.28c4.997-4.997 10.667-.135 17.546-6.723c2.756-2.621 4.28-6.386 3.72-9.12l-8.605 2.353c-1.434.38-2.465-.538-2.913-2.084l-.65-2.264c-.448-1.546.09-2.846 1.523-3.226l8.583-2.331c-.246-.784-.986-1.86-1.905-2.801C45.256 0 36.585.6 31.588 4.818c-7.463 7.104-1.816 14.61-6.723 19.518c-5.849 5.849-15.104 10.51-19.698 15.126c-4.033 4.011-4.212 9.12-.493 12.84m2.13-2.152c-2.42-2.465-2.242-5.938.447-8.605c4.64-4.616 14.454-9.77 19.765-15.081c5.782-5.782-.314-12.997 6.745-19.518c3.563-3.294 9.681-3.54 13.804-.381L43.15 7.73c-3.272.852-4.706 3.361-3.72 6.768l.627 2.173l2.487 9.12c-3.854.56-7.843-.111-11.562 3.564c-5.827 5.826-10.914 15.708-15.552 20.37c-2.712 2.733-6.208 2.913-8.628.425m26.06-31.798l4.819-1.277c.426-.112.672-.538.56-1.009a.79.79 0 0 0-.964-.56l-4.84 1.3a.79.79 0 0 0-.56.963c.134.47.515.717.986.583m.606 2.465l4.795-1.277a.79.79 0 0 0 .56-1.009c-.111-.426-.56-.65-.963-.56l-4.84 1.322c-.426.09-.672.538-.56.941c.134.47.537.717 1.008.583m12.885-.112l4.639-1.255c-.516 1.21-1.255 2.42-2.33 3.473c-1.323 1.278-2.69 2.017-4.102 2.42l-1.254-4.57c.896.268 1.927.246 3.047-.068m-12.302 2.577l4.862-1.3c.404-.112.65-.56.56-.986a.783.783 0 0 0-.985-.538l-4.818 1.3a.813.813 0 0 0-.583.964c.09.47.538.672.964.56M8.393 48.627c1.412 1.367 3.832 1.39 5.177-.022c1.412-1.479 1.479-3.832.022-5.244c-1.456-1.389-3.832-1.456-5.244.023c-1.389 1.434-1.411 3.832.045 5.243"/></svg> </template>
CSS
.icon-wrench {
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%2056%2056%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M4.673%2052.303c3.698%203.697%208.807%203.495%2012.84-.516c4.617-4.616%209.188-13.849%2015.62-20.28c4.997-4.997%2010.667-.135%2017.546-6.723c2.756-2.621%204.28-6.386%203.72-9.12l-8.605%202.353c-1.434.38-2.465-.538-2.913-2.084l-.65-2.264c-.448-1.546.09-2.846%201.523-3.226l8.583-2.331c-.246-.784-.986-1.86-1.905-2.801C45.256%200%2036.585.6%2031.588%204.818c-7.463%207.104-1.816%2014.61-6.723%2019.518c-5.849%205.849-15.104%2010.51-19.698%2015.126c-4.033%204.011-4.212%209.12-.493%2012.84m2.13-2.152c-2.42-2.465-2.242-5.938.447-8.605c4.64-4.616%2014.454-9.77%2019.765-15.081c5.782-5.782-.314-12.997%206.745-19.518c3.563-3.294%209.681-3.54%2013.804-.381L43.15%207.73c-3.272.852-4.706%203.361-3.72%206.768l.627%202.173l2.487%209.12c-3.854.56-7.843-.111-11.562%203.564c-5.827%205.826-10.914%2015.708-15.552%2020.37c-2.712%202.733-6.208%202.913-8.628.425m26.06-31.798l4.819-1.277c.426-.112.672-.538.56-1.009a.79.79%200%200%200-.964-.56l-4.84%201.3a.79.79%200%200%200-.56.963c.134.47.515.717.986.583m.606%202.465l4.795-1.277a.79.79%200%200%200%20.56-1.009c-.111-.426-.56-.65-.963-.56l-4.84%201.322c-.426.09-.672.538-.56.941c.134.47.537.717%201.008.583m12.885-.112l4.639-1.255c-.516%201.21-1.255%202.42-2.33%203.473c-1.323%201.278-2.69%202.017-4.102%202.42l-1.254-4.57c.896.268%201.927.246%203.047-.068m-12.302%202.577l4.862-1.3c.404-.112.65-.56.56-.986a.783.783%200%200%200-.985-.538l-4.818%201.3a.813.813%200%200%200-.583.964c.09.47.538.672.964.56M8.393%2048.627c1.412%201.367%203.832%201.39%205.177-.022c1.412-1.479%201.479-3.832.022-5.244c-1.456-1.389-3.832-1.456-5.244.023c-1.389%201.434-1.411%203.832.045%205.243%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%2056%2056%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M4.673%2052.303c3.698%203.697%208.807%203.495%2012.84-.516c4.617-4.616%209.188-13.849%2015.62-20.28c4.997-4.997%2010.667-.135%2017.546-6.723c2.756-2.621%204.28-6.386%203.72-9.12l-8.605%202.353c-1.434.38-2.465-.538-2.913-2.084l-.65-2.264c-.448-1.546.09-2.846%201.523-3.226l8.583-2.331c-.246-.784-.986-1.86-1.905-2.801C45.256%200%2036.585.6%2031.588%204.818c-7.463%207.104-1.816%2014.61-6.723%2019.518c-5.849%205.849-15.104%2010.51-19.698%2015.126c-4.033%204.011-4.212%209.12-.493%2012.84m2.13-2.152c-2.42-2.465-2.242-5.938.447-8.605c4.64-4.616%2014.454-9.77%2019.765-15.081c5.782-5.782-.314-12.997%206.745-19.518c3.563-3.294%209.681-3.54%2013.804-.381L43.15%207.73c-3.272.852-4.706%203.361-3.72%206.768l.627%202.173l2.487%209.12c-3.854.56-7.843-.111-11.562%203.564c-5.827%205.826-10.914%2015.708-15.552%2020.37c-2.712%202.733-6.208%202.913-8.628.425m26.06-31.798l4.819-1.277c.426-.112.672-.538.56-1.009a.79.79%200%200%200-.964-.56l-4.84%201.3a.79.79%200%200%200-.56.963c.134.47.515.717.986.583m.606%202.465l4.795-1.277a.79.79%200%200%200%20.56-1.009c-.111-.426-.56-.65-.963-.56l-4.84%201.322c-.426.09-.672.538-.56.941c.134.47.537.717%201.008.583m12.885-.112l4.639-1.255c-.516%201.21-1.255%202.42-2.33%203.473c-1.323%201.278-2.69%202.017-4.102%202.42l-1.254-4.57c.896.268%201.927.246%203.047-.068m-12.302%202.577l4.862-1.3c.404-.112.65-.56.56-.986a.783.783%200%200%200-.985-.538l-4.818%201.3a.813.813%200%200%200-.583.964c.09.47.538.672.964.56M8.393%2048.627c1.412%201.367%203.832%201.39%205.177-.022c1.412-1.479%201.479-3.832.022-5.244c-1.456-1.389-3.832-1.456-5.244.023c-1.389%201.434-1.411%203.832.045%205.243%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/f7/wrench.svg?color=%231a73e8&size=48
