# Personaliza el aspecto Personaliza los colores, las fuentes, las formas y mucho más de tu página de confirmación de compra. # Página alojada > This is a Página alojada for when payment-ui is stripe-hosted. View the full page at https://docs.stripe.com/payments/checkout/customization/appearance?payment-ui=stripe-hosted. ## Aplicar la imagen de marca #### Dashboard Puedes personalizar tu imagen de marca con Checkout. Va a [Configuración de imagen de marca](https://dashboard.stripe.com/settings/branding/checkout) para: - Cargar un logotipo o ícono - Personaliza el color de fondo, el color de los botones, la fuente y las formas de la página de Checkout ### Imagen de marca con Connect Proceso de compra utiliza la configuración de marca de los cargos a cuentas conectadas con `on_behalf_of` y para las plataformas que realizan cargos Direct. Para las cuentas conectadas sin acceso al Dashboard completo de Stripe (incluidas las cuentas Express y Custom), las plataformas pueden configurar la configuración de marca con la API [Accounts](https://docs.stripe.com/api/accounts/object.md#account_object-settings-branding). #### API Puedes aplicar imagen de marca a una sesión de proceso de compra usando el parámetro [branding_settings](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings) como: - Establecer un logotipo o ícono - Personaliza el color de fondo, el color de los botones, la fuente y las formas de la página de Checkout - Cambia el nombre de tu marca Por defecto, aplicamos la imagen de marca establecida en el Dashboard a tus sesiones de proceso de compra. Si omites un campo en `branding_settings`, el proceso de compra aplica el valor predeterminado desde el Dashboard. Si especificas tanto el [logotipo](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings-logo) como el [ícono](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings-icon), la página de proceso de compra mostrará el logotipo y usará el ícono como icono. Si solo especificas el `logo`, la página de proceso de compra mostrará el logotipo y el proceso de compra usará el ícono de [Configuración de la marca](https://dashboard.stripe.com/settings/branding/checkout) como ícono favorito. Si solo especificas el `icon`, la página de proceso de compra mostrará el ícono y también lo usará como ícono favorito. > Las facturas por [suscripciones](https://docs.stripe.com/receipts.md#invoice-and-subscription-payment-receipts) y las facturas por [pagos únicos](https://docs.stripe.com/payments/checkout/receipts.md?payment-ui=stripe-hosted#paid-invoices-hosted) de una sesión de Checkout siguen utilizando la configuración de imagen de marca establecida en el Dashboard. Asegúrate de usar una imagen de marca coherente y reconocible para tus clientes a fin de reducir la confusión y el riesgo de contracargos. ```curl curl https://api.stripe.com/v1/checkout/sessions \ -u "<>:" \ -d "line_items[0][price]={{PRICE_ID}}" \ -d "line_items[0][quantity]=1" \ -d mode=payment \ -d "branding_settings[icon][type]=file" \ -d "branding_settings[icon][file]={{FILE_ID}}" \ -d "branding_settings[logo][type]=file" \ -d "branding_settings[logo][file]={{FILE_ID}}" \ -d "branding_settings[display_name]=Powdur" \ -d "branding_settings[font_family]=roboto" \ -d "branding_settings[border_style]=rectangular" \ --data-urlencode "branding_settings[background_color]=#7D8CC4" \ --data-urlencode "branding_settings[button_color]=#A0D2DB" \ --data-urlencode "success_url=https://example.com/success" ``` ### Imagen de marca con Connect Proceso de compra utiliza la configuración de marca de la cuenta conectada para cargos a un destino con `on_behalf_of` y para plataformas que realizan cargos Direct. Para cuentas conectadas sin acceso al Dashboard completo de Stripe (incluidas cuentas Express y Custom), las plataformas pueden configurar la configuración de marca con la API [Accounts](https://docs.stripe.com/api/accounts/object.md#account_object-settings-branding). Para anular la configuración de marca de la cuenta conectada, establece [branding_settings](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings) al crear la sesión del proceso de compra. ## Cambia el nombre de tu marca Puedes cambiar el nombre de una página de confirmación de proceso de compra modificando el campo **Nombre de la empresa** en la [configuración de datos](https://dashboard.stripe.com/settings/business-details) o estableciendo el [nombre de visualización de configuración de la imagen de marca](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings-display_name) (branding_settings.display_name). También [puedes personalizar el nombre del dominio](https://docs.stripe.com/payments/checkout/custom-domains.md) de una página de Checkout alojada en Stripe. > Asegúrate de usar un nombre de la empresa que sea coherente y reconocible por tus clientes para reducir la confusión y el riesgo de contracargos. Por lo general, las reglas de la red también requieren que uses el nombre de la empresa y el logotipo precisos y coherentes. ## Compatibilidad de fuentes Cada fuente personalizada es compatible con un [subconjunto de configuraciones regionales](https://docs.stripe.com/js/appendix/supported_locales). Puedes establecer de manera explícita la configuración regional de una Checkout Session especificando el campo de configuración regional al crear la Session, o usar la configuración predeterminada `auto` en la que Checkout elige una configuración regional según la configuración del navegador del cliente. En la tabla siguiente se indican las configuraciones regionales no admitidas para cada fuente. Es posible que los idiomas de estas configuraciones regionales estén fuera del intervalo de caracteres admitido para una fuente determinada. En esos casos, Stripe renderiza la página de Checkout con una fuente alternativa adecuada del sistema. Si eliges una fuente serif, pero no se admite en una configuración regional, Stripe recurrirá a una fuente basada en serif. | Familia tipográfica | Configuraciones regionales no admitidas | | ------------------- | ---------------------------------------------------------------------------------------------------------- | | Be Vietnam Pro | `bg`, `el`, `ja`, `ko`, `ru`, `th`, `zh`, `zh-HK`, `zh-TW` | | Bitter | `el`, `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | Chakra Petch | `bg`, `el`, `ja`, `ko`, `ru`, `zh`, `zh-HK`, `zh-TW` | | Hahmlet | `bg`, `el`, `ja`, `ko`, `ru`, `th`, `zh`, `zh-HK`, `zh-TW` | | Inconsolata | `bg`, `el`, `ja`, `ko`, `ru`, `th`, `zh`, `zh-HK`, `zh-TW` | | Inter | `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | Lato | `bg`, `cs`, `el`, `hr`, `ja`, `ko`, `lt`, `lv`, `mt`, `ro`, `ru`, `sl`, `th`, `vi`, `zh`, `zh-HK`, `zh-TW` | | Lora | `el`, `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | M PLUS 1 Code | `bg`, `el`, `ko`, `lt`, `lv`, `ru`, `sk`, `sl`, `th`, `tr` | | Montserrat | `el`, `hr`, `ja`, `ko`, `ru`, `th`, `zh`, `zh-HK`, `zh-TW` | | Nunito | `el`, `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | Noto Sans | `ja`, `ko`, `th` | | Noto Serif | `th` | | Open Sans | `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | PT Sans | `el`, `ja`, `ko`, `th`, `vi`, `zh`, `zh-HK`, `zh-TW` | | PT Serif | `el`, `ja`, `ko`, `th`, `vi`, `zh`, `zh-HK`, `zh-TW` | | Pridi | `bg`, `el`, `ja`, `ko`, `ru`, `zh`, `zh-HK`, `zh-TW` | | Raleway | `el`, `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | Roboto | `ja`, `ko`, `zh`, `zh-HK`, `zh-TW` | | Roboto Slab | `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | Source Sans Pro | `bg`, `el`, `ja`, `ko`, `ru`, `th`, `zh`, `zh-HK`, `zh-TW` | | Titillium Web | `bg`, `el`, `ja`, `ko`, `th`, `vi`, `zh`, `zh-HK`, `zh-TW` | | Ubuntu Mono | `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | Zen Maru Gothic | `bg`, `cs`, `el`, `hr`, `ko`, `lt`, `lv`, `pl`, `ro`, `ru`, `sk`, `th`, `vi` | # Página integrada > This is a Página integrada for when payment-ui is embedded-form. View the full page at https://docs.stripe.com/payments/checkout/customization/appearance?payment-ui=embedded-form. ## Aplicar la imagen de marca #### Dashboard Puedes personalizar tu imagen de marca a Checkout. Ve a [Configuración de imagen de marca](https://dashboard.stripe.com/settings/branding/checkout) para personalizar el color de fondo, el color de los botones, la fuente y las formas del formulario integrado. ### Imagen de marca con Connect Proceso de compra utiliza la configuración de marca de los cargos a cuentas conectadas con `on_behalf_of` y para las plataformas que realizan cargos Direct. Para las cuentas conectadas sin acceso al Dashboard completo de Stripe (incluidas las cuentas Express y Custom), las plataformas pueden configurar la configuración de marca con la API [Accounts](https://docs.stripe.com/api/accounts/object.md#account_object-settings-branding). #### API Puedes aplicar imagen de marca a una sesión de proceso de compra usando el parámetro [branding_settings](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings) como: - Personaliza el color de fondo, el color de los botones, la fuente y las formas de la página de Checkout - Cambia el nombre de tu marca Por defecto, aplicamos la imagen de marca establecida en el Dashboard a tus sesiones de proceso de compra. Si omites un campo en `branding_settings`, el proceso de compra aplica el valor predeterminado desde el Dashboard. > Las facturas por [suscripciones](https://docs.stripe.com/receipts.md#invoice-and-subscription-payment-receipts) y las facturas por [pagos únicos](https://docs.stripe.com/payments/checkout/receipts.md?payment-ui=stripe-hosted#paid-invoices-hosted) de una sesión de Checkout siguen utilizando la configuración de imagen de marca establecida en el Dashboard. Asegúrate de usar una imagen de marca coherente y reconocible para tus clientes a fin de reducir la confusión y el riesgo de contracargos. ```curl curl https://api.stripe.com/v1/checkout/sessions \ -u "<>:" \ -d "line_items[0][price]={{PRICE_ID}}" \ -d "line_items[0][quantity]=1" \ -d mode=payment \ -d "branding_settings[display_name]=Powdur" \ -d "branding_settings[font_family]=roboto" \ -d "branding_settings[border_style]=rectangular" \ --data-urlencode "branding_settings[background_color]=#7D8CC4" \ --data-urlencode "branding_settings[button_color]=#A0D2DB" \ -d ui_mode=embedded_page \ --data-urlencode "return_url=https://example.com/return" ``` ### Imagen de marca con Connect Proceso de compra utiliza la configuración de marca de los cargos de destino de la cuenta conectada con `on_behalf_of` y para las plataformas que realizan cargos directos. Para las cuentas conectadas sin acceso al Dashboard completo de Stripe (incluidas las cuentas Express y Custom), las plataformas pueden configurar los ajustes de marca con la API [Accounts](https://docs.stripe.com/api/accounts/object.md#account_object-settings-branding). Para anulación de la configuración de marca de la cuenta conectada, establece [branding_settings](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings) al crear la sesión del proceso de compra. ## Cambia el nombre de tu marca Puedes cambiar el nombre en el formulario integrado modificando el campo **Nombre de la empresa** en la [configuración de datos](https://dashboard.stripe.com/settings/business-details) o estableciendo el [nombre de visualización de configuración de la imagen de marca](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings-display_name) (branding_settings.display_name). > Asegúrate de usar un nombre de la empresa que sea coherente y reconocible por tus clientes para reducir la confusión y el riesgo de contracargos. Por lo general, las reglas de la red también requieren que uses el nombre de la empresa y el logotipo precisos y coherentes. ## Compatibilidad de fuentes Cada fuente personalizada es compatible con un [subconjunto de configuraciones regionales](https://docs.stripe.com/js/appendix/supported_locales). Puedes establecer de manera explícita la configuración regional de una Checkout Session especificando el campo de configuración regional al crear la Session, o usar la configuración predeterminada `auto` en la que Checkout elige una configuración regional según la configuración del navegador del cliente. En la tabla siguiente se indican las configuraciones regionales no admitidas para cada fuente. Es posible que los idiomas de estas configuraciones regionales estén fuera del intervalo de caracteres admitido para una fuente determinada. En esos casos, Stripe renderiza la página de Checkout con una fuente alternativa adecuada del sistema. Si eliges una fuente serif, pero no se admite en una configuración regional, Stripe recurrirá a una fuente basada en serif. | Familia tipográfica | Configuraciones regionales no admitidas | | ------------------- | ---------------------------------------------------------------------------------------------------------- | | Be Vietnam Pro | `bg`, `el`, `ja`, `ko`, `ru`, `th`, `zh`, `zh-HK`, `zh-TW` | | Bitter | `el`, `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | Chakra Petch | `bg`, `el`, `ja`, `ko`, `ru`, `zh`, `zh-HK`, `zh-TW` | | Hahmlet | `bg`, `el`, `ja`, `ko`, `ru`, `th`, `zh`, `zh-HK`, `zh-TW` | | Inconsolata | `bg`, `el`, `ja`, `ko`, `ru`, `th`, `zh`, `zh-HK`, `zh-TW` | | Inter | `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | Lato | `bg`, `cs`, `el`, `hr`, `ja`, `ko`, `lt`, `lv`, `mt`, `ro`, `ru`, `sl`, `th`, `vi`, `zh`, `zh-HK`, `zh-TW` | | Lora | `el`, `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | M PLUS 1 Code | `bg`, `el`, `ko`, `lt`, `lv`, `ru`, `sk`, `sl`, `th`, `tr` | | Montserrat | `el`, `hr`, `ja`, `ko`, `ru`, `th`, `zh`, `zh-HK`, `zh-TW` | | Nunito | `el`, `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | Noto Sans | `ja`, `ko`, `th` | | Noto Serif | `th` | | Open Sans | `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | PT Sans | `el`, `ja`, `ko`, `th`, `vi`, `zh`, `zh-HK`, `zh-TW` | | PT Serif | `el`, `ja`, `ko`, `th`, `vi`, `zh`, `zh-HK`, `zh-TW` | | Pridi | `bg`, `el`, `ja`, `ko`, `ru`, `zh`, `zh-HK`, `zh-TW` | | Raleway | `el`, `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | Roboto | `ja`, `ko`, `zh`, `zh-HK`, `zh-TW` | | Roboto Slab | `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | Source Sans Pro | `bg`, `el`, `ja`, `ko`, `ru`, `th`, `zh`, `zh-HK`, `zh-TW` | | Titillium Web | `bg`, `el`, `ja`, `ko`, `th`, `vi`, `zh`, `zh-HK`, `zh-TW` | | Ubuntu Mono | `ja`, `ko`, `th`, `zh`, `zh-HK`, `zh-TW` | | Zen Maru Gothic | `bg`, `cs`, `el`, `hr`, `ko`, `lt`, `lv`, `pl`, `ro`, `ru`, `sk`, `th`, `vi` |