cowboy hat face emoji

cowboy-hat-face from Emoji One (Colored) by Emoji One · Default · People · CC-BY-4.0 Attribution required.

Name
cowboy-hat-face
Set
Emoji One (Colored)
Style
Default
Category
People
Viewbox
64×64
License
CC BY 4.0

The same emoji in other sets

cowboy-hat-faceFluent Emojicowboy-hat-faceFluent Emoji Flatcowboy-hat-faceFluent Emoji High Contrastcowboy-hat-faceNoto Emojicowboy-hat-faceOpenMojicowboy-hat-faceStreamline Emojiscowboy-hat-faceTwitter Emoji

More people icons from Emoji One (Colored)

alienalien-monsterangry-faceangry-face-with-hornsanguished-faceanxious-face-with-sweatastonished-facebabybaby-angelbackhand-index-pointing-downbackhand-index-pointing-leftbackhand-index-pointing-rightbackhand-index-pointing-upbeaming-face-with-smiling-eyesblond-haired-personboybride-with-veilbriefcasebust-in-silhouettebusts-in-silhouettecall-me-handcat-face-with-tears-of-joycat-face-with-wry-smileclapping-hands

Use the cowboy hat face emoji

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#89664c" d="M2.1 19.6c-1 2.7 3.6 12.1 7.7 13.2c8.8 2.3 22.1-4 22.1-4s-11.2-5.1-15.4-6.6C5.7 18.1 2.8 17.9 2.1 19.6m59.8 0c1 2.7-3.6 12.1-7.7 13.2c-8.8 2.3-22.1-4-22.1-4s11.2-5.1 15.4-6.6c10.8-4.1 13.7-4.3 14.4-2.6"/><path fill="#ffdd67" d="M55 39c0 12.7-10.3 23-23 23S9 51.7 9 39s10.3-23 23-23s23 10.3 23 23"/><path fill="#d3976e" d="M44.1 11.5c-2.1-3.1.3-4.8-1.4-7.6c-1-1.8-2-2.6-3.5-1.2C36.8 5.2 34 6.2 32 6.2s-4.8-1-7.2-3.5c-1.5-1.5-2.4-.6-3.5 1.2c-1.7 2.8.7 4.5-1.4 7.6c-1.3 1.9-2.6 9.3-2.6 9.3L32 23.7l14.7-2.9s-1.3-7.4-2.6-9.3"/><path fill="#fed0ac" d="M22.4 5.9s4.5 3 4.4 4.6c-.1 1.8-5.6 5-5.6 5s2.5-3.9 2.6-5.3c.1-1.2-1.4-4.3-1.4-4.3"/><path fill="#89664c" d="M41.6 5.9s-4.5 3-4.4 4.6c.1 1.8 5.6 5 5.6 5s-2.5-3.9-2.6-5.3c-.1-1.2 1.4-4.3 1.4-4.3"/><path fill="#3e4347" d="M47 20.3c-8.6 2.2-15 2.2-15 2.2s-6.4 0-15-2.2l-.7 2.1L32 26l15.7-3.6z"/><path fill="#d3976e" d="M32 25s-7.4.2-20.7-4.6c0 0 5.1 3.8 7.8 7c5.1 6.2 20.8 6.2 25.9 0c2.6-3.2 7.8-7 7.8-7C39.4 25.2 32 25 32 25"/><g fill="#664e27"><path d="M39.6 47.9c-4.9 3.6-10.4 3.6-15.3 0c-.6-.4-1.1.3-.7 1c1.5 2.6 4.5 4.9 8.4 4.9s6.9-2.3 8.4-4.9c.4-.7-.2-1.4-.8-1"/><circle cx="23.2" cy="36.9" r="3.8"/><circle cx="40.8" cy="36.9" r="3.8"/></g></svg>

React

import type { SVGProps } from "react";

export function EmojioneCowboyHatFace(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#89664c" d="M2.1 19.6c-1 2.7 3.6 12.1 7.7 13.2c8.8 2.3 22.1-4 22.1-4s-11.2-5.1-15.4-6.6C5.7 18.1 2.8 17.9 2.1 19.6m59.8 0c1 2.7-3.6 12.1-7.7 13.2c-8.8 2.3-22.1-4-22.1-4s11.2-5.1 15.4-6.6c10.8-4.1 13.7-4.3 14.4-2.6"/><path fill="#ffdd67" d="M55 39c0 12.7-10.3 23-23 23S9 51.7 9 39s10.3-23 23-23s23 10.3 23 23"/><path fill="#d3976e" d="M44.1 11.5c-2.1-3.1.3-4.8-1.4-7.6c-1-1.8-2-2.6-3.5-1.2C36.8 5.2 34 6.2 32 6.2s-4.8-1-7.2-3.5c-1.5-1.5-2.4-.6-3.5 1.2c-1.7 2.8.7 4.5-1.4 7.6c-1.3 1.9-2.6 9.3-2.6 9.3L32 23.7l14.7-2.9s-1.3-7.4-2.6-9.3"/><path fill="#fed0ac" d="M22.4 5.9s4.5 3 4.4 4.6c-.1 1.8-5.6 5-5.6 5s2.5-3.9 2.6-5.3c.1-1.2-1.4-4.3-1.4-4.3"/><path fill="#89664c" d="M41.6 5.9s-4.5 3-4.4 4.6c.1 1.8 5.6 5 5.6 5s-2.5-3.9-2.6-5.3c-.1-1.2 1.4-4.3 1.4-4.3"/><path fill="#3e4347" d="M47 20.3c-8.6 2.2-15 2.2-15 2.2s-6.4 0-15-2.2l-.7 2.1L32 26l15.7-3.6z"/><path fill="#d3976e" d="M32 25s-7.4.2-20.7-4.6c0 0 5.1 3.8 7.8 7c5.1 6.2 20.8 6.2 25.9 0c2.6-3.2 7.8-7 7.8-7C39.4 25.2 32 25 32 25"/><g fill="#664e27"><path d="M39.6 47.9c-4.9 3.6-10.4 3.6-15.3 0c-.6-.4-1.1.3-.7 1c1.5 2.6 4.5 4.9 8.4 4.9s6.9-2.3 8.4-4.9c.4-.7-.2-1.4-.8-1"/><circle cx="23.2" cy="36.9" r="3.8"/><circle cx="40.8" cy="36.9" r="3.8"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#89664c" d="M2.1 19.6c-1 2.7 3.6 12.1 7.7 13.2c8.8 2.3 22.1-4 22.1-4s-11.2-5.1-15.4-6.6C5.7 18.1 2.8 17.9 2.1 19.6m59.8 0c1 2.7-3.6 12.1-7.7 13.2c-8.8 2.3-22.1-4-22.1-4s11.2-5.1 15.4-6.6c10.8-4.1 13.7-4.3 14.4-2.6"/><path fill="#ffdd67" d="M55 39c0 12.7-10.3 23-23 23S9 51.7 9 39s10.3-23 23-23s23 10.3 23 23"/><path fill="#d3976e" d="M44.1 11.5c-2.1-3.1.3-4.8-1.4-7.6c-1-1.8-2-2.6-3.5-1.2C36.8 5.2 34 6.2 32 6.2s-4.8-1-7.2-3.5c-1.5-1.5-2.4-.6-3.5 1.2c-1.7 2.8.7 4.5-1.4 7.6c-1.3 1.9-2.6 9.3-2.6 9.3L32 23.7l14.7-2.9s-1.3-7.4-2.6-9.3"/><path fill="#fed0ac" d="M22.4 5.9s4.5 3 4.4 4.6c-.1 1.8-5.6 5-5.6 5s2.5-3.9 2.6-5.3c.1-1.2-1.4-4.3-1.4-4.3"/><path fill="#89664c" d="M41.6 5.9s-4.5 3-4.4 4.6c.1 1.8 5.6 5 5.6 5s-2.5-3.9-2.6-5.3c-.1-1.2 1.4-4.3 1.4-4.3"/><path fill="#3e4347" d="M47 20.3c-8.6 2.2-15 2.2-15 2.2s-6.4 0-15-2.2l-.7 2.1L32 26l15.7-3.6z"/><path fill="#d3976e" d="M32 25s-7.4.2-20.7-4.6c0 0 5.1 3.8 7.8 7c5.1 6.2 20.8 6.2 25.9 0c2.6-3.2 7.8-7 7.8-7C39.4 25.2 32 25 32 25"/><g fill="#664e27"><path d="M39.6 47.9c-4.9 3.6-10.4 3.6-15.3 0c-.6-.4-1.1.3-.7 1c1.5 2.6 4.5 4.9 8.4 4.9s6.9-2.3 8.4-4.9c.4-.7-.2-1.4-.8-1"/><circle cx="23.2" cy="36.9" r="3.8"/><circle cx="40.8" cy="36.9" r="3.8"/></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%2064%2064%22%3E%3Cpath%20fill%3D%22%2389664c%22%20d%3D%22M2.1%2019.6c-1%202.7%203.6%2012.1%207.7%2013.2c8.8%202.3%2022.1-4%2022.1-4s-11.2-5.1-15.4-6.6C5.7%2018.1%202.8%2017.9%202.1%2019.6m59.8%200c1%202.7-3.6%2012.1-7.7%2013.2c-8.8%202.3-22.1-4-22.1-4s11.2-5.1%2015.4-6.6c10.8-4.1%2013.7-4.3%2014.4-2.6%22%2F%3E%3Cpath%20fill%3D%22%23ffdd67%22%20d%3D%22M55%2039c0%2012.7-10.3%2023-23%2023S9%2051.7%209%2039s10.3-23%2023-23s23%2010.3%2023%2023%22%2F%3E%3Cpath%20fill%3D%22%23d3976e%22%20d%3D%22M44.1%2011.5c-2.1-3.1.3-4.8-1.4-7.6c-1-1.8-2-2.6-3.5-1.2C36.8%205.2%2034%206.2%2032%206.2s-4.8-1-7.2-3.5c-1.5-1.5-2.4-.6-3.5%201.2c-1.7%202.8.7%204.5-1.4%207.6c-1.3%201.9-2.6%209.3-2.6%209.3L32%2023.7l14.7-2.9s-1.3-7.4-2.6-9.3%22%2F%3E%3Cpath%20fill%3D%22%23fed0ac%22%20d%3D%22M22.4%205.9s4.5%203%204.4%204.6c-.1%201.8-5.6%205-5.6%205s2.5-3.9%202.6-5.3c.1-1.2-1.4-4.3-1.4-4.3%22%2F%3E%3Cpath%20fill%3D%22%2389664c%22%20d%3D%22M41.6%205.9s-4.5%203-4.4%204.6c.1%201.8%205.6%205%205.6%205s-2.5-3.9-2.6-5.3c-.1-1.2%201.4-4.3%201.4-4.3%22%2F%3E%3Cpath%20fill%3D%22%233e4347%22%20d%3D%22M47%2020.3c-8.6%202.2-15%202.2-15%202.2s-6.4%200-15-2.2l-.7%202.1L32%2026l15.7-3.6z%22%2F%3E%3Cpath%20fill%3D%22%23d3976e%22%20d%3D%22M32%2025s-7.4.2-20.7-4.6c0%200%205.1%203.8%207.8%207c5.1%206.2%2020.8%206.2%2025.9%200c2.6-3.2%207.8-7%207.8-7C39.4%2025.2%2032%2025%2032%2025%22%2F%3E%3Cg%20fill%3D%22%23664e27%22%3E%3Cpath%20d%3D%22M39.6%2047.9c-4.9%203.6-10.4%203.6-15.3%200c-.6-.4-1.1.3-.7%201c1.5%202.6%204.5%204.9%208.4%204.9s6.9-2.3%208.4-4.9c.4-.7-.2-1.4-.8-1%22%2F%3E%3Ccircle%20cx%3D%2223.2%22%20cy%3D%2236.9%22%20r%3D%223.8%22%2F%3E%3Ccircle%20cx%3D%2240.8%22%20cy%3D%2236.9%22%20r%3D%223.8%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%2064%2064%22%3E%3Cpath%20fill%3D%22%2389664c%22%20d%3D%22M2.1%2019.6c-1%202.7%203.6%2012.1%207.7%2013.2c8.8%202.3%2022.1-4%2022.1-4s-11.2-5.1-15.4-6.6C5.7%2018.1%202.8%2017.9%202.1%2019.6m59.8%200c1%202.7-3.6%2012.1-7.7%2013.2c-8.8%202.3-22.1-4-22.1-4s11.2-5.1%2015.4-6.6c10.8-4.1%2013.7-4.3%2014.4-2.6%22%2F%3E%3Cpath%20fill%3D%22%23ffdd67%22%20d%3D%22M55%2039c0%2012.7-10.3%2023-23%2023S9%2051.7%209%2039s10.3-23%2023-23s23%2010.3%2023%2023%22%2F%3E%3Cpath%20fill%3D%22%23d3976e%22%20d%3D%22M44.1%2011.5c-2.1-3.1.3-4.8-1.4-7.6c-1-1.8-2-2.6-3.5-1.2C36.8%205.2%2034%206.2%2032%206.2s-4.8-1-7.2-3.5c-1.5-1.5-2.4-.6-3.5%201.2c-1.7%202.8.7%204.5-1.4%207.6c-1.3%201.9-2.6%209.3-2.6%209.3L32%2023.7l14.7-2.9s-1.3-7.4-2.6-9.3%22%2F%3E%3Cpath%20fill%3D%22%23fed0ac%22%20d%3D%22M22.4%205.9s4.5%203%204.4%204.6c-.1%201.8-5.6%205-5.6%205s2.5-3.9%202.6-5.3c.1-1.2-1.4-4.3-1.4-4.3%22%2F%3E%3Cpath%20fill%3D%22%2389664c%22%20d%3D%22M41.6%205.9s-4.5%203-4.4%204.6c.1%201.8%205.6%205%205.6%205s-2.5-3.9-2.6-5.3c-.1-1.2%201.4-4.3%201.4-4.3%22%2F%3E%3Cpath%20fill%3D%22%233e4347%22%20d%3D%22M47%2020.3c-8.6%202.2-15%202.2-15%202.2s-6.4%200-15-2.2l-.7%202.1L32%2026l15.7-3.6z%22%2F%3E%3Cpath%20fill%3D%22%23d3976e%22%20d%3D%22M32%2025s-7.4.2-20.7-4.6c0%200%205.1%203.8%207.8%207c5.1%206.2%2020.8%206.2%2025.9%200c2.6-3.2%207.8-7%207.8-7C39.4%2025.2%2032%2025%2032%2025%22%2F%3E%3Cg%20fill%3D%22%23664e27%22%3E%3Cpath%20d%3D%22M39.6%2047.9c-4.9%203.6-10.4%203.6-15.3%200c-.6-.4-1.1.3-.7%201c1.5%202.6%204.5%204.9%208.4%204.9s6.9-2.3%208.4-4.9c.4-.7-.2-1.4-.8-1%22%2F%3E%3Ccircle%20cx%3D%2223.2%22%20cy%3D%2236.9%22%20r%3D%223.8%22%2F%3E%3Ccircle%20cx%3D%2240.8%22%20cy%3D%2236.9%22%20r%3D%223.8%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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