wrench icon

wrench from Font Awesome Solid by Dave Gandy · Solid · Construction · CC-BY-4.0 Attribution required.

Name
wrench
Set
Font Awesome Solid
Style
Solid
Category
Construction
Viewbox
640×640
License
CC BY 4.0

The same icon in other sets

wrenchBootstrap IconswrenchBoxIcons v2wrenchBoxIcons v2 SolidwrenchEmoji One (Colored)wrenchFramework7 IconswrenchFont Awesome 6 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

More construction icons from Font Awesome Solid

brushdrafting-compassdumpsterhammerhard-hatpaint-rollerpencil-rulerrulerruler-combinedruler-horizontalruler-verticalscrewdrivertoolboxtools

Use the wrench icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M541.4 162.6c7.6-7.6 20.3-5.7 24.1 4.3c6.8 17.7 10.5 37 10.5 57.1c0 88.4-71.6 160-160 160c-17.5 0-34.4-2.8-50.2-8L178.9 562.9c-28.1 28.1-73.7 28.1-101.8 0s-28.1-73.7 0-101.8L264 274.2c-5.2-15.8-8-32.6-8-50.2c0-88.4 71.6-160 160-160c20.1 0 39.4 3.7 57.1 10.5c10 3.8 11.8 16.5 4.3 24.1l-88.7 88.7c-3 3-4.7 7.1-4.7 11.3V240c0 8.8 7.2 16 16 16h41.4c4.2 0 8.3-1.7 11.3-4.7z"/></svg>

React

import type { SVGProps } from "react";

export function Fa7SolidWrench(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M541.4 162.6c7.6-7.6 20.3-5.7 24.1 4.3c6.8 17.7 10.5 37 10.5 57.1c0 88.4-71.6 160-160 160c-17.5 0-34.4-2.8-50.2-8L178.9 562.9c-28.1 28.1-73.7 28.1-101.8 0s-28.1-73.7 0-101.8L264 274.2c-5.2-15.8-8-32.6-8-50.2c0-88.4 71.6-160 160-160c20.1 0 39.4 3.7 57.1 10.5c10 3.8 11.8 16.5 4.3 24.1l-88.7 88.7c-3 3-4.7 7.1-4.7 11.3V240c0 8.8 7.2 16 16 16h41.4c4.2 0 8.3-1.7 11.3-4.7z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M541.4 162.6c7.6-7.6 20.3-5.7 24.1 4.3c6.8 17.7 10.5 37 10.5 57.1c0 88.4-71.6 160-160 160c-17.5 0-34.4-2.8-50.2-8L178.9 562.9c-28.1 28.1-73.7 28.1-101.8 0s-28.1-73.7 0-101.8L264 274.2c-5.2-15.8-8-32.6-8-50.2c0-88.4 71.6-160 160-160c20.1 0 39.4 3.7 57.1 10.5c10 3.8 11.8 16.5 4.3 24.1l-88.7 88.7c-3 3-4.7 7.1-4.7 11.3V240c0 8.8 7.2 16 16 16h41.4c4.2 0 8.3-1.7 11.3-4.7z"/></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%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M541.4%20162.6c7.6-7.6%2020.3-5.7%2024.1%204.3c6.8%2017.7%2010.5%2037%2010.5%2057.1c0%2088.4-71.6%20160-160%20160c-17.5%200-34.4-2.8-50.2-8L178.9%20562.9c-28.1%2028.1-73.7%2028.1-101.8%200s-28.1-73.7%200-101.8L264%20274.2c-5.2-15.8-8-32.6-8-50.2c0-88.4%2071.6-160%20160-160c20.1%200%2039.4%203.7%2057.1%2010.5c10%203.8%2011.8%2016.5%204.3%2024.1l-88.7%2088.7c-3%203-4.7%207.1-4.7%2011.3V240c0%208.8%207.2%2016%2016%2016h41.4c4.2%200%208.3-1.7%2011.3-4.7z%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%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M541.4%20162.6c7.6-7.6%2020.3-5.7%2024.1%204.3c6.8%2017.7%2010.5%2037%2010.5%2057.1c0%2088.4-71.6%20160-160%20160c-17.5%200-34.4-2.8-50.2-8L178.9%20562.9c-28.1%2028.1-73.7%2028.1-101.8%200s-28.1-73.7%200-101.8L264%20274.2c-5.2-15.8-8-32.6-8-50.2c0-88.4%2071.6-160%20160-160c20.1%200%2039.4%203.7%2057.1%2010.5c10%203.8%2011.8%2016.5%204.3%2024.1l-88.7%2088.7c-3%203-4.7%207.1-4.7%2011.3V240c0%208.8%207.2%2016%2016%2016h41.4c4.2%200%208.3-1.7%2011.3-4.7z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fa7-solid/wrench.svg?color=%231a73e8&size=48