About CSS Profile Properties

What are CSS profile properties?

CSS profile properties are predefined style variables that control the look of specific UI elements in sites and portals, such as headings, input fields, typefaces, and more. Each property maps to a standard CSS property like color, font-size, or border-radius, and accepts values in standard CSS formats such as hex codes, pixel values, and rem units.

When you create a CSS profile, you define property-value pairs using the format property-name: value. These values are applied to the corresponding UI elements on any site or portal that uses the CSS profile.

How CSS profile properties are applied

CSS profile properties take effect when a CSS profile is selected in a site or portal object. The site or portal renders its UI elements using the values defined in the profile. If a property isn't included in the CSS profile, the corresponding UI element retains its standard Appian value.

This means you only need to define properties for UI elements you want to customize. You don't need to include every available property in your CSS profile.

Learn more about CSS profile properties

The following pages provide reference information, formatting guidance, and usage tips for CSS profile properties:

• CSS Profile Property Reference: Lists all available CSS profile properties in a searchable, filterable table. Includes starter templates you can copy into a new CSS profile.
• Supported Formatting and Values: Describes the validation logic, supported value formats, and format-specific considerations for CSS profile property values.
• Usage Considerations: Covers usage patterns and component-specific behaviors, including on-light and on-dark colors, base font size scaling, radio button and checkbox styling, and button configuration.

Feedback