man icon
man from Huge Icons by Hugeicons · Stroke · MIT Free for personal and commercial use.
- Name
- man
- Set
- Huge Icons
- Style
- Stroke
- Viewbox
- 24×24
- License
- MIT
The same icon in other sets
man-outlinedAnt Design IconsmanEmoji One (Colored)manFluent EmojimanFluent Emoji FlatmanFluent Emoji High ContrastmanFirefox OS EmojimanHealth IconsmanIonIconsmanMaterial SymbolsmanMaterial Symbols LightmanNoto EmojimanOpenMojimanSimple IconsmanTabler IconsmanWeb3 IconsmanWeb3 Icons BrandedmanTwitter Emoji
Related icons in Huge Icons
Use the man icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width="1.5"><path stroke-linecap="round" d="M14 4a2 2 0 1 1-4 0a2 2 0 0 1 4 0"/><path d="M16 12.5c0-1.886 0-2.828-.586-3.414S13.886 8.5 12 8.5s-2.828 0-3.414.586S8 10.614 8 12.5V14c0 .943 0 1.414.293 1.707S9.057 16 10 16v4c0 .943 0 1.414.293 1.707S11.057 22 12 22s1.414 0 1.707-.293S14 20.943 14 20v-4c.943 0 1.414 0 1.707-.293S16 14.943 16 14z"/></g></svg>
React
import type { SVGProps } from "react";
export function HugeiconsMan(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" strokeLinejoin="round" strokeWidth="1.5"><path strokeLinecap="round" d="M14 4a2 2 0 1 1-4 0a2 2 0 0 1 4 0"/><path d="M16 12.5c0-1.886 0-2.828-.586-3.414S13.886 8.5 12 8.5s-2.828 0-3.414.586S8 10.614 8 12.5V14c0 .943 0 1.414.293 1.707S9.057 16 10 16v4c0 .943 0 1.414.293 1.707S11.057 22 12 22s1.414 0 1.707-.293S14 20.943 14 20v-4c.943 0 1.414 0 1.707-.293S16 14.943 16 14z"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width="1.5"><path stroke-linecap="round" d="M14 4a2 2 0 1 1-4 0a2 2 0 0 1 4 0"/><path d="M16 12.5c0-1.886 0-2.828-.586-3.414S13.886 8.5 12 8.5s-2.828 0-3.414.586S8 10.614 8 12.5V14c0 .943 0 1.414.293 1.707S9.057 16 10 16v4c0 .943 0 1.414.293 1.707S11.057 22 12 22s1.414 0 1.707-.293S14 20.943 14 20v-4c.943 0 1.414 0 1.707-.293S16 14.943 16 14z"/></g></svg> </template>
CSS
.icon-man {
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%2024%2024%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22M14%204a2%202%200%201%201-4%200a2%202%200%200%201%204%200%22%2F%3E%3Cpath%20d%3D%22M16%2012.5c0-1.886%200-2.828-.586-3.414S13.886%208.5%2012%208.5s-2.828%200-3.414.586S8%2010.614%208%2012.5V14c0%20.943%200%201.414.293%201.707S9.057%2016%2010%2016v4c0%20.943%200%201.414.293%201.707S11.057%2022%2012%2022s1.414%200%201.707-.293S14%2020.943%2014%2020v-4c.943%200%201.414%200%201.707-.293S16%2014.943%2016%2014z%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%2024%2024%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22M14%204a2%202%200%201%201-4%200a2%202%200%200%201%204%200%22%2F%3E%3Cpath%20d%3D%22M16%2012.5c0-1.886%200-2.828-.586-3.414S13.886%208.5%2012%208.5s-2.828%200-3.414.586S8%2010.614%208%2012.5V14c0%20.943%200%201.414.293%201.707S9.057%2016%2010%2016v4c0%20.943%200%201.414.293%201.707S11.057%2022%2012%2022s1.414%200%201.707-.293S14%2020.943%2014%2020v-4c.943%200%201.414%200%201.707-.293S16%2014.943%2016%2014z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/hugeicons/man.svg?color=%231a73e8&size=48
