In this article, we will get you familiar with the color options available for ShortPoint Design Elements and show you how to set them.
TABLE OF CONTENTS
- ShortPoint Color options
- Setting colors for Design Elements
ShortPoint Color options
You can set the brand, named and HEX colors for the ShortPoint Design Elements.
Brand colors represent your company theme colors, defined in the Theme Builder > Color Palette settings of the current Site Collection. You can easily distinguish these colors among others by their names: Primary, Secondary, Highlight, Alternate etc.
These colors will be synced with the ones set in Theme Builder and updated along with it.
These colors suggest other popular named colors, such as red, violet, orange etc.
It is also possible to set the colors using the HEX color code:
Note: HEX values always begin with # and specify values of red, blue, and green using hexadecimal numbers such as #1B9DD8.
To know more about adding the hex colors, check our How to Add Hex Color Code in Page Builder tutorial.
Setting colors for Design Elements
Depending on the Design Element you are using, it is possible to define the following color settings:
Theme color - main color that is used for defining the text and background colors of the Design Element, if not specified otherwise in Advanced or Items tabs.
By default, it is a primary color of your theme.
|Background color, including header, sub-header and specific items background|
|Text color, including title, subtitle, description, links and their states (hover, visited)|
Symbol, number, icon color
|Color overlay and Color transparency|
|Shadow color (available for the Text Design Element)|
|Dark theme (available for the Twitter and Yammer Design Elements)|
|Loading screen color (available for the PowerApps Design Element).|
Check our solution article on How to Change PowerApps Loading Icon and Colorto know more.
Where to define the colors
Depending on the Design Element you are using, it is possible to set the color options in:
- Settings tab;
- Advanced tab;
- Background tab.
For some Design Elements, that have several items (for example Tiles, File Lists, Toggles etc.), you can set different color options for the chosen item only by Enabling Custom Settings in the Items tab:
That's it! Happy colorizing.