cowboy hat icon
cowboy-hat-bold from Phosphor by Phosphor Icons · Bold · MIT Free for personal and commercial use.
- Name
- cowboy-hat-bold
- Set
- Phosphor
- Style
- Bold
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
The same icon in other sets
Use the cowboy hat icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M212 116a12 12 0 0 0-10.18 5.64q-2.48 4-5 7.57l-14.57-76.88A20 20 0 0 0 150.1 40.4l-.18.15L128 58.8l-21.92-18.25l-.18-.15a20 20 0 0 0-32.15 11.9l-14.61 76.92q-2.49-3.61-5-7.57A12 12 0 0 0 44 116a44 44 0 1 0 0 88h168a44 44 0 1 0 0-88M96.07 63.44l19.25 16l.19.15a19.89 19.89 0 0 0 25 0l.19-.15l19.25-16L171.44 124H84.56ZM44 180a20 20 0 0 1-5.94-39.1c11.7 17.38 23.7 30 35 39.1Zm35-26.75l1-5.25h96l1 5.25c-25.33 25-46.71 26.65-49 26.75c-2.29-.1-23.67-1.71-49-26.75M212 180h-29c11.28-9.12 23.28-21.72 35-39.1a20 20 0 0 1-6 39.1"/></svg>
React
import type { SVGProps } from "react";
export function PhCowboyHatBold(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M212 116a12 12 0 0 0-10.18 5.64q-2.48 4-5 7.57l-14.57-76.88A20 20 0 0 0 150.1 40.4l-.18.15L128 58.8l-21.92-18.25l-.18-.15a20 20 0 0 0-32.15 11.9l-14.61 76.92q-2.49-3.61-5-7.57A12 12 0 0 0 44 116a44 44 0 1 0 0 88h168a44 44 0 1 0 0-88M96.07 63.44l19.25 16l.19.15a19.89 19.89 0 0 0 25 0l.19-.15l19.25-16L171.44 124H84.56ZM44 180a20 20 0 0 1-5.94-39.1c11.7 17.38 23.7 30 35 39.1Zm35-26.75l1-5.25h96l1 5.25c-25.33 25-46.71 26.65-49 26.75c-2.29-.1-23.67-1.71-49-26.75M212 180h-29c11.28-9.12 23.28-21.72 35-39.1a20 20 0 0 1-6 39.1"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M212 116a12 12 0 0 0-10.18 5.64q-2.48 4-5 7.57l-14.57-76.88A20 20 0 0 0 150.1 40.4l-.18.15L128 58.8l-21.92-18.25l-.18-.15a20 20 0 0 0-32.15 11.9l-14.61 76.92q-2.49-3.61-5-7.57A12 12 0 0 0 44 116a44 44 0 1 0 0 88h168a44 44 0 1 0 0-88M96.07 63.44l19.25 16l.19.15a19.89 19.89 0 0 0 25 0l.19-.15l19.25-16L171.44 124H84.56ZM44 180a20 20 0 0 1-5.94-39.1c11.7 17.38 23.7 30 35 39.1Zm35-26.75l1-5.25h96l1 5.25c-25.33 25-46.71 26.65-49 26.75c-2.29-.1-23.67-1.71-49-26.75M212 180h-29c11.28-9.12 23.28-21.72 35-39.1a20 20 0 0 1-6 39.1"/></svg> </template>
CSS
.icon-cowboy-hat-bold {
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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M212%20116a12%2012%200%200%200-10.18%205.64q-2.48%204-5%207.57l-14.57-76.88A20%2020%200%200%200%20150.1%2040.4l-.18.15L128%2058.8l-21.92-18.25l-.18-.15a20%2020%200%200%200-32.15%2011.9l-14.61%2076.92q-2.49-3.61-5-7.57A12%2012%200%200%200%2044%20116a44%2044%200%201%200%200%2088h168a44%2044%200%201%200%200-88M96.07%2063.44l19.25%2016l.19.15a19.89%2019.89%200%200%200%2025%200l.19-.15l19.25-16L171.44%20124H84.56ZM44%20180a20%2020%200%200%201-5.94-39.1c11.7%2017.38%2023.7%2030%2035%2039.1Zm35-26.75l1-5.25h96l1%205.25c-25.33%2025-46.71%2026.65-49%2026.75c-2.29-.1-23.67-1.71-49-26.75M212%20180h-29c11.28-9.12%2023.28-21.72%2035-39.1a20%2020%200%200%201-6%2039.1%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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M212%20116a12%2012%200%200%200-10.18%205.64q-2.48%204-5%207.57l-14.57-76.88A20%2020%200%200%200%20150.1%2040.4l-.18.15L128%2058.8l-21.92-18.25l-.18-.15a20%2020%200%200%200-32.15%2011.9l-14.61%2076.92q-2.49-3.61-5-7.57A12%2012%200%200%200%2044%20116a44%2044%200%201%200%200%2088h168a44%2044%200%201%200%200-88M96.07%2063.44l19.25%2016l.19.15a19.89%2019.89%200%200%200%2025%200l.19-.15l19.25-16L171.44%20124H84.56ZM44%20180a20%2020%200%200%201-5.94-39.1c11.7%2017.38%2023.7%2030%2035%2039.1Zm35-26.75l1-5.25h96l1%205.25c-25.33%2025-46.71%2026.65-49%2026.75c-2.29-.1-23.67-1.71-49-26.75M212%20180h-29c11.28-9.12%2023.28-21.72%2035-39.1a20%2020%200%200%201-6%2039.1%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/cowboy-hat-bold.svg?color=%231a73e8&size=48
