Custom Images for Payment Methods

[sallar]

Is your feature request related to a problem? Please describe. Currently, calling the presentPaymentSheet() returns a paymentOption object that has a label and image. These values are not configurable.

const { error, paymentOption } = await presentPaymentSheet()

Describe the solution you'd like I would love to show a different image for different payment options that looks like the rest of my designer system. For that purpose, I recommend adding a type and brand field to the paymentOption. For example when selecting a Visa card:

{
  "type: "card",
  "brand": "visa",
  "label" "**** 4242"
  "image": "...."
}

Describe alternatives you've considered I have considered implementing the entire card selection UI myself, but that's just too much work for all the different payment options.

Additional context

[sfriedman-stripe]

Hi @sallar! Just to clarify: Are you wanting to modify the payment method brand assets themselves? I'm not totally understanding based on your example image. Thanks!

[sallar]

Hey @sfriedman-stripe I want to display a different image in my UI for each of the payment methods. For example a nicer visa logo or Apple/Google pay logo that adapts nicely to dark mode.

[sfriedman-stripe]

Thanks @sallar! Is having images that play nicer with Dark Mode the real ask here, or do you envision more customization needs than that?

[sallar]

@sfriedman-stripe my immediate need is to implement this to look the same way the designer has envisioned but it would be still nice to have some extra info about the payment option.

But for the time being, is there anyway I can update these images?

[porter-stripe]

@sallar Thank you for the suggestion! We revisit our roadmap periodically and will keep this idea in mind.