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

# Themes

> Customize the appearance of your documentation

export const ThemeCard = ({title, description, image, href}) => {
  return <div className="flex mt-4 gap-12 group">
      <div className="flex-1">
        <h4 className="mt-0">{title}</h4>
        <div class="prose-sm prose-gray mb-4">{description}</div>
        <a href={href} className="not-prose text-sm font-medium text-gray-500 hover:text-gray-700 dark:hover:text-gray-300">
          See preview
        </a>
      </div>
      <div className="flex-1">
        <a href={href}>
          <img className="mt-0 rounded-xl" src={image} alt={title} style={{
    pointerEvents: 'none'
  }} />
        </a>
      </div>
    </div>;
};

We offer pre-built themes so you can differentiate the look and feel of your documentation based on your brand.

## Configuration

You can configure the theme in the `docs.json` file.

For example, to use the `maple` theme, you can add the following to your `docs.json` file:

```json theme={null}
{
  "theme": "maple"
}
```

## Available Themes

There are a variety of themes to choose from.

<br />

<ThemeCard title="Mint" description="Classic documentation theme with time-tested layouts and familiar navigation." image="https://mintcdn.com/aihubmix/UgvkHPDoK6o04763/images/themes/mint.png?fit=max&auto=format&n=UgvkHPDoK6o04763&q=85&s=50e4e688bfb13b2e84191a331ebf4c1a" href="https://mint.mintlify.app" width="1200" height="630" data-path="images/themes/mint.png" />

<ThemeCard title="Maple" description="Modern, clean aesthetics perfect for AI and SaaS products." image="https://mintcdn.com/aihubmix/UgvkHPDoK6o04763/images/themes/maple.png?fit=max&auto=format&n=UgvkHPDoK6o04763&q=85&s=deaab727d482dbf7c702e626d1a838b3" href="https://maple.mintlify.app" width="1200" height="630" data-path="images/themes/maple.png" />

<ThemeCard title="Palm" description="Sophisticated fintech theme with deep customization for enterprise documentation." image="https://mintcdn.com/aihubmix/UgvkHPDoK6o04763/images/themes/palm.png?fit=max&auto=format&n=UgvkHPDoK6o04763&q=85&s=bc09a6005915ac840105a5b55b645cf4" href="https://palm.mintlify.app" width="1200" height="630" data-path="images/themes/palm.png" />

<ThemeCard title="Willow" description="Stripped-back essentials for distraction-free documentation." image="https://mintcdn.com/aihubmix/UgvkHPDoK6o04763/images/themes/willow.png?fit=max&auto=format&n=UgvkHPDoK6o04763&q=85&s=e00cbb697fc7dda51c9c8b5df71d515c" href="https://willow.mintlify.app" width="1200" height="630" data-path="images/themes/willow.png" />

<ThemeCard title="Linden" description="Retro terminal vibes with monospace fonts for that 80s hacker aesthetic." image="https://mintcdn.com/aihubmix/UgvkHPDoK6o04763/images/themes/linden.png?fit=max&auto=format&n=UgvkHPDoK6o04763&q=85&s=0d3f8c915172c6e9cdae6e0c0f8a4dbb" href="https://linden.mintlify.app" width="960" height="564" data-path="images/themes/linden.png" />
