# Payment Element

Inserta métodos de pago directamente en tu aplicación.

Payment Element es un componente personalizable que [incorpora una lista de métodos de pago](https://docs.stripe.com/payments/mobile/accept-payment-embedded.md) en cualquier pantalla de tu app. Cuando un cliente selecciona un método de pago de la lista, una planilla a continuación recopila los detalles del pago. Puedes personalizarla para que coincida con la apariencia de tu aplicación. Payment Element en la aplicación está disponible en nuestros SDK para [iOS](https://github.com/stripe/stripe-ios), [Android](https://github.com/stripe/stripe-android) y [React Native](https://github.com/stripe/stripe-react-native). Para dar los primeros pasos, consulta nuestra guía [aceptar pagos en la aplicación](https://docs.stripe.com/payments/mobile/accept-payment-embedded.md).

> #### Aplicaciones EE. UU. que venden bienes digitales
> 
> Android apps in the US that sell digital goods can process payments in-app using the Payment Element. If you sell digital goods on iOS, see how to implement an app-to-web flow using Stripe Checkout in [Sell in-app digital goods and subscriptions](https://docs.stripe.com/mobile/digital-goods/checkout.md).
![Ejemplo de integración de Payment Element](https://b.stripecdn.com/docs-statics-srv/assets/mobile-payment-element.de700c536720f40087a00fde4b958b9a.png)

Ejemplo de integración de Payment Element

Con Payment Element, obtienes lo siguiente:

- [Acceso a más de 100 métodos de pago internacionales](https://docs.stripe.com/payments/payment-methods/overview.md): Apple Pay, Link y otros métodos de pago populares que se habilitan automáticamente.

- [Métodos de pago dinámicos](https://docs.stripe.com/payments/payment-methods/dynamic-payment-methods.md): pide y exhibe métodos de pago de forma dinámica e [inicia pruebas A/B](https://docs.stripe.com/payments/a-b-testing.md) para nuevos métodos de pago.

- [Personalizaciones de la interfaz de usuario (IU) para que coincidan con tu aplicación](https://docs.stripe.com/elements/appearance-api/mobile.md): haz coincidir la interfaz de usuario (IU) con el diseño de tu aplicación. El diseño se mantiene, pero puedes modificar los colores, las fuentes, etc.

- [Recopilación de direcciones](https://docs.stripe.com/payments/mobile/save-during-payment.md?platform=ios&mobile-ui=payment-element#collect-payment-details): recopila direcciones de facturación completas o parciales con cualquier método de pago.

- [Saved payment methods](https://docs.stripe.com/payments/mobile/accept-payment.md?platform=ios&type=payment#enable-saved-cards): Save, reuse, and manage cards and bank accounts. You can also [store a customer’s payment details without an initial payment](https://docs.stripe.com/payments/mobile/accept-payment.md?platform=ios&type=setup).

## Demostración de Elements en la aplicación de Stripe

Escanea este código QR o usa este [enlace](https://apps.apple.com/us/app/stripe-payments-showcase/id6450683352) para descargar una aplicación de demostración interactiva que demuestre los elementos dentro de la aplicación de Stripe. En la aplicación, puedes generar diferentes especificaciones de interfaz de usuario (IU) para ver cuál funciona mejor para tu caso de uso.
![Presentación de pagos dentro de la aplicación de Stripe con código QR de la tienda de aplicaciones](https://b.stripecdn.com/docs-statics-srv/assets/appstore_qr.ce33264690ffb3cebb2982458ccb496d.svg)

## Formato

Elija entre diseño de radio, diseño de marca de verificación o botones flotantes.
![Opciones de diseño de Payment Element](https://b.stripecdn.com/docs-statics-srv/assets/pe-layout.f6c429b6dfdf24d2fa144725d8435a22.png)

Payment Element admite lo siguiente: botones de opción, marcas de verificación y diseños de botones flotantes.

## Apariencia

Usa la API Appearance para personalizar la apariencia de Payment Element para que coincida con tu aplicación. Con la API Appearance, puedes modificar las fuentes, los colores, los bordes, las sombras, etc.
![Personalización de la apariencia de Payment Element](https://b.stripecdn.com/docs-statics-srv/assets/pe-appearance.0c2a1c5208103bcfb92b67b10dd9fb2f.png)

Ejemplos de cómo cambiar los diferentes estilos de Payment Element

## Métodos de pago

Payment Element proporciona acceso a más de 100 métodos de pago en todos los países en los que se admite Stripe. Puedes habilitar los métodos de pago desde tu Dashboard de Stripe Dashboard o desde [Métodos de pago personalizados](https://docs.stripe.com/payments/payment-methods/custom-payment-methods.md).

Los proveedores de métodos de pago a menudo cambian sus requisitos de cobro y visualización. Cuando usas Payment Element para mostrar métodos de pago, Stripe maneja todos las recopilaciones de detalles de pago en formularios prediseñados y localizados que mantenemos actualizados con cada proveedor de servicios de pago.
![Métodos de pago de Payment Element](https://b.stripecdn.com/docs-statics-srv/assets/pe-payment-methods.91cb1be9cb8ef55b873074dd6f3a7c12.png)

Ejemplos de débito P24 y SEPA en Payment Element

## Billeteras

Payment Element admite carteras populares, incluidas Apple Pay y Link, una cartera creada por Stripe. Payment Element muestra carteras en línea como opciones de método de pago.
![Carteras de Payment Element](https://b.stripecdn.com/docs-statics-srv/assets/pe-wallets.fed1c5ad5fbb89d74be25e02d291e25c.png)

Ejemplo de Link en Payment Element

## Métodos de pago guardados

Payment Element admite el almacenamiento, la visualización y la gestión de métodos de pago guardados. La recopilación del consentimiento se gestiona de manera automática, lo que garantiza el cumplimiento de la normativa global.

Los métodos de pago guardados admiten tarjetas, cuentas bancarias de EE. UU… y cuentas de débito SEPA.

La API CustomerSessions proporciona control adicional sobre lo siguiente:

- Cuándo mostrar u ocultar la casilla de consentimiento para guardar datos
- Cuándo mostrar u ocultar los métodos de pago guardados
- Permitir a los compradores eliminar los métodos de pago guardados
- Cómo evitar que los compradores eliminen el último método de pago guardado
![Métodos de pago guardados en Payment Element](https://b.stripecdn.com/docs-statics-srv/assets/pe-saved-payment-methods.6aef147c8b230f2cb50c115b2054f814.png)

Ejemplos de cómo los clientes pueden acceder a los métodos de pago guardados en Payment Element

## Recopilar detalles de dirección

Puedes configurar Payment Element para recopilar información de pago adicional, incluido el nombre, el correo electrónico, el número de teléfono y la dirección de facturación, independientemente del método de pago que el cliente utilice.
![Recopilación de direcciones de Payment Element](https://b.stripecdn.com/docs-statics-srv/assets/pe-collecting-address-details.f806ddc435848cdf38470fb4e5adb15b.png)

Ejemplo que muestra todos los detalles de facturación recopilados

## Funcionalidades adicionales

Payment Element también contiene las siguientes funcionalidades:

- Recopilación del CVC: configura si se requiere volver a recopilar el CVC cuando los usuarios pagan con un método de pago guardado.
- [Filtrado por marca de tarjetas](https://docs.stripe.com/payments/mobile/filter-card-brands.md): configura qué marcas de tarjetas aceptas.