Skip to main content


         This documentation site is for previous versions. Visit our new documentation site for current releases.      
 

Included styles

Updated on November 15, 2021
Applicable to Theme UI-Kit applications

Use the Included styles tab of the Skin form to select components to be supported in your application and to specify additional style sheets for the application.

Component CSS support

Select the check box next to a component that you want to support in your skin. When building an application, support only those components that you plan on using in the application. This will reduce the size of the static content (Cascading Style Sheet files) in your application and thus improve application loading time.

Any components that you exclude on this tab are not displayed on the Component styles tab.

For more information, see Excluding unused components from the CSS file.

Select the Include legacy CSS for applications built prior to Pega 7 check box to include support for legacy components and environments. Legacy support includes support old controls such as tabs or accordions. Do not select this check box when creating a new application.

Avoid adding custom style sheets to your skin. If you are currently using a custom style sheet:

  • For custom or non auto-generated controls, you can add these styles to the skin rule as custom styles.
  • To create additional styles for layouts and controls, such as grids, tabs, buttons, and links, you can create new style formats in the skin rule.

Adding a custom style sheet

If you choose to add a custom style sheet to the skin:

  1. Click Add style sheet and enter the file name.
  2. Click the Open icon to create a new file.
  3. Click Save and note the caution regarding maintainability.

The order in which you enter style sheets is significant; the bottom style sheet is applied last. Select the number beside the file name and drag and drop to re-order additional sheet sheets.

To delete a style sheet from a skin, select the style sheet that you want to delete and click the delete icon.

  • Skin form - Included Styles tab

    Use this tab to select which style sheets to add to the skin, and select the components to be supported in your application.

Have a question? Get answers now.

Visit the Support Center to ask questions, engage in discussions, share ideas, and help others.

Did you find this content helpful?

Want to help us improve this content?

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

Pega.com is not optimized for Internet Explorer. For the optimal experience, please use:

Close Deprecation Notice
Contact us