Skip to main content
This content is now archived and is no longer updated. Progress is not calculated. Pega Cloud instances are disabled, and badges are no longer awarded.

Defining a theme and a logo for a portal

Pega Community logo

Note: The following content, referenced from Pega Community, is included here to help you better achieve the module learning objectives.

Maintain a consistent visual identity by configuring the graphic design of your portal. By adjusting the logo and the color palette of the interface, you can tailor your application to the branding requirements of your business.

For example, you can select a default color theme for the elements of the user interface, such as buttons, links, and fonts.
  1. In the navigation pane of App Studio, click Settings Theme .

  2. In the Show on banner list, select the items that you want to display on the banner in your portal.

  3. Click Change logo, and then choose what kind of logo you want to use:

    Choices Actions
    Logo provided by Pega In the logo settings window, in the list of graphics, select a logo, and then click Submit.
    Custom logo
    1. In the logo settings window, click Upload logo, and then select your file.

      The supported file types are JPG, PNG, and GIF.

    2. Click Submit.

  4. In the Theme section, select the color theme that you want to use in the portal.

  5. Optional:

    To customize a theme, click the theme that you want to edit, and then make your changes:

    Choices Actions
    Change a color
    1. In the Colors section, click the color that you want to change.

    2. In the color palette window, choose the color that you want to assign to the component, and then click Save.

    Add a color
    1. In the Colors section, click Add theme color.

    2. In the Theme color field, enter the name of the component, and then click on the color assigned to the component by default.

    3. In the color palette window, choose the color that you want to assign to the component, and then click Save.

    Change a font In the Text section, define the typeface, weight, and size for the component that you want to change.
    Add a font
    1. In the Text section, click Add theme text.

    2. In the Text section, define the typeface, weight, and size for the component that you want to change.

  6. Optional:

    To reset all color and text options to their default values for the theme, click Reset to default.

  7. Click Save.

  • Styling controls at run time

    You can style many types of controls at run time in App Studio, rather than switching to Dev Studio and modifying the application skin. For example, for drop-down controls, you can specify text color, background fill and color, and border width and color. When you style controls directly in App Studio, you can save development time and reduce main


This Topic is available in the following Module:

We'd prefer it if you saw us at our best.

Pega Academy has detected you are using a browser which may prevent you from experiencing the site as intended. To improve your experience, please update your browser.

Close Deprecation Notice