If you’re using Stripe.js v2 to securely collect card information, you’ve needed to build and configure your own input fields, validation, and formatting when creating your payment form. With Stripe Elements, our prebuilt UI components, this is all handled by Stripe. Elements is fully customizable and seamlessly integrates into your checkout flow.
Using Elements, you can create UI components and insert them into your payment form. These components securely collect card information from your customers. When the payment form is submitted, the information is passed directly to Stripe. If you’re using the Charges API, a
Token is returned that is then used to make a charge request or save the payment details for later. If you’re using the Payment Intents API, you can directly call confirmCardPayment to complete the payment or use createPaymentMethod to retrieve a Payment Method that can be passed to your server.
Migrating to Elements requires the following steps:
- Initial setup of Elements
- Convert your existing payment form
- Securely collect card information
- Handle events and errors
- Customize style and formatting
Now you have all the information you need to migrate from Stripe.js v2 to Stripe Elements. To learn more, continue reading: