tomh0027

[copper garden]

Hi 👋 what is your question about customizing the Payment Element? Is it something that you're having trouble accomplishing with the related Appearance API?
https://stripe.com/docs/elements/appearance-api?platform=web

[glossy vapor]

is it possible to customize to fit the design below?

[copper garden]

Possibly, but I'm not exactly certain offhand. The biggest thing I'm not sure is possible is that image background you're using, or allowing the Payment Element's backgrounds to be transparent.

All of the customizations that are available are available through the Appearance API that I linked to, so I would recommend playing around with the settings that makes available to you to see how close you can get to what you're after.

[glossy vapor]

the default background color was white, and I even failed to change it to other color not transparent though

[amber sierra]

Hi, stepping in.

[glossy vapor]

this is options I passed in to elements component
appearance: {
theme: "stripe",
},
variables: {
colorBackground: "red",
},

[amber sierra]

There are some flexibility in styling the Payment Element. For instance, you can customize the individual compenets like this, https://stripe.com/docs/elements/appearance-api?platform=web#rules

[glossy vapor]

I tried hex color, #ff0000, it didn't work either