Customize Split Card Elements
Customise each individual card field's appearance using theme presets, CSS variables, and element-specific options.
cardNumber Options
| Option | Type | Description |
|---|---|---|
showIcon | boolean | Show the card brand icon (default: false) |
disabled | boolean | Disable user input |
cardExpiry / cardCvc Options
| Option | Type | Description |
|---|---|---|
disabled | boolean | Disable user input |
Theme Presets & Variables
Split card elements use the same theme presets and CSS variables as all other elements. See Embedded Checkout Customize for the full reference on themes, variables, custom CSS rules, fonts, and locales.
Callbacks
| Callback | Available on | Description |
|---|---|---|
onReady | All fields | Fired when the field is ready |
onChange | All fields | Fired when field state changes (cardNumber includes brand) |
onFocus | All fields | Fired when the field gains focus |
onBlur | All fields | Fired when the field loses focus |
Payment submission
Split card fields do not have `submitPayment()`. Use `teya.elements.submitPayment()` to submit payments with split card elements.