Shape Tokens

Radius, border width, and size tokens for component shapes and dimensions

Primer Checkout Android SDK is currently in beta (v3.0.0-beta). The API is subject to change before the stable release.

RadiusTokens

data class RadiusTokens(
    val xsmall: Dp = 2.dp,
    val small: Dp = 4.dp,
    val medium: Dp = 8.dp,
    val large: Dp = 12.dp,
    val base: Dp = 4.dp,
)

Token	Preview	Default	Usage
xsmall		2.dp	Subtle rounding
small		4.dp	Chips, tags
medium		8.dp	Input fields, cards
large		12.dp	Bottom sheet corners
base		4.dp	Base unit

BorderWidthTokens

data class BorderWidthTokens(
    val thin: Dp = 1.dp,
    val medium: Dp = 2.dp,
    val thick: Dp = 3.dp,
)

Token	Preview	Default	Usage
thin		1.dp	Input borders, dividers
medium		2.dp	Focus rings, selected borders
thick		3.dp	Heavy emphasis borders

SizeTokens

data class SizeTokens(
    val small: Dp = 16.dp,
    val medium: Dp = 20.dp,
    val large: Dp = 24.dp,
    val xlarge: Dp = 32.dp,
    val xxlarge: Dp = 44.dp,
    val xxxlarge: Dp = 56.dp,
    val base: Dp = 4.dp,
)

Token	Preview	Default	Usage
small		16.dp	Small icons
medium		20.dp	Default icons
large		24.dp	Large icons
xlarge		32.dp	Payment method icons
xxlarge		44.dp	Touch targets
xxxlarge		56.dp	Large touch targets
base		4.dp	Base unit

Access all shape tokens via LocalPrimerTheme.current inside the checkout composable tree.