11.6. Customizing the theme mode color palettes for your Developer Hub instance
You can customize the color palettes of the light and dark theme modes in your Developer Hub instance by configuring the light.palette and dark.palette parameters in the branding.theme section of the app-config.yaml file, as shown in the following example:
app:
branding:
theme:
light:
palette:
primary:
main: <light_primary_color>
navigation:
indicator: <light_indicator_color>
pageTheme:
default:
backgroundColor: [<light_background_color_1>, <light_background_color_2>]
dark:
palette:
primary:
main: <dark_primary_color>
navigation:
indicator: <dark_indicator_color>
pageTheme:
default:
backgroundColor: [<dark_background_color_1>, <dark_background_color_2>]
# ...
light:palette:primary:main-
The main primary color for the light color palette, for example,
#fffffforwhite light:palette:navigation:indicator-
The color of the navigation indicator for the light color palette, which is a vertical bar that indicates the selected tab in the navigation panel, for example,
#FF0000orred light:pageTheme:default:backgroundColor-
The background color for the default page theme for the light color palette, for example,
#fffffforwhite dark:palette:primary:main-
The main primary color for the dark color palette, for example,
#000000orblack dark:palette:navigation:indicator-
The color of the navigation indicator for the dark color palette, which is a vertical bar that indicates the selected tab in the navigation panel, for example,
#FF0000orred dark:pageTheme:default:backgroundColor-
The background color for the default page theme for the dark color palette, for example,
#000000orblack
Additional resources