---
title: Branding
description: Replace icons, logos, and images for your app
---

## Overview

To fully rebrand ChatJS, you'll need to replace several image assets and update metadata configuration.

## Icons & Images

### Favicon

| File              | Size | Purpose          |
| ----------------- | ---- | ---------------- |
| `app/favicon.ico` | Any  | Browser tab icon |

### App Icons (PWA/Mobile)

| File                 | Size    | Purpose              |
| -------------------- | ------- | -------------------- |
| `app/apple-icon.png` | 180x180 | iOS home screen icon |
| `public/icon.svg`    | Any     | Scalable icon        |

### Desktop App Icon (Electron)

| File                | Size    | Purpose                                   |
| ------------------- | ------- | ----------------------------------------- |
| `electron/icon.png` | 512x512 | App icon for the Electron desktop wrapper |

If your project includes the Electron scaffold, after replacing `electron/icon.png`, regenerate the platform-specific formats:

```bash
cd electron && bun run generate-icons
```

This produces `electron/build/icon.png` and `electron/build/icon.icns` (macOS) used by Electron and installers.

### Social Image

| File | Size | Purpose |
| --- | --- | --- |
| `app/opengraph-image.png` | 1200x630 | Social media previews (Facebook, Twitter, etc) |

## Metadata

Update `chat.config.ts`:

```ts title="chat.config.ts"
import type { ConfigInput } from "@/lib/config-schema";

const config: ConfigInput = {
  appName: "Your App Name",
  appDescription: "Your app description",
  appUrl: "https://yourdomain.com",
  // ...
};

export default config;
```