> ## 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="Свойства">
    | Свойства  | Тип     | Описание                                                                                                                                                |
    | --------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- |
    | className | строка  | Необязательное имя для дополнительной стилизации                                                                                                        |
    | цвет      | строка  | Цвет тега. Доступные варианты: `зелёный`, `бирюзовый`, `небесно-голубой`, `синий`, `фиолетовый`, `розовый`, `красный`, `оранжевый`, `жёлтый` и `серый`. |
    | текст     | строка  | Содержание тега                                                                                                                                         |
    | onClick   | функция | Необязательная функция, вызываемая при нажатии пользователя на тег                                                                                      |
  </Tab>
</Tabs>