Skip to content
Create account
or
Sign in
The Stripe Docs logo
/
Ask AI
Create account
Sign in
Get started
Payments
Revenue
Platforms and marketplaces
Money management
Developer resources
Overview
About Stripe payments
Upgrade your integration
Payments analytics
Online payments
OverviewFind your use caseManaged Payments
Use Payment Links
Build a checkout page
Build an advanced integration
Build an in-app integration
Payment methods
Add payment methods
Manage payment methods
Faster checkout with Link
Payment interfaces
Payment Links
Checkout
Web Elements
In-app Elements
    Overview
    Payment Sheet
    Payment Element
    Address Element
Payment scenarios
Handle multiple currencies
Custom payment flows
Flexible acquiring
Orchestration
In-person payments
Terminal
Beyond payments
Incorporate your company
Crypto
Financial Connections
Climate
Understand fraud
Radar fraud protection
Manage disputes
Verify identities
HomePaymentsIn-app Elements

Payment Element

Embed payment methods directly in your app.

The Payment Element is a customizable drop-in component that embeds a list of payment methods on any screen in your app. When a customer selects a payment method from the list, a sheet below it collects payment details. You can customize it to match the look and feel of your app. The In-app Payment Element is available in our iOS, Android, and React Native SDKs. See our accept in-app payments guide to get started.

Payment Element integration example

Payment Element integration example

With the Payment Element, you get:

  • Access to over 100 global payment methods This includes Apple Pay, Link, and other popular payment methods that are automatically enabled.
  • Dynamic payment methods Dynamically order and display payment methods and launch A/B tests for new payment methods.
  • UI customizations to match your app Match the UI to the design of your app. The layout stays consistent, but you can modify colors, fonts, and more.
  • Address collection Collect full or partial billing addresses with any payment method.
  • Saved payment methods Save, reuse, and manage cards and bank accounts. You can also store a customer’s payment details without an initial payment.

Layout

Choose between radio layout, check mark layout, or floating buttons.

Payment Element layout options

Payment Element supports: radio buttons, checkmarks, and floating button layouts.

Appearance

Use the Appearance API to customize the look and feel of the Payment Element to match your app. With the Appearance API, you can control fonts, colors, borders, shadows, and so on.

Payment Element appearance customization

Examples of different ways to style Payment Element

Payment methods

The Payment Element provides access to over 100 payment methods across all Stripe-supported countries. You can enable payment methods from your Stripe Dashboard or by using Custom Payment Methods.

Payment method providers often change their collection and display requirements. When you use Payment Element to display payment methods, Stripe handles all payment detail collection in prebuilt, localized forms that we keep up-to-date with each payment provider.

Payment Element payment methods

Examples of P24 and SEPA debit in the Payment Element

Wallets

Payment Element supports popular wallets, including Apple Pay and Link, a wallet built by Stripe. Payment Element shows wallets in-line as payment method options.

Payment Element wallets

Example of Link in Payment Element

Saved payment methods

The Payment Element supports saving, displaying, and managing saved payment methods. Consent collection is handled automatically, ensuring global compliance.

Saved payment methods supports cards, US bank accounts, and SEPA debit accounts.

The CustomerSessions API provides additional control over:

  • When to show or hide the save consent box
  • When to show or hide the saved payment methods
  • Allowing buyers to remove saved payment methods
  • Preventing buyers from removing the last saved payment method
Payment Element saved payment methods

Examples of how customers can access saved payment methods in Payment Element

Collect address details

You can configure the Payment Element to collect additional payment information, including name, email, phone number, and billing address, regardless of which payment method a customer uses.

Payment Element address collection

Example showing full billing details collected

Additional features

The Payment Element also contains the following features:

  • CVC recollection: Configure whether CVC re-collection is required when users pay with a saved payment method.
  • Card brand filtering: Configure which card brands you accept.

Get started

Learn how to integrate the Payment Element.

Was this page helpful?
YesNo
  • Need help? Contact Support.
  • Join our early access program.
  • Check out our changelog.
  • Questions? Contact Sales.
  • LLM? Read llms.txt.
  • Powered by Markdoc