From d90d158195c0a3a66a51e1c3a428b4c14eb798d4 Mon Sep 17 00:00:00 2001 From: Khaled AbuShqear Date: Sat, 11 Apr 2026 21:11:21 +0300 Subject: [PATCH 1/3] docs: add branding object structure documentation Documents the new `branding` config block added to LibreChat's app-config pipeline, covering logos, favicon, browser/PWA metadata, runtime color theme tokens, and UI behavior overrides. Co-Authored-By: Claude Sonnet 4.6 --- .../object_structure/branding.mdx | 156 ++++++++++++++++++ .../librechat_yaml/object_structure/meta.json | 1 + 2 files changed, 157 insertions(+) create mode 100644 content/docs/configuration/librechat_yaml/object_structure/branding.mdx diff --git a/content/docs/configuration/librechat_yaml/object_structure/branding.mdx b/content/docs/configuration/librechat_yaml/object_structure/branding.mdx new file mode 100644 index 000000000..8a61cc574 --- /dev/null +++ b/content/docs/configuration/librechat_yaml/object_structure/branding.mdx @@ -0,0 +1,156 @@ +--- +title: "Branding Object Structure" +icon: Palette +--- + +## Overview + +The `branding` object enables white-label customization of LibreChat. It provides runtime control over logos, favicons, browser metadata, color themes, and UI behavior — without requiring source code changes. + +Branding is resolved through the same app-config pipeline as `interface` and `turnstile`, and is delivered to the frontend via the `/api/config` startup payload. + +These are the top-level fields under `branding`: + +- `appLogo` +- `authLogo` +- `favicon` +- `meta` +- `theme` +- `ui` + +## Example + +```yaml filename="librechat.yaml" +branding: + appLogo: "/assets/my-logo.svg" + authLogo: "/assets/my-auth-logo.svg" + favicon: "/assets/my-favicon.png" + meta: + title: "My Chat App" + description: "Powered by LibreChat" + themeColor: "#0f766e" + pwaName: "My Chat App" + pwaShortName: "ChatApp" + pwaBackgroundColor: "#ffffff" + pwaThemeColor: "#0f766e" + theme: + light: + rgb-primary: "15 118 110" + rgb-accent: "13 148 136" + rgb-surface-primary: "248 250 252" + dark: + rgb-primary: "45 212 191" + rgb-accent: "20 184 166" + rgb-surface-primary: "15 23 42" + ui: + hideProviderUploadForEndpoints: + - "openAI" + - "custom" +``` + +## branding + + + +### appLogo + + + +### authLogo + + + +### favicon + + + +### meta + +Browser and PWA metadata applied at runtime. + +` tag content.', 'Powered by LibreChat'], + ['themeColor', 'String', 'Sets the `` tag. Controls the browser chrome color on mobile devices.', '#0f766e'], + ['pwaName', 'String', 'Full name of the app when installed as a Progressive Web App.', 'My Chat App'], + ['pwaShortName', 'String', 'Short name shown on the home screen when installed as a PWA.', 'ChatApp'], + ['pwaBackgroundColor', 'String', 'Background color of the PWA splash screen.', '#ffffff'], + ['pwaThemeColor', 'String', 'Theme color for the PWA shell.', '#0f766e'], + ]} +/> + +### theme + +Runtime color theme tokens injected into the `ThemeProvider`. Supports separate palettes for `light` and `dark` modes. Both are optional — if only one is provided, it is used for both modes. + +Each palette is a map of CSS variable names (without the `--` prefix) to RGB values as space-separated strings (e.g. `"15 118 110"` for `rgb(15, 118, 110)`). + + + +**Common theme tokens:** + + + +### ui + +UI behavior overrides. + +