Shopify Glossary Terms

Checkout UI Extensions

Checkout UI Extensions are sandboxed React components that render within Shopify's checkout. They're the presentation layer of Checkout Extensibility - the way you add custom visual elements to the checkout flow on Shopify Plus.

Extensions render at defined target locations within checkout - before and after the contact information, shipping method, payment method, and order summary sections. You can also render extensions on the thank-you page and order status page.

They're sandboxed, which means they run in an isolated environment without access to the full DOM. This prevents scripts from breaking checkout but limits what you can do visually. Shopify provides a UI component library (Polaris for checkout) that ensures extensions match the checkout's look and feel.

Common extensions include custom form fields, upsell product cards, loyalty point displays, delivery date pickers, and gift message inputs. For the full picture, see our checkout customisation guide.


Think: the building blocks for a checkout that does more than just take payment.

A Shopify Plus Agency for Strategic Design & Advanced Engineering

Building something ambitious?

Chosen by Shopify Plus brands worldwide.

{"@context":"https://schema.org","@graph":[{"@type":"Article","headline":"Checkout UI Extensions","description":"Checkout UI Extensions are sandboxed React components for customising Shopify Plus checkout. Custom fields, upsells, and branding.","author":{"@type":"Organization","name":"Flux Agency","url":"https://flux.agency"},"publisher":{"@type":"Organization","name":"Flux Agency","url":"https://flux.agency","logo":{"@type":"ImageObject","url":"https://cdn.prod.website-files.com/69ac35019ce8f68774055c5e/69ad8912209a3b56e3865820_FLUXw.svg"}},"mainEntityOfPage":{"@type":"WebPage","@id":"https://flux.agency/glossary/checkout-ui-extensions"},"datePublished":"2026-03-26","dateModified":"2026-04-10"},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://flux.agency"},{"@type":"ListItem","position":2,"name":"Glossary","item":"https://flux.agency/glossary"},{"@type":"ListItem","position":3,"name":"Checkout UI Extensions","item":"https://flux.agency/glossary/checkout-ui-extensions"}]},{"@type":"FAQPage","mainEntity":[{"@type":"Question","name":"What are Checkout UI Extensions?","acceptedAnswer":{"@type":"Answer","text":"Checkout UI Extensions are sandboxed React components that render within Shopify's checkout at defined target locations. They are the visual layer of Checkout Extensibility - used for adding custom fields, upsell cards, loyalty displays, and other UI elements to the checkout flow on Shopify Plus."}},{"@type":"Question","name":"Are Checkout UI Extensions sandboxed?","acceptedAnswer":{"@type":"Answer","text":"Yes. Extensions run in an isolated environment without access to the full DOM or checkout page HTML. Shopify provides a UI component library (Polaris for checkout) to ensure extensions match the checkout styling. This prevents scripts from breaking checkout but limits visual customisation."}},{"@type":"Question","name":"What can you build with Checkout UI Extensions?","acceptedAnswer":{"@type":"Answer","text":"Common extensions include custom form fields (gift messages, delivery dates), upsell product cards, loyalty point displays, trust badges, delivery date pickers, and gift message inputs. Extensions render at defined target locations before and after contact info, shipping, payment, and order summary sections."}}]}]}