Saved Card Controls
A two column saved card explainer where a left list states what saving stores and what removal does beside a static account panel blueprint.
A two column saved card explainer where a left list states what saving stores and what removal does beside a static account panel blueprint.
Search blocks by description or jump to a page.
The source for every Ecommerce block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
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.
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
After
One strong use is the two saved card account panel. Other control explainers fit the same layout:
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.