Skins help you style the graphic elements of your interface, such as borders and backgrounds, separately from the content. This approach ensures greater consistency, promotes reuse, and provides you with tools to make quick changes to the graphic design of your application.

• Updating Theme Cosmos in your application

  Build your application by using the latest UI tools. By ensuring that the Theme Cosmos ruleset is up to date, you provide your application with a modern and responsive interface.

• Managing Cosmos UI settings in case designer

  Adjust the Cosmos-based user interface of your application to the needs of your organization. By changing Cosmos settings, you can control case-level fields and case behavior to make the interface cleaner or more informative, according to your preferences.

• CSS helper classes

  CSS helper classes are snippets of code that introduce minor formatting changes to your UI. If your application has many formats of the same type, and these formats vary only slightly, using CSS helper classes can save you development time by limiting the number of customized skin formats.

• Uploading custom font files

  Ensure that your user interface meets the branding requirements of your company by adding new fonts to Pega Platform. Your custom font files can comprise standard fonts or icon fonts, which you can then add to the default icon set for your application.

• Login screen customization

  You can customize the appearance of the login screen and other screens that unauthenticated users access, to maintain design consistency with your company's style guidelines.

• Best practices for styling your application

  Build a visually appealing and intuitive UI by ensuring that you have well-defined and comprehensive presentation settings in your application.

• Creating skins

  Build a vivid interface that matches the branding requirements of your business with less effort. By keeping all presentation settings in the skin, you can define a single source of styling information for your application, and ensure a consistent interface that is convenient to update and maintain.

• Specifying a skin for your application

  Define a unified look and feel for your application by linking a skin to an application. A skin ensures that all portals within an application derive UI settings from a single source, which helps you maintain a consistent interface that is easy to update.

• Component style formats

  Component style formats help you customize the appearance of your user interface by storing information about the appearance of specific UI elements, such as layouts, error messages, or buttons. You can assign style formats to layouts or controls, and when you update the style format, the appearance of the associated UI element changes automatically.

• Mixins

  Mixins are reusable style patterns that define the typography, border, and background styles of UI components in your application. By using mixins, you can ensure consistency across the user interface, maximize re-use, and minimize future development effort.

• Creating a custom style

  You can specify a custom style on the Advanced tab of the Properties panel. You must enter the custom style name.

• Attaching a CSS to the skin

  Add custom CSS settings to your skin to make it consistent with existing branding for your business. If you have a CSS sheet that you want to reuse, you can attach it to the skin of your application.

• Skin inheritance

  Skin inheritance helps you reuse design patterns between skins. By setting up inheritance relations between skins, you can adopt a tiered approach to styling that reduces development effort on similar applications.