Payment Methods List

About this block

Payment Methods List shows saved cards as rows with the storage honesty up front, a token and the last four, the full number lives with the processor. The expiring card carries its warning in the emphasis weight, and the footer answers the deletion anxiety, removing a card never cancels a placed order.

Methods are one array, the default card rings heavier, the remove action stays quiet text.

When to use

Reach for this block as the payment tab of the account area. The expiry warning is the retention feature, a card that bounces a subscription renewal costs more than this whole page.

A natural flow around it on an Ecommerce Pro page:

Before

• Account overview whose payment tile flagged the expiry

After

• Checkout consuming the default

What you can display

One strong use is two cards with one expiring. Other lists:

• Bank methods. SEPA mandates with their reference numbers.
• Wallet rows. The wallets connected, with device names.
• Business card. The company card with who else on the account can use it.

Tip: render the expiry warning months ahead, the card that fails silently in a subscription charge is the most expensive UI omission in commerce.