Skip to main content

Controls and presentation

User interface elements

User interface elements, such as text inputs and layouts, present information and actionable items on the user interface. 

Pega Platform™ UI elements include basic controls that can be used out of the box, such as:

  • Autocomplete controls
  • Buttons
  • Charts
  • Check boxes
  • Drop-down lists
  • Links
  • Sliders
  • Rich-text editors
Different basic control options

UI elements can be reused and customized as needed by applying existing styling to enable developers to manage controls and styling separately. Out-of-the-box UI elements, such as a basic button, come with predefined formats. The predefined formats for a button include Standard, Simple, and Strong.

Style options for button controls

You can style all presentation elements of your interface, including typography, borders, backgrounds, layouts, and UI placement and alignment. Using a predefined format applies a combination of those styling options. For example, you can apply a format that styles buttons to have a black border, white background, black font color, centered text, and centered alignment on the interface. Applying the format applies all the styling defined for that format. Formats for specific control types are reused across the application.

Custom format for a button control

Styling for basic controls

Presentation and styling are defined for a specific control. Depending on the control type, you can style different aspects of the control. For example, unlike a text field, a link does not have a border, meaning you do not apply a border color to a link.

Some controls allow you to change the presentation of the label or caption. For example, you can add a button caption above a button or replace the button label with an icon, as shown in the following image.

styling a basic control

Establishing a consistent look for Button controls in your application saves development time, gives your application a more predictable user interface, and makes it easier for users to complete forms. Designate the format of the Button control to provide a visual cue to users about the button's relative importance. For example, for the Submit button on a form, set the Control format option to Strong as a cue to users that it is the primary action that they can take on the form.

In the following image, click the + icons to read more about some of the available basic controls.

If you are having problems with your training, please review the Pega Academy Support FAQs.

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 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