# Themes

Package provides 3 themes currently.

* default - classic theme 
* github - github style 
* modern - Elegant interfaces designed to align with modern aesthetics.

You can change the theme using `theme` key in the config file.

```php
// commenter.php

return [
     /**
     * Available themes default,github,modern
     */
    'theme' => 'default',
]
```

### Changing Colors

Most of the time, all you need is to adjust the colors of your commenting system to match your site's design. You can easily do this by updating the relevant keys in the configuration files. For advanced configurations, please refer to the [customization section](/commenter/advance/customization.md).

<figure><img src="/files/t1kIkw47rRofCGyYf8EY" alt=""><figcaption></figcaption></figure>

```php
// comments.php

return [
    'theme' => 'modern',

    'primary_color' => '#000000',

    'secondary_color' => '#000000',

    'bg_primary_color' => '#ededed',

    'bg_secondary_color' => 'white',

    'active_color' => 'rgb(209,213,219)',

    'hover_color' => 'rgb(229,231,235)',

    'button_color' => '#0000FF',

    'button_hover_color' => '#0707a5',

]
```

{% hint style="success" %}
If you change hover colors, you must add the corresponding colors to the **safelist** in the **Tailwind** config.

```
safelist: [
    "hover:bg-[rgb(229,231,235)]!",
    "hover:bg-[rgb(229,231,235)]",
    "hover:bg-[#0707a5]!",
    "hover:bg-[#0707a5]",
],
```

{% endhint %}

### Default

<figure><img src="/files/9CqYDVsthXq9xa2PgfPU" alt=""><figcaption></figcaption></figure>

### GitHub

<figure><img src="/files/KpLGbi7IXwLlGfKcRTsd" alt=""><figcaption></figcaption></figure>

### Modern

<figure><img src="/files/FHIZ8PLLPFkfQnV0ha5d" alt=""><figcaption></figcaption></figure>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://lakm.gitbook.io/commenter/basics/themes.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.