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

# Onay işareti

<Frame>
  <img src="https://mintcdn.com/twenty/GMeQVDsw5ST_LXpE/images/user-guide/tasks/tasks_header.png?fit=max&auto=format&n=GMeQVDsw5ST_LXpE&q=85&s=4c4e26ebbb9b40e541a945a9cda7c28a" alt="Başlık" width="1440" height="680" data-path="images/user-guide/tasks/tasks_header.png" />
</Frame>

Başarılı veya tamamlanmış bir işlemi temsil eder.

<Tabs>
  <Tab title="Kullanım">
    ```jsx theme={null}
    import { Checkmark } from 'twenty-ui/display';

    export const MyComponent = () => {
      return <Checkmark />;
    };
    ```
  </Tab>

  <Tab title="Özellikler">
    `React.ComponentPropsWithoutRef<'div'>` öğesini genişletir ve normal bir `div` elemanının tüm özelliklerini kabul eder.
  </Tab>
</Tabs>

## Animasyonlu Onay İşareti

Animasyon özelliği eklenmiş bir onay işareti simgesini temsil eder.

<Tabs>
  <Tab title="Kullanım">
    ```jsx theme={null}
    import { AnimatedCheckmark } from 'twenty-ui/display';

    export const MyComponent = () => {
      return (
        <AnimatedCheckmark
          isAnimating={true}
          color="green"
          duration={0.5}
          size={30}
        />
      );
    };
    ```
  </Tab>

  <Tab title="Özellikler">
    | Özellikler  | Tür     | Açıklama                                                 | Varsayılan |
    | ----------- | ------- | -------------------------------------------------------- | ---------- |
    | isAnimating | boolean | Onay işaretinin animasyonlu olup olmadığını kontrol eder | yanlış     |
    | renk        | dize    | Onay işaretinin rengi                                    |            |
    | süre        | sayı    | Animasyonun süresi, saniye cinsinden                     | 0.5 saniye |
    | boyut       | sayı    | Onay işaretinin boyutu                                   | 28 piksel  |
  </Tab>
</Tabs>
