Share

Action elements

Action elements are intended to perform operations within the application (e.g. confirmation of an action with a button, navigation through tabbed content, selection from the list of contents, enabling of functionalities, etc.)

The list of action elements includes the presentation of active and passive states. As a general rule, color accents are used to make action elements stand out from the rest of the content sets, but exceptions are also possible. The latter is necessary where the used color accents would be standing out excessively which would cause imbalance with other elements, hierarchy crumbling and lack of data transparency.

Warning: Action elements use colors defined with the selected color scheme.

Buttons

Full width button / Font size: 14px, Line height: 16px, Font weight: medium
Font size: 14px, Line height: 16px, Font weight: medium
Floating action button
Font size: 14px, Line height: 16px, Font weight: medium

Tabs

Interaction elements

Links

Buttons

Font size: 17px, Line height: 22px, Font weight: regular
Font size: 17px, Line height: 22px, Font weight: regular
Font size: 15px, Line height: 20px, Font weight: regular
Font size: 17px, Line height: 22px, Font weight: regular
Font size: 17px, Line height: 22px, Font weight: semibold

Tabs

Interaction elements

Links