Checkout extension app customize color

Shopify Partner
3 0 1



I'm trying to build just simple app to display a message in checkout page using checkout UI extension and I notice that if I want to change the color of this block, It just very simple with checkout.liquid before.

But for now, we only need to stick with the components here

Is there anyway I can custom like using background-color: pink or something like that?


Thank you and I'm very appreciated for your time with this question.

Reply 1 (1)

Shopify Partner
1 0 0

The Branding API has an option to add colors or you can add colors with limitations using this Prop,
Status: 'info' | 'success' | 'warning' | 'critical'

Here is an example: 

 <Banner title="checkout-ui" status='info'>
      {translate('welcome', {target:})}