Forms

CreditCardBrandMark

The card network logo/wordmark rendered on `CreditCard`, used internally.

html
<UiCreditCardBrandMark :brand="..." />

Brand

required

brand picks which card network's mark to draw. CreditCard detects it from the number as you type and passes it down — you'd only set it by hand to render a mark on its own, in a saved-cards list or a checkout's accepted-payments row. 'unknown' renders nothing at all, which is what an empty or unrecognised number resolves to.

visa
mastercard
amex
discover
Diners Club
dinersclub
JCB
jcb
UnionPay
unionpay
unknown

Rendered for you by CreditCard

This is the mark CreditCard prints in its corner, split out so the same artwork can be reused elsewhere. You never pass it to CreditCard — that component detects the network from the number itself.


API Reference

Generated from the component's source — props, slots and emits as the component actually declares them.

Props

Prop
Type
Default
Description
brandrequired
CardBrand
The card network to render a mark for. Renders nothing for `'unknown'`.

Types

ts
type CardBrand = "visa" | "mastercard" | "amex" | "discover" | "dinersclub" | "jcb" | "unionpay" | "unknown";