> ## Documentation Index
> Fetch the complete documentation index at: https://docs.upmetr.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Organization Settings & Whitelabeling
> Customize your organization's identity with brand colors, a custom logo, and your own domain
Upmetr allows you to fully customize your organization's identity so the platform looks and feels like your own product. You can set a brand name, upload a custom logo, define brand colors for both light and dark themes, and configure a custom domain.
Navigate to **Settings > Organization** to manage these settings.
Only **Superadmins** can access organization settings. Whitelabeling features (custom logo, brand colors, and custom domain) require the **Enterprise** plan.
## Organization Name
The **Organization Info** section displays your organization's core details: name, slug, owner email, and creation date. The organization name is set during registration and appears throughout the app.
The **Brand Name** field lets you override the display name shown in the sidebar and emails. If left empty, the organization name is used instead.
1. Go to **Settings > Organization**
2. Under **Branding**, enter your preferred name in the **Brand Name** field
3. Click **Save Branding**
Use a short brand name (1-2 words) for the best appearance in the sidebar.
## Custom Logo
Upload your own logo to replace the default Upmetr icon in the sidebar.
1. Go to **Settings > Organization**
2. Under **Branding > Logo**, click **Upload Logo**
3. Select your logo file
4. Click **Save Branding**
**Supported formats:** PNG, JPG, SVG, WebP
**Maximum file size:** 2 MB
**Recommended dimensions:** Square images work best (e.g., 96x96 or 128x128 pixels). The logo is displayed at 96x96 in the settings preview and scaled down in the sidebar.
To remove a custom logo, click the **Remove** button next to the logo preview. The default Upmetr icon will be restored.
Use an SVG logo for the sharpest rendering across all screen sizes. If using PNG or JPG, export at 2x resolution (e.g., 192x192 for a 96px display) for crisp results on high-DPI screens.
## Brand Colors
Upmetr supports independent color customization for light and dark themes. You configure just **4 color values**, and Upmetr automatically derives all the CSS variables needed to theme the entire interface.
### The 4 Color Fields
| Field | Theme | Default | Purpose |
| -------------------- | ----- | --------- | ------------------------------------------------- |
| **Dark Accent** | Dark | `#0ED4C7` | Primary action color (buttons, links, highlights) |
| **Dark Background** | Dark | `#0A0B0F` | Page background color |
| **Light Accent** | Light | `#0AA89D` | Primary action color for light mode |
| **Light Background** | Light | `#F5F7FA` | Page background color for light mode |
### Setting Brand Colors
1. Go to **Settings > Organization**
2. Under **Branding**, find the **Dark Theme** and **Light Theme** color panels
3. For each panel, use the color picker or type a hex value (e.g., `#FF6B35`) for the accent and background colors
4. Check the **Preview** swatch below each panel to see how your colors look together
5. Click **Save Branding**
### Derived Variables
From your 4 inputs, Upmetr automatically computes 9 CSS variables per theme:
* **From the accent color:** accent, accent-hover (slightly darker), and accent-text (white or dark, chosen for contrast)
* **From the background color:** page background, card background, hover state, border color, text color, and muted text color
This means you never need to manually pick hover states, border shades, or text colors. Upmetr handles contrast and consistency automatically.
Choose accent colors with enough contrast against both light and dark backgrounds. Very light accent colors (e.g., pastel yellow) may be hard to read in light mode. Use the preview swatches to verify readability before saving.
## Custom Domain
Configure a custom domain so your team accesses Upmetr through your own URL (e.g., `monitor.yourcompany.com`) instead of the default Upmetr domain.
1. Go to **Settings > Organization**
2. Under **Custom Domain**, enter your desired domain (e.g., `monitor.yourcompany.com`)
3. Click **Save Domain**
4. In your DNS provider, create a **CNAME** record pointing your domain to your Upmetr instance
| Record Type | Name | Value |
| ----------- | --------- | ---------------- |
| CNAME | `monitor` | `app.upmetr.com` |
DNS changes can take up to 24-48 hours to propagate, though most providers update within minutes. SSL certificates are provisioned automatically once the CNAME is verified.
To remove a custom domain, clear the domain field and click **Save Domain**.
## How Branding Works
Upmetr's branding system is powered by the **BrandContext**, which reads your organization's brand settings from the session and applies them in real time:
* **Colors** are applied as CSS custom properties on the root HTML element. When the user toggles between light and dark mode, the appropriate set of brand colors is activated automatically.
* **Logo** appears in the sidebar, replacing the default Upmetr icon.
* **Brand name** replaces "Upmetr" in the sidebar header and transactional emails.
* Changes take effect **immediately** after saving, with no page reload required. Other team members will see the new branding on their next page load or session refresh.
Both light and dark themes are independently customizable. If you only set dark theme colors, the light theme will continue using Upmetr defaults (and vice versa).
## Resetting to Defaults
To revert to the default Upmetr branding:
1. Go to **Settings > Organization**
2. Clear all four color fields (delete the hex values so they are empty)
3. Clear the **Brand Name** field
4. Click **Remove** on the logo (if one is uploaded)
5. Click **Save Branding**
When color fields are empty, Upmetr's default teal theme (`#0ED4C7` dark accent, `#0AA89D` light accent) is restored automatically.
## Troubleshooting
* Verify you clicked **Save Branding** after changing the colors.
* Try refreshing the page. In rare cases, the session needs to be updated for changes to take effect.
* Ensure your hex values are valid 6-character hex codes (e.g., `#0ED4C7`). Shorthand codes like `#FFF` are not supported.
* If you set colors for only one theme (e.g., dark), the other theme (light) will continue using Upmetr defaults. Make sure you configured the correct theme.
* Use a **square** image for best results (e.g., 96x96 or 128x128 pixels).
* The maximum file size is **2 MB**. If your logo file is larger, compress it or reduce its dimensions before uploading.
* SVG files scale perfectly at any size. If your PNG or JPG looks blurry, try uploading a higher-resolution version.
* Transparent backgrounds (PNG or SVG) work best since the logo is displayed over the sidebar background.
* Verify the CNAME record is correctly configured in your DNS provider. Use a tool like `dig monitor.yourcompany.com CNAME` or an online DNS checker to confirm propagation.
* DNS propagation can take up to 48 hours. If you just added the record, wait and try again later.
* Make sure you entered the domain **without** a protocol prefix (use `monitor.yourcompany.com`, not `https://monitor.yourcompany.com`).
* Check that your DNS provider does not have a conflicting A record for the same subdomain.
Brand settings are stored in the user session. Other team members will see updates on their next login or page refresh. If a team member still sees old branding, ask them to log out and log back in to force a session refresh.