---
title: "Customization"
description: "Snag gives partners powerful tools to customize their platform's branding, layout, and theme—no code required. This guide walks through all available customization options to help you tailor your white-labeled experience to your brand and community."
keywords:
  - "loyalty program customization"
  - "Web3 branding"
  - "white label loyalty"
  - "custom loyalty UI"
---

> **For AI agents:** the complete documentation index is at [llms.txt](https://docs.snagsolutions.io/llms.txt). Append `.md` to any page URL for its markdown version.

## Overview

The **Customization** tab is where you manage all visual and branding settings for your platform. It’s organized into three main sections:

1. **Platform Settings** - Define platform-wide identity like name, favicon and currency.
2. **Themes** - Set global colors, typography and custom CSS.
3. **Header** - Control your logo, home page, navigation links and social links.

---

## Platform Settings

These settings define your platform’s core identity and optional capabilities.

<Frame>
  ![Snag admin platform settings with name, favicon, and currency options](/images/customization-1.png)
</Frame>

- **Platform Name**: Sets the name shown in the UI and browser.
- **Favicon**: Upload a 32x32 icon that appears in the browser tab.
- **Delegate Cash**: Toggle [Delegate.cash](http://Delegate.cash) support for secure delegated access.
- **Currency**: Select how prices are displayed - either in Crypto or Fiat.

---

## Themes

Set platform colors to align with your brand identity. Themes define the look and feel of your entire platform.

<Frame>
  ![Snag admin theme settings with color pickers and font configuration](/images/customization-2.png)
</Frame>

### Colors

Define your color system to ensure consistency across all UI components:

- **Primary Color**: Main brand color used for primary buttons and key highlights.
- **Secondary Color**: Applied to secondary buttons and container backgrounds.
- **Background Color**: Sets the default page background color.
- **Text Colors**: Define both **primary** and **secondary** text colors for clear readability.
- **Separator Color**: Used for lines, borders, and dividers between elements.

<Tip>
  Make sure your colors have enough contrast for accessibility.
</Tip>

### Fonts

Choose a default font or upload your own to match your brand typography.

- You can **add multiple fonts**.
- Use **Custom CSS** to target specific elements or sections with your uploaded fonts.

### Custom CSS

Edit the `stylesheet.css` file to add advanced visual overrides or tweaks.

### Page Background

Upload a custom background image or texture - this will appear across **all pages**.

---

## Header

Use this section to personalize the top navigation area of your platform.

<Frame>
  ![Snag admin header settings with logo, navigation links, and social links](/images/customization-3.png)
</Frame>

- **Header Logo**: Upload a PNG or JPG in any ratio. This will be shown in the top-left of your header.
- **Header Text**: Optional label (e.g. "Loyalty Program", "Ecosystem" or "Season 01").
- **Home Page**: Select the default landing page from your available pages.
- **Navigation Links**: Define custom nav items to guide users to key areas of your platform or to external pages.
- **Social Links**: Link social profiles by adding URLs for Twitter, Discord, Telegram and more.
