Search

Chapter 6. Additional customizations in Red Hat Developer Hub

download PDF

This section describes additional customization options that you can apply to the Red Hat Developer Hub.

Customizing tab tooltip

To customize the tab tooltip, add the following content to your app-config-rhdh.yaml file:

app:
  title: My custom developer hub
Customizing branding of your Developer Hub instance

To customize the branding of your Developer Hub instance, add the following content to your app-config-rhdh.yaml file:

app:
  branding:
    fullLogo: ${BASE64_EMBEDDED_FULL_LOGO}
    iconLogo: ${BASE64_EMBEDDED_ICON_LOGO}
    theme:
      light:
        primaryColor: ${PRIMARY_LIGHT_COLOR}
        headerColor1: ${HEADER_LIGHT_COLOR_1}
        headerColor2: ${HEADER_LIGHT_COLOR_2}
        navigationIndicatorColor: ${NAV_INDICATOR_LIGHT_COLOR}
      dark:
        primaryColor: ${PRIMARY_DARK_COLOR}
        headerColor1: ${HEADER_DARK_COLOR_1}
        headerColor2: ${HEADER_DARK_COLOR_2}
        navigationIndicatorColor: ${NAV_INDICATOR_DARK_COLOR}

In the previous configuration,

  • fullLogo is the logo on the expanded (pinned) sidebar and expects a base64 encoded image.
  • iconLogo is the logo on the collapsed (unpinned) sidebar and expects a base64 encoded image.
  • primaryColor is the color of links and most buttons to the inputted color. The supported formats for primaryColor include:

    • #nnn
    • #nnnnnn
    • rgb()
    • rgba()
    • hsl()
    • hsla()
    • color()
  • headerColor1 (left-side of the banner) and headerColor2 (right-side of the banner) changes the color of the header banner of each page, as well as the banner for template cards. The supported formats for headerColor1 and headerColor2 include:

    • #nnn
    • #nnnnnn
    • rgb()
    • rgba()
    • hsl()
    • hsla()
    • color()
  • navigationIndicatorColor changes the color of the indicator in the sidebar that indicates which tab you are on. The supported formats for navigationIndicatorColor include:

    • #nnn
    • #nnnnnn
    • rgb()
    • rgba()
    • hsl()
    • hsla()
    • color()
Red Hat logoGithubRedditYoutubeTwitter

Learn

Try, buy, & sell

Communities

About Red Hat Documentation

We help Red Hat users innovate and achieve their goals with our products and services with content they can trust.

Making open source more inclusive

Red Hat is committed to replacing problematic language in our code, documentation, and web properties. For more details, see the Red Hat Blog.

About Red Hat

We deliver hardened solutions that make it easier for enterprises to work across platforms and environments, from the core datacenter to the network edge.

© 2024 Red Hat, Inc.