The Stripe Elements Appearance API is a powerful tool designed to help developers customize the look and feel of Stripe’s payment elements. This API allows you to match the design of your payment forms with your brand’s aesthetic, ensuring a seamless user experience.

However…

It’s also pretty difficult to use, involving a lot of back and forth to get the design exactly right, so often developers don’t even bother.

The result is a checkout form that doesn’t match the rest of the site. How many times have you seen something like this?

This visual editor let’s you customize your Stripe Elements exactly as you want them.

The steps are easy:

• Open the Visual Editor.
• Select the element you want to customized from the dropdown.
• Style everything using the controls on the right-hand side.
• When your done, click the ‘Share’ button to copy the resulting JSON.
• Use the resulting JSON as the appearance for your Stripe Web Elements.

Happy coding!