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

# Dark Mode

<Tabs>
  <Tab title="React / Next.js">
    ## Enable Dark Mode on all Components

    To enable Dark Mode on all Components, call the `client.setDarkMode(true)`

    ```jsx theme={null}
    let client = useVeltClient();
    client.setDarkMode(true);
    ```

    ## Enable Dark Mode on individual Components

    To enable Dark Mode on individual components, set the `darkMode` attribute to `true`.

    ```jsx theme={null}
    <VeltComments darkMode={true} />
    <VeltPresence darkMode={true} />
    <VeltCommentsSidebar darkMode={true} />
    <VeltHuddle darkMode={true} />
    <VeltArrows darkMode={true} />
    ```

    API Methods:

    ```jsx theme={null}
    commentElement.enableDarkMode()
    commentElement.disableDarkMode()
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ## Enable Dark Mode on all Components

    To enable Dark Mode on all Components, call the `Velt.setDarkMode(true)`

    ```jsx theme={null}
    Velt.setDarkMode(true);
    ```

    ## Enable Dark Mode on individual Components

    To enable Dark Mode on individual components, set the `dark-mode` attribute to `true`.

    ```jsx theme={null}
    <velt-comments dark-mode="true"></velt-comments>
    <velt-presence dark-mode="true"></velt-presence>
    <velt-comments-sidebar dark-mode="true"></velt-comments-sidebar>
    <velt-huddle dark-mode="true"></velt-huddle>
    <velt-arrows dark-mode="true"></velt-arrows>
    ```

    API Methods:

    ```jsx theme={null}
    commentElement.enableDarkMode()
    commentElement.disableDarkMode()
    ```
  </Tab>
</Tabs>