Search code examples
iframestripe-paymentsreact-stripe

In react-stripe-js can I change the appearance and width of the payment options?

Stripe image tabs on one row

I am using PaymentElement from @stripe/react-stripe-js, is it possible to make the payment options something like this?

Stripe image tabs on separate rows

Here, I edited the HTML directly, however, I don't think it's possible to do this programmatically, since the entire Stripe form is inside an iframe. Also, I found this link https://docs.stripe.com/elements/appearance-api for changing the style of the tabs, however, the width does not appear to be customizable

Solution

  • Thank you for the responses, I ended up using ExpressCheckoutElement from @stripe/react-stripe-js.