UIKit uses a default theme as part of out of the box design language.
UIKit uses the default theme as part of the design language.
The UIKit looks great without any customisations, though you can also edit the colors and fronts in the themes to suit your preferences all the same.
However, if you wish to customise the theme, you can declare changes to both colours and typography.
UIKit uses a small set of declared colours to simplify the design task for developers. These colours are automatically rendered at appropriate shades to communicate states and interaction to the users.
UIKit uses a small set of declared colours to simplify the design task for developers. These colours are automatically rendered at appropriate shades to communicate states and interaction to the users.
Customise colour themes by declaring a colour code to the specific colour key.
Customise colour theme by declare colour code to the specific colour key.
Color
Description
Default
Primary
Used for buttons and primary call to actions
#1054DE
Secondary
Used in secondary UI elements
#292B32
Alert
Used when informing users of errors or information that requires an attention.
#FA4D30
Highlight
Used for hyperlink text
#1054DE
Base
Text presented on light background
#292B32
Base Inverse
Text presented on dark background
#FFFFFF
Message Bubble
Background colour of message bubble sent by the user
#1054DE
Message Bubble Inverse
Background colour of message bubble sent to the user
#EBECEF
Color
Description
Default
Primary
Used for buttons and primary call to actions
#1054DE
Secondary
Used in secondary UI elements
#292B32
Alert
Used when informing users of errors or information that requires an attention.
#FA4D30
Highlight
Used for hyperlink text
#1054DE
Base
Text presented on light background
#292B32
Base Inverse
Text presented on dark background
#FFFFFF
Message Bubble
Background colour of message bubble sent by the user
#1054DE
Message Bubble Inverse
Background colour of message bubble sent to the user
#EBECEF