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

# Brand Your Nulix Knowledge Base with Custom Styles

> Customize your Nulix knowledge base with your own logo, favicon, brand colors, fonts, and custom CSS to create a seamless on-brand experience.

Nulix gives you full control over the look and feel of your knowledge base. From your logo and favicon to your primary brand color and custom CSS, every visual detail can be tailored to match your product and company identity — so your knowledge base feels like a natural extension of your brand.

**1. Go to Settings > Appearance**

In your Nulix dashboard, click **Settings** in the left sidebar, then select **Appearance** from the submenu.

**2. Upload your logo**

Click **Upload Logo** and select a PNG or SVG file. Your logo must be no larger than 2 MB. Nulix displays your logo in the knowledge base header across all pages.

**3. Set your primary brand color**

Use the hex color picker to enter your brand's primary color (for example, `#ef7025`). This color is applied to buttons, links, and highlighted UI elements throughout your knowledge base.

**4. Choose a light or dark theme**

Select either the **Light** or **Dark** base theme. Your brand color is layered on top of whichever theme you choose, so pick the one that best complements your palette.

**5. Set your favicon**

Click **Upload Favicon** and provide a square PNG or ICO file (recommended size: 32×32 px). Your favicon appears in browser tabs and bookmarks when readers visit your knowledge base.

**6. Customize the header and footer text**

Edit the **Header Text** field to set a tagline or site name that appears beside your logo. In the **Footer** section, add copyright text, support links, or any other content you want readers to see at the bottom of every page.

## Supported Customizations

Nulix supports the following branding options from the Appearance settings panel:

* **Logo** — PNG or SVG, displayed in the knowledge base header
* **Favicon** — Shown in browser tabs and bookmark lists
* **Brand color** — Applied to interactive elements, buttons, and accent highlights
* **Font** — Choose from a curated preset list including Inter, Roboto, Lato, Merriweather, and Source Sans Pro
* **Header content** — Custom tagline or site name shown next to your logo
* **Footer content** — Links, copyright notice, and supporting text
* **Custom CSS snippet** — Inject additional styles for fine-grained visual control

> [!NOTE]
>
> Custom CSS is available on the **Pro plan and above**. If you're on the Free or Starter plan, the Custom CSS field is visible but disabled. [Upgrade your plan](admin/workspace-settings) to unlock this feature.

> [!TIP]
>
> Always test your brand color against both light and dark backgrounds. Aim for a contrast ratio of at least **4.5:1** between your brand color and white or black text to meet WCAG AA accessibility standards. Tools like [WebAIM Contrast Checker](https://webaim.org/resources/contrastchecker/) can help you verify compliance quickly.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.