Theming and Appearance (iOS)

Lucra’s iOS SDK is designed to blend seamlessly into your existing app experience. It supports light/dark mode, semantic colors, component-level themes, and global override options.


Overview

Lucra theming gives you control over:

  • Primary and secondary brand colors

  • Surface/background colors

  • On-surface text/icon colors

  • Component-specific colors (e.g., Convert to Credit)

Lucra UI attempts to inherit system appearance first, then apply your overrides.


Global Theme Application

The LucraSDK supports theming, this is an optional value that you pass in during the initialization of the LucraClient.

let universalTheme = ClientTheme(universalTheme: .init(primary: "#F8730D",
                                                       secondary: "#16189B",
                                                       tertiary: "#FD00CD",
                                                       onPrimary: "#09090A",
                                                       onSecondary: "#FDFEFF",
                                                       onTertiary: "#FFFFFF"))

If you would like to supply a custom Font, register the Font in your application and pass that font name to the LucraSDK initializer.

Typography

Lucra uses iOS text styles (body, headline, caption, etc.) using the .lucraFont modifier.

The LucraSDK allows overriding of specific font types: [.largeTitle, .headline, .sectionHeader, .pageTitle] Register your custom Font by passing in the name of the font in ClientTheme's fontFamily.


  1. Begin with Lucra defaults

  2. Apply global brand colors

  3. Test across flows (Onboarding, Verify Identity, Add Funds, etc.)

  4. Style component-specific themes like C2C

  5. Validate accessibility & dynamic type


Next Steps

Proceed to:

Deeplinksarrow-up-right

Push Notifications

Push Notificationsarrow-up-right

Lucra Flows

Lucra Flowsarrow-up-right

Last updated