> ## 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.

# علامة

مكوّن لتصنيف المحتوى أو وسمه بصريًا.

<Tabs>
  <Tab title="استخدام">
    ```jsx theme={null}
    import { Tag } from "@/ui/display/tag/components/Tag";

    export const MyComponent = () => {
      return (
        <Tag
          className
          color="red"
          text="Urgent"
          onClick={() => console.log("click")}
        />
      );
    };
    ```
  </Tab>

  <Tab title="المحددات">
    | المحددات   | النوع | الوصف                                                                                                                 |
    | ---------- | ----- | --------------------------------------------------------------------------------------------------------------------- |
    | اسم الفئة  | نص    | اسم اختياري لتنسيقات إضافية                                                                                           |
    | اللون      | نص    | لون العلامة. الخيارات تشمل: `أخضر`, `تركواز`, `سماوي`, `أزرق`, `أرجواني`, `وردي`, `أحمر`, `برتقالي`, `أصفر`, `رمادي`. |
    | نص         | نص    | محتوى العلامة                                                                                                         |
    | عند\_النقر | دالة  | دالة اختيارية تُستدعى عند نقر المستخدم على العلامة                                                                    |
  </Tab>
</Tabs>