Apply branding and customization values across the Hubs experience

You can define your Organization's brand identity in the Console and apply it consistently across all Hubs. To do this, see How to apply branding and customization values across the Hubs experience.

The following sections describe the supported UI Customization values and where they are used throughout the interface.

Scope

The UI Customization configuration supports the following branding values:

• Logos
• Titles
• Descriptions
• Favicons
• Support links
• Brand colors

Branding Application

The frontend applies branding values to the following interface elements:

• Sidebar logo
• Login and logout logos
• Browser favicon
• Platform title
• Platform description

Styles Application

The frontend applies brand colors to the following interface elements:

• Primary buttons
• Links
• Highlights
• Main brand accents

UI Customization Schema

The following TypeScript definition shows the complete structure of the UI Customization configuration.

type GEAIUiCustomizationOsCustomization<
  Languages extends GEAILanguageSubtag
> = {
  meta?: {
    title?: GEAIOsUiCustomizationTypeByLanguage<Languages, string>;
    description?: GEAIOsUiCustomizationTypeByLanguage<Languages, string>;
    favicon?: GEAIOsUiCustomizationTypeByLanguage<Languages, string>;
  };
  availableLanguages?: Languages[];
  defaultLanguage?: Languages;
  termsOfServiceLink?: GEAIOsUiCustomizationTypeByLanguage<Languages, string>;
  componentOverrides?: {
    authenticationProcess?: {
      translations?: GEAIAuthenticationProcessTranslationsOverrides;
      logos?: {
        globantLogoWidth?: Partial<Record<GEAILanguageSubtag, string>>;
        globantLogoHeight?: Partial<Record<GEAILanguageSubtag, string>>;
        globantLogoHidden?: boolean;
        logoWidth?: Partial<Record<GEAILanguageSubtag, string>>;
        logoHeight?: Partial<Record<GEAILanguageSubtag, string>>;
      };
    };
    header?: {
      translations?: GEAIHeaderTranslationsOverrides;
      logos?: {
        logoWidth?: Partial<Record<GEAILanguageSubtag, string>>;
        logoHeight?: Partial<Record<GEAILanguageSubtag, string>>;
     };
    };
  };
  styleOverrides?: {
    "base/base"?: {
      cssVariables?: {
        base?: Record<string, string>;
        light?: Record<string, string>;
        dark?: Record<string, string>;
      };
    };
  };
};

type GEAILanguageSubtag = "ar" | "de" | "en" | "es" | "fr" | "it" | "ja" | "pt" | "zh";

The application supports the nine language subtags listed above. Set availableLanguages to restrict the options, and set defaultLanguage to one of the selected values.

Meta

Set title and description as a single text string, or as a language-specific value if you need different text per language. For assets such as the favicon and logos, use either a URL or a data URI. If you use a URL, host the asset on the same domain as the application; otherwise, use a data URI.

Style Overrides

The following tokens control the interface:

Component Overrides

Use componentOverrides to override the UI content and branding of each screen: authentication, header, trial, and contact sales. Every component includes translation and logo definitions. Provide logos as data URIs, and set sizes so they fit correctly.

Authentication Process

type GEAIAuthenticationProcessTranslations<TemplateResult = unknown> = {
  descriptions: Record<GEAIAuthenticationProcessTranslationKey, GEAIAuthenticationProcessTranslationEntry<TemplateResult>>;
  globantLogoSrcDark?: string | undefined;
  globantLogoSrcLight?: string | undefined;
  globantLogoAltText?: string | undefined;
  logoAltText: string;
  logoSrcDark: string;
  logoSrcLight?: string;
  problemLoginNotification: string;
  signInWithGeneXus: string;
  signInWithMicrosoft: string;
  signInWithGoogle: string;
  signInWithGenericProvider: string;
  termsAndConditions?: (termsHref: string, privacyHref?: string) => TemplateResult;
  titles: Record<GEAIAuthenticationProcessTranslationKey, GEAIAuthenticationProcessTranslationEntry<TemplateResult>>;
};

type GEAIAuthenticationProcessTranslationKey =
  | "not-authenticated"
  | "needs-to-select-organization"
  | "access-denied"
  | "signed-out"
  | "no-login-options";

Header

type GEAIHeaderTranslations = {
  "geai-header": {
    alternativeText: {
      brandingLogo: string;
      userAvatar: string;
    };
    logoSrcDark: string;
    logoSrcLight?: string;
    text: {
      changeLanguageDescription: string;
      changeOrganizationDescription: string;
      changeProjectDescription: string;
      noUserInfo: string;
      noModuleData: string;
      noProjectData: string;
      noOrganizationData: string;
    };
  };
};

Availability

Since version 2026-04.