cowboy hat face emoji

cowboy-hat-face from Fluent Emoji Flat by Microsoft Corporation · Default · Smileys & Emotion · MIT Free for personal and commercial use.

Name
cowboy-hat-face
Set
Fluent Emoji Flat
Style
Default
Category
Smileys & Emotion
Viewbox
32×32
License
MIT

The same emoji in other sets

cowboy-hat-faceEmoji One (Colored)cowboy-hat-faceFluent Emojicowboy-hat-faceFluent Emoji High Contrastcowboy-hat-faceNoto Emojicowboy-hat-faceOpenMojicowboy-hat-faceStreamline Emojiscowboy-hat-faceTwitter Emoji

More smileys & emotion icons from Fluent Emoji Flat

alienalien-monsteranger-symbolangry-faceangry-face-with-hornsanguished-faceanxious-face-with-sweatastonished-facebeaming-face-with-smiling-eyesbeating-heartblack-heartblue-heartbombbroken-heartbrown-heartcat-with-tears-of-joycat-with-wry-smileclown-facecold-facecollisionconfounded-faceconfused-facecrying-catcrying-face

Use the cowboy hat face emoji

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="none"><path fill="#6d4534" d="M17.061 2.602A3.1 3.1 0 0 1 18.901 2C20.612 2 22 3.361 22 5.038V6h2v-.5A2.5 2.5 0 0 1 26.5 3c2 0 4.5 1 4.5 5c0 3.2-3 4.667-4.5 5c-4.333-.333-11.9-1-7.5-1h-6c4.4 0-3.167.667-7.5 1C4 12.667 1 11.2 1 8c0-4 2.5-5 4.5-5A2.5 2.5 0 0 1 8 5.5V6h2v-.962C10 3.361 11.388 2 13.098 2c.694 0 1.328.227 1.84.602a1.527 1.527 0 0 0 2.123 0"/><path fill="#ffb02e" d="M7.274 10.228C9.214 11.147 12.074 12 16 12s6.786-.854 8.726-1.772C26.91 12.42 28 15.54 28 19c0 6.632-4.003 12-12 12S4 25.632 4 19c0-3.464 1.092-6.582 3.274-8.772"/><path fill="#fff" d="M15 14.5a3.5 3.5 0 1 1-7 0a3.5 3.5 0 0 1 7 0m9 0a3.5 3.5 0 1 1-7 0a3.5 3.5 0 0 1 7 0"/><path fill="#402a32" d="M14.5 15a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0m8 0a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0"/><path fill="#8c5543" d="M24 6H8v1c-.116 1.157.218 3.116 1.904 4.207c1.648.467 3.668.793 6.096.793s4.448-.326 6.095-.793C23.782 10.117 24.115 8.157 24 7z"/><path fill="#a56953" d="M10 5h12v1H10z"/><path fill="#bb1d80" d="M16 28c-8 0-8-8-8-8h16s0 8-8 8"/><path fill="#fff" d="M9 20.5V20h14v.5a1 1 0 0 1-1 1H10a1 1 0 0 1-1-1"/></g></svg>

React

import type { SVGProps } from "react";

export function FluentEmojiFlatCowboyHatFace(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="none"><path fill="#6d4534" d="M17.061 2.602A3.1 3.1 0 0 1 18.901 2C20.612 2 22 3.361 22 5.038V6h2v-.5A2.5 2.5 0 0 1 26.5 3c2 0 4.5 1 4.5 5c0 3.2-3 4.667-4.5 5c-4.333-.333-11.9-1-7.5-1h-6c4.4 0-3.167.667-7.5 1C4 12.667 1 11.2 1 8c0-4 2.5-5 4.5-5A2.5 2.5 0 0 1 8 5.5V6h2v-.962C10 3.361 11.388 2 13.098 2c.694 0 1.328.227 1.84.602a1.527 1.527 0 0 0 2.123 0"/><path fill="#ffb02e" d="M7.274 10.228C9.214 11.147 12.074 12 16 12s6.786-.854 8.726-1.772C26.91 12.42 28 15.54 28 19c0 6.632-4.003 12-12 12S4 25.632 4 19c0-3.464 1.092-6.582 3.274-8.772"/><path fill="#fff" d="M15 14.5a3.5 3.5 0 1 1-7 0a3.5 3.5 0 0 1 7 0m9 0a3.5 3.5 0 1 1-7 0a3.5 3.5 0 0 1 7 0"/><path fill="#402a32" d="M14.5 15a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0m8 0a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0"/><path fill="#8c5543" d="M24 6H8v1c-.116 1.157.218 3.116 1.904 4.207c1.648.467 3.668.793 6.096.793s4.448-.326 6.095-.793C23.782 10.117 24.115 8.157 24 7z"/><path fill="#a56953" d="M10 5h12v1H10z"/><path fill="#bb1d80" d="M16 28c-8 0-8-8-8-8h16s0 8-8 8"/><path fill="#fff" d="M9 20.5V20h14v.5a1 1 0 0 1-1 1H10a1 1 0 0 1-1-1"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="none"><path fill="#6d4534" d="M17.061 2.602A3.1 3.1 0 0 1 18.901 2C20.612 2 22 3.361 22 5.038V6h2v-.5A2.5 2.5 0 0 1 26.5 3c2 0 4.5 1 4.5 5c0 3.2-3 4.667-4.5 5c-4.333-.333-11.9-1-7.5-1h-6c4.4 0-3.167.667-7.5 1C4 12.667 1 11.2 1 8c0-4 2.5-5 4.5-5A2.5 2.5 0 0 1 8 5.5V6h2v-.962C10 3.361 11.388 2 13.098 2c.694 0 1.328.227 1.84.602a1.527 1.527 0 0 0 2.123 0"/><path fill="#ffb02e" d="M7.274 10.228C9.214 11.147 12.074 12 16 12s6.786-.854 8.726-1.772C26.91 12.42 28 15.54 28 19c0 6.632-4.003 12-12 12S4 25.632 4 19c0-3.464 1.092-6.582 3.274-8.772"/><path fill="#fff" d="M15 14.5a3.5 3.5 0 1 1-7 0a3.5 3.5 0 0 1 7 0m9 0a3.5 3.5 0 1 1-7 0a3.5 3.5 0 0 1 7 0"/><path fill="#402a32" d="M14.5 15a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0m8 0a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0"/><path fill="#8c5543" d="M24 6H8v1c-.116 1.157.218 3.116 1.904 4.207c1.648.467 3.668.793 6.096.793s4.448-.326 6.095-.793C23.782 10.117 24.115 8.157 24 7z"/><path fill="#a56953" d="M10 5h12v1H10z"/><path fill="#bb1d80" d="M16 28c-8 0-8-8-8-8h16s0 8-8 8"/><path fill="#fff" d="M9 20.5V20h14v.5a1 1 0 0 1-1 1H10a1 1 0 0 1-1-1"/></g></svg>
</template>

CSS

.icon-cowboy-hat-face {
  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%2032%2032%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22%236d4534%22%20d%3D%22M17.061%202.602A3.1%203.1%200%200%201%2018.901%202C20.612%202%2022%203.361%2022%205.038V6h2v-.5A2.5%202.5%200%200%201%2026.5%203c2%200%204.5%201%204.5%205c0%203.2-3%204.667-4.5%205c-4.333-.333-11.9-1-7.5-1h-6c4.4%200-3.167.667-7.5%201C4%2012.667%201%2011.2%201%208c0-4%202.5-5%204.5-5A2.5%202.5%200%200%201%208%205.5V6h2v-.962C10%203.361%2011.388%202%2013.098%202c.694%200%201.328.227%201.84.602a1.527%201.527%200%200%200%202.123%200%22%2F%3E%3Cpath%20fill%3D%22%23ffb02e%22%20d%3D%22M7.274%2010.228C9.214%2011.147%2012.074%2012%2016%2012s6.786-.854%208.726-1.772C26.91%2012.42%2028%2015.54%2028%2019c0%206.632-4.003%2012-12%2012S4%2025.632%204%2019c0-3.464%201.092-6.582%203.274-8.772%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M15%2014.5a3.5%203.5%200%201%201-7%200a3.5%203.5%200%200%201%207%200m9%200a3.5%203.5%200%201%201-7%200a3.5%203.5%200%200%201%207%200%22%2F%3E%3Cpath%20fill%3D%22%23402a32%22%20d%3D%22M14.5%2015a2.5%202.5%200%201%201-5%200a2.5%202.5%200%200%201%205%200m8%200a2.5%202.5%200%201%201-5%200a2.5%202.5%200%200%201%205%200%22%2F%3E%3Cpath%20fill%3D%22%238c5543%22%20d%3D%22M24%206H8v1c-.116%201.157.218%203.116%201.904%204.207c1.648.467%203.668.793%206.096.793s4.448-.326%206.095-.793C23.782%2010.117%2024.115%208.157%2024%207z%22%2F%3E%3Cpath%20fill%3D%22%23a56953%22%20d%3D%22M10%205h12v1H10z%22%2F%3E%3Cpath%20fill%3D%22%23bb1d80%22%20d%3D%22M16%2028c-8%200-8-8-8-8h16s0%208-8%208%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M9%2020.5V20h14v.5a1%201%200%200%201-1%201H10a1%201%200%200%201-1-1%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%2032%2032%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22%236d4534%22%20d%3D%22M17.061%202.602A3.1%203.1%200%200%201%2018.901%202C20.612%202%2022%203.361%2022%205.038V6h2v-.5A2.5%202.5%200%200%201%2026.5%203c2%200%204.5%201%204.5%205c0%203.2-3%204.667-4.5%205c-4.333-.333-11.9-1-7.5-1h-6c4.4%200-3.167.667-7.5%201C4%2012.667%201%2011.2%201%208c0-4%202.5-5%204.5-5A2.5%202.5%200%200%201%208%205.5V6h2v-.962C10%203.361%2011.388%202%2013.098%202c.694%200%201.328.227%201.84.602a1.527%201.527%200%200%200%202.123%200%22%2F%3E%3Cpath%20fill%3D%22%23ffb02e%22%20d%3D%22M7.274%2010.228C9.214%2011.147%2012.074%2012%2016%2012s6.786-.854%208.726-1.772C26.91%2012.42%2028%2015.54%2028%2019c0%206.632-4.003%2012-12%2012S4%2025.632%204%2019c0-3.464%201.092-6.582%203.274-8.772%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M15%2014.5a3.5%203.5%200%201%201-7%200a3.5%203.5%200%200%201%207%200m9%200a3.5%203.5%200%201%201-7%200a3.5%203.5%200%200%201%207%200%22%2F%3E%3Cpath%20fill%3D%22%23402a32%22%20d%3D%22M14.5%2015a2.5%202.5%200%201%201-5%200a2.5%202.5%200%200%201%205%200m8%200a2.5%202.5%200%201%201-5%200a2.5%202.5%200%200%201%205%200%22%2F%3E%3Cpath%20fill%3D%22%238c5543%22%20d%3D%22M24%206H8v1c-.116%201.157.218%203.116%201.904%204.207c1.648.467%203.668.793%206.096.793s4.448-.326%206.095-.793C23.782%2010.117%2024.115%208.157%2024%207z%22%2F%3E%3Cpath%20fill%3D%22%23a56953%22%20d%3D%22M10%205h12v1H10z%22%2F%3E%3Cpath%20fill%3D%22%23bb1d80%22%20d%3D%22M16%2028c-8%200-8-8-8-8h16s0%208-8%208%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M9%2020.5V20h14v.5a1%201%200%200%201-1%201H10a1%201%200%200%201-1-1%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent-emoji-flat/cowboy-hat-face.svg?color=%231a73e8&size=48