Skip to main content
Explore how PrimerCheckoutTheme tokens affect different parts of the iOS Checkout. Select a token to see which components it impacts, adjust values with sliders and color pickers, and copy the generated Swift code directly into your project.
This explorer showcases a subset of tokens from PrimerCheckoutTheme. For a complete reference, see the Theming page.

​
How to Use

  1. Token → Components mode: Click a token to see which parts of the checkout it affects (highlighted in green)
  2. Component → Tokens mode: Click a component to see which tokens control its appearance
  3. Adjust values: Use the sliders and color pickers to preview changes in real-time
  4. Copy generated code: The Swift code updates live — copy it directly into your project

​
Applying Tokens in Your Code

Once you’ve configured your theme, apply it when creating PrimerCheckout: 
let theme = PrimerCheckoutTheme(
  colors: ColorOverrides(
    primerColorBrand: Color(red: 0.49, green: 0.36, blue: 0.75)
  ),
  radius: RadiusOverrides(
    primerRadiusMedium: 12
  )
)

PrimerCheckout(
  clientToken: clientToken,
  primerTheme: theme
)