Using Themes

Using the default theme

AmityUIKit uses the default theme as part of the design language.

Theme customization

With no customization, UIKit already looks good. However, if you wish to customize the theme, you can declare changes to both colors and typography.

Colors

UIKit uses a small set of declared colors to simplify the design task for developers. These colors are automatically rendered at appropriate shades to communicate states and interactions to the users.

Color

Description

Default

Primary

Used for buttons and primary call to actions

#1054DE

Base

Primary font color for readability.

#000000

Base background

Light backdrop for posts or components.

#ebecef

BaseShade4

Soft background for feed; subtle for dividers.

#FFFFFF

Usage

To declare your own colors on iOS:

  1. Create an instance from the provided class AmityTheme

  2. Set the theme instance through AmityUIKitManager


    AppColors appColors = AppColors(
        primary: primary,
        base: base,
        baseBackground: baseBackground,
        baseShade4: baseShade4);
    AmitySLEUIKit().configAmityThemeColor(context, (config) {
      config.appColors = appColors;
    });

Last updated