ICONYZ
Bahasa Indonesia
Ikon Cowboy Hat Face dari Fluent Emoji

Ikon Cowboy Hat Face

fluent-emoji:cowboy-hat-face

Ikon Cowboy Hat Face (fluent-emoji:cowboy-hat-face) adalah ikon SVG gratis dari set Fluent Emoji karya Microsoft Corporation. Ikon ini digambar pada grid 32 × 32. Fluent Emoji icons dirilis di bawah lisensi MIT, yang mengizinkan penggunaan dalam proyek pribadi maupun komersial. Salin sebagai kode SVG, JSX, Vue, atau Svelte, atau unduh file SVG-nya.

Set ikon
Fluent Emoji
Pembuat
Microsoft Corporation
Lisensi
MIT
Ukuran
32 × 32
Tag
cowboyhat, hatface, cowboyhatface
Download SVG

Kode SVG

<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><g fill="none"><g filter="url(#i2Zrh7s)"><path fill="url(#iNVipXb)" d="M15.962 30.933c8.002 0 12-5.372 12-12c0-6.627-3.998-12-12-12s-12 5.373-12 12c0 6.628 3.998 12 12 12"/></g><path fill="url(#i05ziEc)" d="M15.962 30.933c8.002 0 12-5.372 12-12c0-6.627-3.998-12-12-12s-12 5.373-12 12c0 6.628 3.998 12 12 12"/><path fill="url(#iiLJltc)" d="M15.962 30.933c8.002 0 12-5.372 12-12c0-6.627-3.998-12-12-12s-12 5.373-12 12c0 6.628 3.998 12 12 12"/><path fill="url(#i4eANTc)" d="M18.856 2a3.1 3.1 0 0 0-1.839.602a1.524 1.524 0 0 1-2.12 0A3.1 3.1 0 0 0 13.057 2C11.35 2 9.962 3.362 9.962 5.04v4.967h11.99V5.04c0-1.678-1.387-3.04-3.096-3.04"/><g filter="url(#izlUqmX)"><circle cx="13.35" cy="4.412" r="2.412" fill="url(#iD9Z96c)" fill-opacity=".75"/></g><g filter="url(#iLB0A0d)"><ellipse cx="19.575" cy="4.63" fill="url(#iq22XCc)" fill-opacity=".75" rx="2.215" ry="2.194"/></g><path fill="url(#imcTnnb)" d="M21.96 4.94H9.875a.1.1 0 0 0-.1.1v.9H22.06v-.9a.1.1 0 0 0-.1-.1"/><path fill="url(#ir6DLoc)" d="M21.96 4.94H9.875a.1.1 0 0 0-.1.1v.9H22.06v-.9a.1.1 0 0 0-.1-.1"/><g filter="url(#i8v2wme)" opacity=".8"><path fill="#D3751F" d="M10.638 18.377a3.517 3.517 0 1 0 0-7.034a3.517 3.517 0 0 0 0 7.034"/></g><g filter="url(#iATek7d)"><path fill="#FF9B40" d="M19.952 18.257a3.517 3.517 0 1 0 0-7.033a3.517 3.517 0 0 0 0 7.033"/></g><path fill="#fff" d="M11.482 17.973a3.64 3.64 0 1 0 0-7.28a3.64 3.64 0 0 0 0 7.28m8.94 0a3.64 3.64 0 1 0 0-7.28a3.64 3.64 0 0 0 0 7.28"/><path fill="#3F2931" d="M9.502 14.983c0-1.35 1.1-2.45 2.45-2.45s2.45 1.1 2.45 2.45s-1.1 2.45-2.45 2.45s-2.45-1.1-2.45-2.45m8 0c0-1.35 1.1-2.45 2.45-2.45s2.45 1.1 2.45 2.45s-1.1 2.45-2.45 2.45s-2.45-1.1-2.45-2.45"/><path fill="url(#itqPvad)" d="M26.487 8.106h3.447c0-2.61-1.367-4.72-3.977-4.72c-1.82 0-.54 1.04-1.32 2.56l-17.54-.01c0-1.05.13-2.55-1.7-2.55c-2.61 0-3.81 2.11-3.81 4.72h1.11l2.7-.155c2.93 2.47 5.455 4.14 10.58 4.14c4.14 0 7.58-1.505 10.51-3.985"/><path fill="url(#iQbgkvd)" d="M26.487 8.106h3.447c0-2.61-1.367-4.72-3.977-4.72c-1.82 0-.54 1.04-1.32 2.56l-17.54-.01c0-1.05.13-2.55-1.7-2.55c-2.61 0-3.81 2.11-3.81 4.72h1.11l2.7-.155c2.93 2.47 5.455 4.14 10.58 4.14c4.14 0 7.58-1.505 10.51-3.985"/><path fill="url(#iKihydb)" d="M26.487 8.106h3.447c0-2.61-1.367-4.72-3.977-4.72c-1.82 0-.54 1.04-1.32 2.56l-17.54-.01c0-1.05.13-2.55-1.7-2.55c-2.61 0-3.81 2.11-3.81 4.72h1.11l2.7-.155c2.93 2.47 5.455 4.14 10.58 4.14c4.14 0 7.58-1.505 10.51-3.985"/><path fill="url(#iGE0HXd)" d="M8.057 5.873s-.02.71.01 1.31c.12 2.17 1.86 3.8 1.86 3.8s-.91-.392-1.669-.755c-.387-.186-.857-.13-1.155.179c-1.092 1.134-1.622 2.118-1.622 2.118s-1.527 0-3.004-1.192c-1.26-1.1-1.43-2.76-1.43-2.76s-.68-3.95 3.14-5.29c3.07-1.07 3.86.55 3.86 1.69c0 .22.01.9.01.9"/><path fill="url(#ie8DJad)" d="M8.057 5.873s-.02.71.01 1.31c.12 2.17 1.86 3.8 1.86 3.8s-.91-.392-1.669-.755c-.387-.186-.857-.13-1.155.179c-1.092 1.134-1.622 2.118-1.622 2.118s-1.527 0-3.004-1.192c-1.26-1.1-1.43-2.76-1.43-2.76s-.68-3.95 3.14-5.29c3.07-1.07 3.86.55 3.86 1.69c0 .22.01.9.01.9"/><g filter="url(#i4K8Pxe)"><path fill="url(#igr9wOd)" d="M1.282 8.249c.74-2.6 4.365-.801 6.111 1.263c.293.347.593.586.913.736l-.006.016l-.076-.036c-.388-.186-.858-.131-1.154.18a8.3 8.3 0 0 0-1.764 1.684s-1.297 0-2.75-1.219A3.63 3.63 0 0 1 1.31 8.67c-.041-.258-.1-.17-.029-.421"/></g><path fill="url(#ilP1Yxs)" d="M23.87 5.876s.02.71-.01 1.31c-.12 2.17-1.867 3.738-1.867 3.738s.913-.356 1.672-.702c.391-.178.862-.123 1.157.189c1.072 1.133 1.529 2.114 1.529 2.114s1.55.17 3.1-1.19c1.26-1.1 1.43-2.76 1.43-2.76s.68-3.95-3.14-5.29c-3.07-1.07-3.86.55-3.86 1.69c0 .22-.01.9-.01.9"/><path fill="url(#ikjXxYJ)" d="M23.87 5.876s.02.71-.01 1.31c-.12 2.17-1.867 3.738-1.867 3.738s.913-.356 1.672-.702c.391-.178.862-.123 1.157.189c1.072 1.133 1.529 2.114 1.529 2.114s1.55.17 3.1-1.19c1.26-1.1 1.43-2.76 1.43-2.76s.68-3.95-3.14-5.29c-3.07-1.07-3.86.55-3.86 1.69c0 .22-.01.9-.01.9"/><g filter="url(#id0TnhP)"><path fill="url(#i5t93Nd)" d="M30.805 8.423c-1.08-2.404-4.619-1.066-6.26.995c-.32.4-.645.668-.993.832l.006.017l.076-.037c.387-.186.97-.276 1.265.037c1.072 1.133 1.532 2.09 1.532 2.09s1.293.298 2.843-1.062c.684-.578 1.087-1.287 1.317-1.835c.235-.56.462-.484.213-1.037"/></g><g filter="url(#ixk2osc)" opacity=".25"><path stroke="#fff" stroke-linecap="round" stroke-width=".5" d="M25.187 9.888a19.5 19.5 0 0 0 1.922-2.297"/></g><path fill="url(#iGQ2OAc)" d="M15.984 27.898c-7.905 0-7.905-7.905-7.905-7.905h15.81s0 7.905-7.905 7.905"/><path fill="url(#iuM858d)" d="M8.957 20.31v-.317H23.01v.318a1 1 0 0 1-1 1H9.957a1 1 0 0 1-1-1"/><defs><radialGradient id="iNVipXb" cx="0" cy="0" r="1" gradientTransform="rotate(132.839 9.23 11.728)scale(32.1483)" gradientUnits="userSpaceOnUse"><stop stop-color="#FFF478"/><stop offset=".475" stop-color="#FFB02E"/><stop offset="1" stop-color="#F70A8D"/></radialGradient><radialGradient id="i05ziEc" cx="0" cy="0" r="1" gradientTransform="rotate(90.458 11.34 3.412)scale(29.9527 50.053)" gradientUnits="userSpaceOnUse"><stop offset=".546" stop-color="#C47F18"/><stop offset=".807" stop-color="#C47F18" stop-opacity="0"/></radialGradient><radialGradient id="iiLJltc" cx="0" cy="0" r="1" gradientTransform="rotate(90 .014 15.949)scale(15.3315)" gradientUnits="userSpaceOnUse"><stop offset=".824" stop-color="#F59639" stop-opacity="0"/><stop offset="1" stop-color="#FF63C4"/></radialGradient><radialGradient id="iD9Z96c" cx="0" cy="0" r="1" gradientTransform="matrix(1.28646 -1.44727 1.66238 1.47767 13.788 4.412)" gradientUnits="userSpaceOnUse"><stop stop-color="#BA7D72"/><stop offset=".866" stop-color="#BA7D72" stop-opacity="0"/></radialGradient><radialGradient id="iq22XCc" cx="0" cy="0" r="1" gradientTransform="matrix(1.18134 -1.3166 1.5139 1.35835 19.977 4.63)" gradientUnits="userSpaceOnUse"><stop stop-color="#BA7D72"/><stop offset=".866" stop-color="#BA7D72" stop-opacity="0"/></radialGradient><radialGradient id="iQbgkvd" cx="0" cy="0" r="1" gradientTransform="rotate(89.354 5.611 10.477)scale(8.31303 13.5711)" gradientUnits="userSpaceOnUse"><stop offset=".807" stop-color="#BA7D72" stop-opacity="0"/><stop offset="1" stop-color="#BA7D72"/></radialGradient><radialGradient id="iKihydb" cx="0" cy="0" r="1" gradientTransform="rotate(90.256 6.219 9.562)scale(10.8311 16.1714)" gradientUnits="userSpaceOnUse"><stop offset=".698" stop-color="#A30599" stop-opacity="0"/><stop offset="1" stop-color="#BF0AB4"/></radialGradient><radialGradient id="ie8DJad" cx="0" cy="0" r="1" gradientTransform="matrix(-2.71125 .5 -1.35914 -7.36988 9.927 8.748)" gradientUnits="userSpaceOnUse"><stop stop-color="#BA7D72"/><stop offset="1" stop-color="#BA7D72" stop-opacity="0"/></radialGradient><radialGradient id="igr9wOd" cx="0" cy="0" r="1" gradientTransform="matrix(-4.24998 -6.34376 5.06812 -3.39537 7.274 14.623)" gradientUnits="userSpaceOnUse"><stop stop-color="#BF0AB4"/><stop offset="1" stop-color="#A30599" stop-opacity="0"/></radialGradient><radialGradient id="ikjXxYJ" cx="0" cy="0" r="1" gradientTransform="matrix(2.71125 .5 -1.35913 7.36988 22 8.75)" gradientUnits="userSpaceOnUse"><stop stop-color="#BA7D72"/><stop offset="1" stop-color="#BA7D72" stop-opacity="0"/></radialGradient><radialGradient id="i5t93Nd" cx="0" cy="0" r="1" gradientTransform="matrix(4.25 -6.34376 5.06811 3.39538 24.583 14.625)" gradientUnits="userSpaceOnUse"><stop stop-color="#BF0AB4"/><stop offset="1" stop-color="#A30599" stop-opacity="0"/></radialGradient><radialGradient id="iGQ2OAc" cx="0" cy="0" r="1" gradientTransform="matrix(0 -9.6614 19.3228 0 15.983 29.655)" gradientUnits="userSpaceOnUse"><stop stop-color="#F70A8D"/><stop offset="1" stop-color="#89029C"/></radialGradient><filter id="i2Zrh7s" width="26" height="26" x="3.962" y="4.933" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx="2" dy="-2"/><feGaussianBlur stdDeviation="2"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.08 0"/><feBlend in2="shape" result="effect1_innerShadow_6808_5273"/></filter><filter id="izlUqmX" width="6.824" height="6.824" x="9.938" y="1" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_6808_5273" stdDeviation=".5"/></filter><filter id="iLB0A0d" width="6.43" height="6.389" x="16.36" y="1.436" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_6808_5273" stdDeviation=".5"/></filter><filter id="i8v2wme" width="9.033" height="9.033" x="6.122" y="10.343" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_6808_5273" stdDeviation=".5"/></filter><filter id="iATek7d" width="9.033" height="9.033" x="15.435" y="10.223" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_6808_5273" stdDeviation=".5"/></filter><filter id="i4K8Pxe" width="9.057" height="7.134" x=".249" y="5.958" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_6808_5273" stdDeviation=".5"/></filter><filter id="id0TnhP" width="9.36" height="7.247" x="22.552" y="6.138" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_6808_5273" stdDeviation=".5"/></filter><filter id="ixk2osc" width="4.422" height="4.797" x="23.937" y="6.341" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_6808_5273" stdDeviation=".5"/></filter><linearGradient id="i4eANTc" x1="15.959" x2="15.959" y1="-.086" y2="9.199" gradientUnits="userSpaceOnUse"><stop stop-color="#9C634D"/><stop offset="1" stop-color="#63332A"/></linearGradient><linearGradient id="imcTnnb" x1="19.181" x2="7.399" y1="4.123" y2="9.154" gradientUnits="userSpaceOnUse"><stop stop-color="#A97C50"/><stop offset="1" stop-color="#875236"/></linearGradient><linearGradient id="ir6DLoc" x1="15.918" x2="15.918" y1="4.6" y2="5.209" gradientUnits="userSpaceOnUse"><stop stop-color="#C59779"/><stop offset="1" stop-color="#C59779" stop-opacity="0"/></linearGradient><linearGradient id="itqPvad" x1="3.746" x2="26.621" y1="7.186" y2="7.186" gradientUnits="userSpaceOnUse"><stop stop-color="#63332A"/><stop offset=".422" stop-color="#9C634D"/><stop offset=".896" stop-color="#63332A"/></linearGradient><linearGradient id="iGE0HXd" x1="5.997" x2="5.216" y1="4.279" y2="13.029" gradientUnits="userSpaceOnUse"><stop stop-color="#9C634D"/><stop offset="1" stop-color="#63332A"/></linearGradient><linearGradient id="ilP1Yxs" x1="25.931" x2="26.712" y1="4.282" y2="13.031" gradientUnits="userSpaceOnUse"><stop stop-color="#9C634D"/><stop offset="1" stop-color="#63332A"/></linearGradient><linearGradient id="iuM858d" x1="15.983" x2="15.983" y1="19.993" y2="21.311" gradientUnits="userSpaceOnUse"><stop stop-color="#ECCDFF"/><stop offset="1" stop-color="#fff"/></linearGradient></defs></g></svg>

Cara memakai ikon Cowboy Hat Face

React

import { Icon } from "@iconify/react";

<Icon icon="fluent-emoji:cowboy-hat-face" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="fluent-emoji:cowboy-hat-face" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="fluent-emoji:cowboy-hat-face" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[fluent-emoji--cowboy-hat-face]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/fluent-emoji -->
<div class="i-fluent-emoji:cowboy-hat-face"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="fluent-emoji:cowboy-hat-face"></iconify-icon>

Gambar HTML

<img src="https://iconyz.com/api/public/svg/fluent-emoji/cowboy-hat-face.svg" alt="Ikon Cowboy Hat Face" width="24" height="24">

Ikon Cowboy Hat Face di set ikon lain

FAQ Ikon Cowboy Hat Face

Apakah ikon Cowboy Hat Face gratis untuk penggunaan komersial?

Ya. Fluent Emoji icons dirilis di bawah lisensi MIT, yang mengizinkan penggunaan dalam proyek pribadi maupun komersial.

Bagaimana cara memakai ikon Cowboy Hat Face di React?

Pasang @iconify/react lalu render <Icon icon="fluent-emoji:cowboy-hat-face" />, atau gunakan “Salin kode” di halaman ini untuk mendapatkan komponen React mandiri.

Bagaimana cara menambahkan ikon Cowboy Hat Face ke halaman web?

Tautkan file SVG di tag gambar: <img src="https://iconyz.com/api/public/svg/fluent-emoji/cowboy-hat-face.svg" alt="Ikon Cowboy Hat Face">, atau tempel kode SVG langsung di halaman untuk menatanya dengan CSS.

Lihat semua Ikon Fluent Emoji →