أيقونة Button
flat-ui:button
أيقونة Button (flat-ui:button) أيقونة SVG مجانية من مجموعة Flat UI Icons من تصميم Designmodo, Inc.. مرسومة على شبكة 100 × 100. تُنشر Flat UI Icons بموجب ترخيص MIT، الذي يسمح باستخدامها في المشاريع الشخصية والتجارية. انسخها كشيفرة SVG أو JSX أو Vue أو Svelte، أو نزّل ملف SVG.
- المجموعة
- Flat UI Icons
- المؤلف
- Designmodo, Inc.
- الترخيص
- MIT
- الحجم
- 100 × 100
شيفرة SVG
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><clipPath id="SVGlgah6cRj"><circle cx="50" cy="50" r="50"/></clipPath><g fill-rule="evenodd" clip-path="url(#SVGlgah6cRj)" clip-rule="evenodd"><circle cx="50" cy="50" r="50" fill="#D7DBDE"/><path fill="#BDC3C7" d="M10.167 147.834L79 79L21 21l-73 73z"/><path fill="#ECF0F1" d="M-47.5 80a5.506 5.506 0 0 1-5.5-5.5v-49c0-3.033 2.467-5.5 5.5-5.5h49C4.533 20 7 22.467 7 25.5v49C7 77.532 4.533 80 1.5 80z"/><path fill="#8B9298" d="M1.25 21C3.735 21 6 23.015 6 25.5v49A4.5 4.5 0 0 1 1.5 79h-49a4.5 4.5 0 0 1-4.5-4.5v-49a4.5 4.5 0 0 1 4.5-4.5H1m.5-2h-49a6.51 6.51 0 0 0-6.5 6.5v49c0 3.584 2.916 6.5 6.5 6.5h49C5.084 81 8 78.084 8 74.5v-49C8 21.916 5.084 19 1.5 19"/><path fill="#ECF0F1" d="M62.5 8A5.506 5.506 0 0 1 57 2.5v-49c0-3.033 2.468-5.5 5.5-5.5h49c3.032 0 5.5 2.467 5.5 5.5v49c0 3.033-2.468 5.5-5.5 5.5z"/><path fill="#8B9298" d="M111.25-51c2.485 0 4.75 2.015 4.75 4.5v49a4.5 4.5 0 0 1-4.5 4.5h-49A4.5 4.5 0 0 1 58 2.5v-49a4.5 4.5 0 0 1 4.5-4.5H111m.5-2h-49a6.51 6.51 0 0 0-6.5 6.5v49C56 6.084 58.916 9 62.5 9h49c3.584 0 6.5-2.916 6.5-6.5v-49c0-3.584-2.916-6.5-6.5-6.5"/><path fill="#ECF0F1" d="M-11.5 8A5.506 5.506 0 0 1-17 2.5v-49c0-3.033 2.467-5.5 5.5-5.5h49c3.033 0 5.5 2.467 5.5 5.5v49C43 5.533 40.533 8 37.5 8z"/><path fill="#8B9298" d="M37.25-51c2.485 0 4.75 2.015 4.75 4.5v49A4.5 4.5 0 0 1 37.5 7h-49A4.5 4.5 0 0 1-16 2.5v-49a4.5 4.5 0 0 1 4.5-4.5H37m.5-2h-49a6.51 6.51 0 0 0-6.5 6.5v49c0 3.584 2.916 6.5 6.5 6.5h49C41.084 9 44 6.084 44 2.5v-49c0-3.584-2.916-6.5-6.5-6.5"/><path fill="#ECF0F1" d="M62.5 152a5.507 5.507 0 0 1-5.5-5.5v-49c0-3.032 2.468-5.5 5.5-5.5h49c3.032 0 5.5 2.468 5.5 5.5v49c0 3.032-2.468 5.5-5.5 5.5z"/><path fill="#8B9298" d="M111.25 93c2.485 0 4.75 2.015 4.75 4.5v49a4.5 4.5 0 0 1-4.5 4.5h-49a4.5 4.5 0 0 1-4.5-4.5v-49a4.5 4.5 0 0 1 4.5-4.5H111m.5-2h-49a6.51 6.51 0 0 0-6.5 6.5v49c0 3.584 2.916 6.5 6.5 6.5h49c3.584 0 6.5-2.916 6.5-6.5v-49c0-3.584-2.916-6.5-6.5-6.5"/><path fill="#ECF0F1" d="M-11.5 152a5.506 5.506 0 0 1-5.5-5.5v-49c0-3.032 2.467-5.5 5.5-5.5h49c3.033 0 5.5 2.468 5.5 5.5v49c0 3.032-2.467 5.5-5.5 5.5z"/><path fill="#8B9298" d="M37.25 93c2.485 0 4.75 2.015 4.75 4.5v49a4.5 4.5 0 0 1-4.5 4.5h-49a4.5 4.5 0 0 1-4.5-4.5v-49a4.5 4.5 0 0 1 4.5-4.5H37m.5-2h-49a6.51 6.51 0 0 0-6.5 6.5v49c0 3.584 2.916 6.5 6.5 6.5h49c3.584 0 6.5-2.916 6.5-6.5v-49c0-3.584-2.916-6.5-6.5-6.5"/><path fill="#ECF0F1" d="M98.5 80a5.507 5.507 0 0 1-5.5-5.5v-49c0-3.033 2.468-5.5 5.5-5.5h49c3.032 0 5.5 2.467 5.5 5.5v49c0 3.032-2.468 5.5-5.5 5.5z"/><path fill="#8B9298" d="M147.25 21c2.485 0 4.75 2.015 4.75 4.5v49a4.5 4.5 0 0 1-4.5 4.5h-49a4.5 4.5 0 0 1-4.5-4.5v-49a4.5 4.5 0 0 1 4.5-4.5H147m.5-2h-49a6.51 6.51 0 0 0-6.5 6.5v49c0 3.584 2.916 6.5 6.5 6.5h49c3.584 0 6.5-2.916 6.5-6.5v-49c0-3.584-2.916-6.5-6.5-6.5"/><path fill="#ECF0F1" d="M25.5 80a5.506 5.506 0 0 1-5.5-5.5v-49c0-3.033 2.467-5.5 5.5-5.5h49c3.032 0 5.5 2.467 5.5 5.5v49c0 3.032-2.468 5.5-5.5 5.5z"/><path fill="#8B9298" d="M74.25 21c2.485 0 4.75 2.015 4.75 4.5v49a4.5 4.5 0 0 1-4.5 4.5h-49a4.5 4.5 0 0 1-4.5-4.5v-49a4.5 4.5 0 0 1 4.5-4.5H74m.5-2h-49a6.51 6.51 0 0 0-6.5 6.5v49c0 3.584 2.916 6.5 6.5 6.5h49c3.584 0 6.5-2.916 6.5-6.5v-49c0-3.584-2.916-6.5-6.5-6.5"/><path fill="#E1E5E6" d="M59 69a2 2 0 0 1-2 2H43a2 2 0 0 1 0-4h14a2 2 0 0 1 2 2"/><path fill="#fff" d="M59 69H41a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2"/><path fill="#00A184" d="M54.5 42a1.5 1.5 0 1 0 0-3h-7a1.5 1.5 0 0 0-1.5 1.5v18a1.5 1.5 0 1 0 3 0V51h4.5a1.5 1.5 0 0 0 0-3H49v-6z"/><path fill="#fff" d="M74.5 21h-49c-1.76 0-3.268 1.02-4.007 2.493A4.44 4.44 0 0 1 23.5 23h49a4.5 4.5 0 0 1 4.5 4.5v49c0 .726-.188 1.4-.492 2.008C77.979 77.768 79 76.26 79 74.5v-49a4.5 4.5 0 0 0-4.5-4.5"/></g><path d="M50 0C22.386 0 0 22.386 0 50l.025 1C.56 24.955 21.827 4 48 4c26.509 0 48 21.491 48 48c0 26.172-20.954 47.44-47 47.975l1 .025c27.614 0 50-22.387 50-50c0-27.614-22.386-50-50-50" opacity=".15"/></svg>كيفية استخدام أيقونة Button
React
import { Icon } from "@iconify/react";
<Icon icon="flat-ui:button" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="flat-ui:button" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="flat-ui:button" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[flat-ui--button]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/flat-ui -->
<div class="i-flat-ui:button"></div>مكوّن ويب
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="flat-ui:button"></iconify-icon>صورة HTML
<img src="https://iconyz.com/api/public/svg/flat-ui/button.svg" alt="أيقونة Button" width="24" height="24">أيقونة Button في مجموعات أخرى
الأسئلة الشائعة حول أيقونة Button
هل أيقونة Button مجانية للاستخدام التجاري؟
نعم. تُنشر Flat UI Icons بموجب ترخيص MIT، الذي يسمح باستخدامها في المشاريع الشخصية والتجارية.
كيف أستخدم أيقونة Button في React؟
ثبّت @iconify/react واعرض <Icon icon="flat-ui:button" />، أو استخدم «نسخ الشيفرة» في هذه الصفحة للحصول على مكوّن React مستقل.
كيف أضيف أيقونة Button إلى صفحة ويب؟
اربط ملف SVG في وسم صورة: <img src="https://iconyz.com/api/public/svg/flat-ui/button.svg" alt="أيقونة Button">، أو الصق شيفرة SVG مباشرة في الصفحة لتنسيقها باستخدام CSS.