Theming¶

Theming is managed through the AnsaTheme.

Colors¶

All colors are managed through BrandColors and BrandTextColors, for content and text, respectively.

let primaryBrandColor = Color(hex: "#BF2600")
let headerTextColor = Color(hex: "#36424E")
let bodyTextColor = Color(hex: "#6A747F")

AnsaTheme.set(
    brandColors: BrandColors(
        primary: primaryBrandColor,
        secondary: .blue
    ),
    textColors: BrandTextColors(
        primary: headerTextColor,
        secondary: bodyTextColor
    )
)

Fonts¶

Similarly, fonts are also managed through shared AnsaTheme.

 var fonts = AnsaFonts()
fonts.title.large = Font.custom("Lato-Black", size: 48)
fonts.title.smallSemiBold = Font.custom("Lato-Bold", size: 18)
fonts.footnote = Font.custom("Lato-Thin", size: 13)
fonts.body.medium = Font.custom("Lato-Regular", size: 16)
fonts.body.bold = Font.custom("Lato-Bold", size: 16)

// Font.regular(size: CGFloat), Font.medium(size: CGFloat), Font.semibold(size: CGFloat), Font.bold(size: CGFloat) are also available options.

AnsaTheme.set(
    fonts: fonts
)

Shapes¶

As you'd expect shapes are managed through BrandShapes, with the available customization lying in buttonCornerRadius.

AnsaTheme.set(
    shapes: BrandShapes(
        buttonCornerRadius: 4
    )
)