hammer icon

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

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

The same icon in other sets

hammerAkar IconshammerBootstrap IconshammerEmoji One (Colored)hammerFramework7 IconshammerFont Awesome 6 Solidhammer-outlineFlowbite IconshammerFluent EmojihammerFluent Emoji FlathammerFluent Emoji High ContrasthammerFirefox OS EmojihammerHuge IconshammerIconoirhammerIonIconshammerJam IconshammerLine AwesomehammerLucidehammerMaterial Design Iconshammer-fillMingCute IconhammerNoto EmojihammerOpenMojihammerPhosphorhammerPrime Iconshammer-fillRemix IconhammerTabler Icons

More construction icons from Font Awesome Solid

brushdrafting-compassdumpsterhard-hatpaint-rollerpencil-rulerrulerruler-combinedruler-horizontalruler-verticalscrewdrivertoolboxtoolswrench

Use the hammer icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M246.9 82.3L271 67.8c21.6-13 46.3-19.8 71.5-19.8c36.8 0 72.2 14.6 98.2 40.7l63.9 63.9c15 15 23.4 35.4 23.4 56.6v30.9l19.7 19.7c15.6-15.6 40.9-15.6 56.6 0s15.6 40.9 0 56.6l-64 64c-15.6 15.6-40.9 15.6-56.6 0s-15.6-40.9 0-56.6L464 304h-30.9c-21.2 0-41.6-8.4-56.6-23.4l-49.1-49.1c-15-15-23.4-35.4-23.4-56.6v-12.7c0-11.2-5.9-21.7-15.5-27.4l-41.6-25c-10.4-6.2-10.4-21.2 0-27.4zM50.7 466.7l222.1-222.1l90.5 90.5l-222.1 222.1c-25 25-65.5 25-90.5 0s-25-65.5 0-90.5"/></svg>

React

import type { SVGProps } from "react";

export function Fa7SolidHammer(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="M246.9 82.3L271 67.8c21.6-13 46.3-19.8 71.5-19.8c36.8 0 72.2 14.6 98.2 40.7l63.9 63.9c15 15 23.4 35.4 23.4 56.6v30.9l19.7 19.7c15.6-15.6 40.9-15.6 56.6 0s15.6 40.9 0 56.6l-64 64c-15.6 15.6-40.9 15.6-56.6 0s-15.6-40.9 0-56.6L464 304h-30.9c-21.2 0-41.6-8.4-56.6-23.4l-49.1-49.1c-15-15-23.4-35.4-23.4-56.6v-12.7c0-11.2-5.9-21.7-15.5-27.4l-41.6-25c-10.4-6.2-10.4-21.2 0-27.4zM50.7 466.7l222.1-222.1l90.5 90.5l-222.1 222.1c-25 25-65.5 25-90.5 0s-25-65.5 0-90.5"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M246.9 82.3L271 67.8c21.6-13 46.3-19.8 71.5-19.8c36.8 0 72.2 14.6 98.2 40.7l63.9 63.9c15 15 23.4 35.4 23.4 56.6v30.9l19.7 19.7c15.6-15.6 40.9-15.6 56.6 0s15.6 40.9 0 56.6l-64 64c-15.6 15.6-40.9 15.6-56.6 0s-15.6-40.9 0-56.6L464 304h-30.9c-21.2 0-41.6-8.4-56.6-23.4l-49.1-49.1c-15-15-23.4-35.4-23.4-56.6v-12.7c0-11.2-5.9-21.7-15.5-27.4l-41.6-25c-10.4-6.2-10.4-21.2 0-27.4zM50.7 466.7l222.1-222.1l90.5 90.5l-222.1 222.1c-25 25-65.5 25-90.5 0s-25-65.5 0-90.5"/></svg>
</template>

CSS

.icon-hammer {
  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%22M246.9%2082.3L271%2067.8c21.6-13%2046.3-19.8%2071.5-19.8c36.8%200%2072.2%2014.6%2098.2%2040.7l63.9%2063.9c15%2015%2023.4%2035.4%2023.4%2056.6v30.9l19.7%2019.7c15.6-15.6%2040.9-15.6%2056.6%200s15.6%2040.9%200%2056.6l-64%2064c-15.6%2015.6-40.9%2015.6-56.6%200s-15.6-40.9%200-56.6L464%20304h-30.9c-21.2%200-41.6-8.4-56.6-23.4l-49.1-49.1c-15-15-23.4-35.4-23.4-56.6v-12.7c0-11.2-5.9-21.7-15.5-27.4l-41.6-25c-10.4-6.2-10.4-21.2%200-27.4zM50.7%20466.7l222.1-222.1l90.5%2090.5l-222.1%20222.1c-25%2025-65.5%2025-90.5%200s-25-65.5%200-90.5%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%22M246.9%2082.3L271%2067.8c21.6-13%2046.3-19.8%2071.5-19.8c36.8%200%2072.2%2014.6%2098.2%2040.7l63.9%2063.9c15%2015%2023.4%2035.4%2023.4%2056.6v30.9l19.7%2019.7c15.6-15.6%2040.9-15.6%2056.6%200s15.6%2040.9%200%2056.6l-64%2064c-15.6%2015.6-40.9%2015.6-56.6%200s-15.6-40.9%200-56.6L464%20304h-30.9c-21.2%200-41.6-8.4-56.6-23.4l-49.1-49.1c-15-15-23.4-35.4-23.4-56.6v-12.7c0-11.2-5.9-21.7-15.5-27.4l-41.6-25c-10.4-6.2-10.4-21.2%200-27.4zM50.7%20466.7l222.1-222.1l90.5%2090.5l-222.1%20222.1c-25%2025-65.5%2025-90.5%200s-25-65.5%200-90.5%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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