About this block

Saved Card Controls pairs a plain explanation with the panel it describes. The left column answers three questions in short rows: what saving a card actually stores, a one way token plus the last four digits; what removal does, a one click delete with no confirmation gauntlet; and what the store never does, from charging a removed card to silently re-saving one. The right column is a static blueprint of the account panel, two saved cards each sitting beside its own remove button.

The rules and the cards are two small arrays, and the panel is built from the Badge and Button primitives so the remove control looks exactly as it renders in the live account. The closing line keeps the promise concrete: removal is immediate and permanent, and the next checkout simply asks for a card again.

When to use

Reach for this block on an account settings page under saved payment methods, or on the payment sections page reassuring a first time buyer about what saving a card commits them to. It reads best right where the remove button actually lives.

A natural flow around it on an Ecommerce Pro page:

Before

• Checkout flow

After

• Account settings
• Payment security explainer

What you can display

One strong use is the two saved card account panel. Other control explainers fit the same layout:

• Default card switch. The badge moving between cards with a line on what default actually changes.
• Expiry handling. A card past its date dropping off on its own rather than lingering.
• Wallet linking. A saved digital wallet beside the cards with the same remove control.

Tip: showing the remove button live in the blueprint, rather than describing it, is what turns the promise of easy removal into something the buyer can already see.