= Branding
:description: Your app's name, color and logo on the sign-in page and in every email your service sends. Three fields, one page, and the emails and the login page follow.
:keywords: white label backend, custom email branding, branded login page, app name in emails, logo in transactional email, OAuth login page branding
:group: Build
:order: 45

Your service shows pages and sends emails that your users see without passing through your app: the sign-in page an AI agent such as Claude opens, and the emails for verification, password reset, invitations and Stripe orders. **Branding** puts your app's name, color and logo on all of them.

What you get:

* **One place.** Set the name, the color and the logo once. Every email and the sign-in page use them.
* **Nothing to write.** Our templates and our page stay as they are, with your brand on them. To change the words, replace them, as the last section says.
* **Safe defaults.** Leave a field empty and the service uses its own name, our color and our logo.

== The three fields

[cols="1,3"]
|===
| Field | What it is for

| **App name**
| In the subject and the header of the emails, and on the sign-in page. Up to 60 characters. Empty, it is the service's name.

| **Color**
| The header of the emails and the buttons, as `#rrggbb`. The text over it turns white or dark on its own, by contrast. Empty, it is our dark blue.

| **Logo**
| The address of a PNG or SVG image you host, `https://`, shown 40 pixels high above the name. Keep it where it is: emails already sent point there. Empty, it is our logo.
|===

Click **Save**: it takes effect within a minute. **Back to the defaults** clears the three fields.

== The previews

The page shows what your users get, updated as you type:

* **The sign-in page**, as an agent's user sees it at `https://c0ffee.ulabase.app/oauth/login`: your logo, your name, your color on the button.
* **The emails**: verification, password reset, invitation and the Stripe order confirmation, with sample names and links. The subject is shown above the message. A user gets the text in their language, English or Italian; the preview shows English.

== Beyond the brand

The brand changes every page and email the service shows in your app's name. To change the words or the layout, replace them:

* **Your own email templates.** Paste them on the xref:signup-mgmt.adoc#email-templates[Sign-up] page for verification, reset and invitation, and on the xref:stripe.adoc[Stripe] page for orders and subscriptions. Start from ours: the brand's placeholders, `{{app-name}}`, `{{app-color}}`, `{{app-color-fg}}` and `{{app-logo}}`, work in your templates too. Your own templates go out only from your own mail server, set on the xref:emails.adoc[Email] page; from our address, only our templates leave, with your brand.
* **Your own sign-in page.** Host a page and set its URL under *OAuth login page* on the xref:mcp.adoc[MCP] page. Copy RESTHeart's page at the version your service runs, linked from the Branding page, and read its contract in the RESTHeart documentation. The page calls `/authorize`, `/authorize/providers` and `/authorize/offer` with relative paths: hosted elsewhere, point them at your service's address.

== Do it from the command line

The same three values, as configuration you keep in git, with xref:cli.adoc[`ulabase`]. Branding is a feature like every other, always on: `getFeatureConfig` and `updateFeatureConfig` with the id `branding`:

[source,typescript]
----
import { defineSetup, step } from '@ulabase/cli';

const brand = {
  name: 'My Shop',
  color: '#0f766e',
  logo: 'https://myshop.example.com/logo.png',
};

export default defineSetup('Branding', [
  step('brand set', {
    async check({ admin, srvId }) {
      const current = await admin.getFeatureConfig(srvId, 'branding');
      return current['name'] === brand.name && current['color'] === brand.color && current['logo'] === brand.logo;
    },
    apply: ({ admin, srvId }) => admin.updateFeatureConfig(srvId, 'branding', brand),
  }),
]);
----

The configuration is replaced as a whole: leave a key out and its default comes back. What is not a brand, a color that is not `#rrggbb`, a logo that is not an https PNG or SVG, is refused with 400 and the reason.

== Related pages

* xref:signup-mgmt.adoc[Sign-up, login and invitations]: the emails your users get when they register, and your own templates for them.
* xref:emails.adoc[Email]: how many emails you can send, and how to send from your own address.
* xref:mcp.adoc[MCP server]: the sign-in page an agent opens, and how to use your own.
* xref:stripe.adoc[Stripe billing]: order and subscription emails.