> ## Documentation Index
> Fetch the complete documentation index at: https://docs.twenty.com/llms.txt
> Use this file to discover all available pages before exploring further.

# الأيقونات

<Frame>
  <img src="https://mintcdn.com/twenty/GMeQVDsw5ST_LXpE/images/user-guide/objects/objects.png?fit=max&auto=format&n=GMeQVDsw5ST_LXpE&q=85&s=f753eac3bada05044c64e7af9ddea9ab" alt="رأس الصفحة" width="1440" height="680" data-path="images/user-guide/objects/objects.png" />
</Frame>

قائمة بالأيقونات المستخدمة في جميع أنحاء تطبيقنا.

## أيقونات Tabler

نستخدم أيقونات Tabler لـ React في جميع أنحاء التطبيق.

<Tabs>
  <Tab title="التثبيت">
    <br />

    ```
    yarn add @tabler/icons-react
    ```
  </Tab>

  <Tab title="الإزاحة">
    يمكنك استيراد كل أيقونة كمكون. إليك مثال:

    <br />

    ```jsx theme={null}
    import { IconArrowLeft } from "@tabler/icons-react";

    export const MyComponent = () => {
      return <IconArrowLeft color="red" size={48} />;
    };
    ```
  </Tab>

  <Tab title="الإزاحة">
    | الإزاحة     | النوع  | الوصف                            | الإعداد الافتراضي |
    | ----------- | ------ | -------------------------------- | ----------------- |
    | الحجم       | رقم    | ارتفاع وعرض الأيقونة بالبكسل     | 24                |
    | اللون       | string | لون الأيقونات                    | اللون الحالي      |
    | الخط العريض | رقم    | عرض الخط العريض للأيقونة بالبكسل | 2                 |
  </Tab>
</Tabs>

## أيقونات مخصصة

بالإضافة إلى أيقونات Tabler، يستخدم التطبيق أيضًا بعض الأيقونات المخصصة.

### أيقونة دفتر العناوين

يعرض أيقونة دفتر العناوين.

<Tabs>
  <Tab title="الاستخدام">
    ```jsx theme={null}
    import { IconAddressBook } from 'twenty-ui/display';

    export const MyComponent = () => {
      return <IconAddressBook size={24} stroke={2} />;
    };
    ```
  </Tab>

  <Tab title="خصائص">
    | خصائص       | النوع | الوصف                            | الإعداد الافتراضي |
    | ----------- | ----- | -------------------------------- | ----------------- |
    | الحجم       | رقم   | ارتفاع وعرض الأيقونة بالبكسل     | 24                |
    | الخط العريض | رقم   | عرض الخط العريض للأيقونة بالبكسل | 2                 |
  </Tab>
</Tabs>