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

# Icons

<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="Kopfzeile" width="1440" height="680" data-path="images/user-guide/objects/objects.png" />
</Frame>

Eine Liste von Symbolen, die in unserer App verwendet werden.

## Tabler-Symbole

Wir verwenden Tabler-Symbole für React in der gesamten App.

<Tabs>
  <Tab title="Installation">
    <br />

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

  <Tab title="Props">
    Sie können jedes Symbol als Komponente importieren. Hier ist ein Beispiel:

    <br />

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

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

  <Tab title="Props">
    | Props  | Typ          | Beschreibung                              | Standard     |
    | ------ | ------------ | ----------------------------------------- | ------------ |
    | größe  | nummer       | Die Höhe und Breite des Symbols in Pixeln | 24           |
    | farbe  | Zeichenkette | Die Farbe der Symbole                     | currentColor |
    | Strich | nummer       | Die Strichbreite des Symbols in Pixeln    | 2            |
  </Tab>
</Tabs>

## Benutzerdefinierte Symbole

Zusätzlich zu den Tabler-Symbolen verwendet die App auch einige benutzerdefinierte Symbole.

### Symbol: Adressbuch

Zeigt ein Adressbuchsymbol an.

<Tabs>
  <Tab title="Verwendung">
    ```jsx theme={null}
    import { IconAddressBook } from 'twenty-ui/display';

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

  <Tab title="Eigenschaften">
    | Eigenschaften | Typ    | Beschreibung                              | Standard |
    | ------------- | ------ | ----------------------------------------- | -------- |
    | größe         | nummer | Die Höhe und Breite des Symbols in Pixeln | 24       |
    | Strich        | nummer | Die Strichbreite des Symbols in Pixeln    | 2        |
  </Tab>
</Tabs>