ICONYZ
العربية
أيقونة Sun Hat من IconPark

أيقونة Sun Hat

icon-park:sun-hat

أيقونة Sun Hat (icon-park:sun-hat) أيقونة SVG مجانية من مجموعة IconPark من تصميم ByteDance. مرسومة على شبكة 48 × 48. تُنشر IconPark icons بموجب ترخيص Apache 2.0، الذي يسمح باستخدامها في المشاريع الشخصية والتجارية. انسخها كشيفرة SVG أو JSX أو Vue أو Svelte، أو نزّل ملف SVG.

المجموعة
IconPark
المؤلف
ByteDance
الترخيص
Apache-2.0
الحجم
48 × 48
الفئة
الملابس
الوسوم
sunhat
تنزيل SVG

شيفرة SVG

<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><g fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"><path fill="#2F88FF" d="M12 10C12 8.89543 12.8954 8 14 8H34C35.1046 8 36 8.89543 36 10V20H12V10Z"/><path d="M44 35C42.8917 36.3333 41.625 40 36.4 40C33.6627 40 29.9439 38.3161 25 37"/><path d="M4 35C4 35 10 26 12 20H36C38 26 44 35 44 35C38 31 19 40 12 40C6.5 40 5.16667 36.3333 4 35Z"/></g></svg>

كيفية استخدام أيقونة Sun Hat

React

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

<Icon icon="icon-park:sun-hat" width="24" />

Vue

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

<template>
  <Icon icon="icon-park:sun-hat" width="24" />
</template>

Svelte

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

<Icon icon="icon-park:sun-hat" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[icon-park--sun-hat]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/icon-park -->
<div class="i-icon-park:sun-hat"></div>

مكوّن ويب

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

<iconify-icon icon="icon-park:sun-hat"></iconify-icon>

صورة HTML

<img src="https://iconyz.com/api/public/svg/icon-park/sun-hat.svg" alt="أيقونة Sun Hat" width="24" height="24">

أيقونات ذات صلة في IconPark

أيقونة Sun Hat في مجموعات أخرى

الأسئلة الشائعة حول أيقونة Sun Hat

هل أيقونة Sun Hat مجانية للاستخدام التجاري؟

نعم. تُنشر IconPark icons بموجب ترخيص Apache 2.0، الذي يسمح باستخدامها في المشاريع الشخصية والتجارية.

كيف أستخدم أيقونة Sun Hat في React؟

ثبّت @iconify/react واعرض <Icon icon="icon-park:sun-hat" />، أو استخدم «نسخ الشيفرة» في هذه الصفحة للحصول على مكوّن React مستقل.

كيف أضيف أيقونة Sun Hat إلى صفحة ويب؟

اربط ملف SVG في وسم صورة: <img src="https://iconyz.com/api/public/svg/icon-park/sun-hat.svg" alt="أيقونة Sun Hat">، أو الصق شيفرة SVG مباشرة في الصفحة لتنسيقها باستخدام CSS.

تصفح كل أيقونات IconPark →