# Personalizar a aparência Personalize as cores, fontes, formas e muito mais da página de checkout. # Página hospedada > This is a Página hospedada for when payment-ui is stripe-hosted. View the full page at https://docs.stripe.com/payments/checkout/customization/appearance?payment-ui=stripe-hosted. ## Aplique sua marca #### Dashboard Você pode aplicar uma marca personalizada ao Checkout. Vá para [Configurações de marca](https://dashboard.stripe.com/settings/branding/checkout) para: - Carregue um logotipo ou ícone - Personalize a cor de fundo, a cor do botão, a fonte e as formas da página de Checkout ### Uso de marca com o Connect O Checkout usa as configurações de marca das cobranças de destino da conta conectada com `on_behalf_of` e para plataformas que realizam Direct Charges. Para contas conectadas sem acesso completo ao Stripe Dashboard (inclui contas Express e Custom), as plataformas podem definir as configurações de marca com a API [Accounts](https://docs.stripe.com/api/accounts/object.md#account_object-settings-branding). #### API Você pode aplicar o branding personalizado a uma sessão de checkout usando o parâmetro [branding_settings](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings) para: - Definir um logotipo ou ícone - Personalize a cor de fundo, a cor do botão, a fonte e as formas da página de Checkout - Altere o nome da sua marca Por padrão, aplicamos o branding personalizado definido no Dashboard às suas sessões de checkout. Se você omitir um campo em `branding_settings`, o Checkout aplicará o valor padrão do Dashboard. Se você passar em [logo](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings-logo) e [icon](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings-icon), a página de checkout exibirá o logotipo e o usará como favicon. Se você informar apenas `logo`, a página de checkout exibirá o logotipo e o Checkout usará o ícone das [Configurações de branding](https://dashboard.stripe.com/settings/branding/checkout) como favicon. Se você passar apenas em `icon`, a página de checkout exibirá o ícone e o usará como favicon. > As faturas de [assinaturas](https://docs.stripe.com/receipts.md#invoice-and-subscription-payment-receipts) e as faturas de [pagamentos únicos](https://docs.stripe.com/payments/checkout/receipts.md?payment-ui=stripe-hosted#paid-invoices-hosted) de uma sessão de checkout ainda usam as configurações de marca definidas no Dashboard. Certifique-se de usar configurações de marca que sejam consistentes e reconhecíveis por seus clientes para reduzir a confusão e o risco de estornos. ```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" ``` ### Uso de marca com o Connect O Checkout usa as configurações de marca da conta conectada para Destination Charges com `on_behalf_of` e para plataformas que realizam Direct Charges. Para contas conectadas sem acesso completo ao Stripe Dashboard (inclui contas Express e Custom), as plataformas podem definir as configurações de marca com a API [Accounts](https://docs.stripe.com/api/accounts/object.md#account_object-settings-branding). Para sobrepor as configurações de marca da conta conectada, defina [branding_settings](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings) quando você criar a sessão de Checkout. ## Altere o nome da sua marca Você pode alterar o nome da página de Checkout modificando o campo **Nome da empresa** em [Configurações de detalhes da empresa](https://dashboard.stripe.com/settings/business-details) ou configurando [branding_settings.display_name](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings-display_name). Você também [pode personalizar o nome de domínio](https://docs.stripe.com/payments/checkout/custom-domains.md) de uma página de Checkout hospedada pela Stripe. > Certifique-se de usar um nome de empresa consistente e reconhecível pelos seus clientes para reduzir a confusão e o risco de estornos. As regras da rede também geralmente exigem que você use um nome de empresa e um logotipo precisos e consistentes. ## Compatibilidade de fontes Cada fonte personalizada é compatível com um [subconjunto de localidades](https://docs.stripe.com/js/appendix/supported_locales). Você pode definir explicitamente a localidade de uma sessão do Checkout ao passar o campo de localidade ao criar a sessão, ou usar a configuração `auto` padrão, em que o Checkout escolhe uma localidade com base nas configurações do navegador do cliente. A tabela a seguir lista localidades sem suporte para cada fonte. Os idiomas dessas localidades podem ficar fora do intervalo de caracteres que funcionam para uma determinada fonte. Nesses casos, a Stripe renderiza a página do Checkout com uma fonte alternativa adequada do sistema. Se você escolher uma fonte serifada, mas ela não funcionar em certa localidade, a Stripe adota outra fonte serifada. | Família de fontes | Localidades não aceitas | | ----------------- | ---------------------------------------------------------------------------------------------------------- | | 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. ## Aplique sua marca #### Dashboard Você pode aplicar uma marca personalizada ao Checkout. Vá para [Configurações de Marca](https://dashboard.stripe.com/settings/branding/checkout) para personalizar a cor de fundo, a cor do botão, a fonte e as formas do formulário incorporado. ### Uso de marca com o Connect O Checkout usa as configurações de marca das cobranças de destino da conta conectada com `on_behalf_of` e para plataformas que realizam Direct Charges. Para contas conectadas sem acesso completo ao Stripe Dashboard (inclui contas Express e Custom), as plataformas podem definir as configurações de marca com a API [Accounts](https://docs.stripe.com/api/accounts/object.md#account_object-settings-branding). #### API Você pode aplicar o branding personalizado a uma sessão de checkout usando o parâmetro [branding_settings](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings) para: - Personalize a cor de fundo, a cor do botão, a fonte e as formas da página de Checkout - Altere o nome da sua marca Por padrão, aplicamos o branding personalizado definido no Dashboard às suas sessões de checkout. Se você omitir um campo em `branding_settings`, o Checkout aplicará o valor padrão do Dashboard. > As faturas de [assinaturas](https://docs.stripe.com/receipts.md#invoice-and-subscription-payment-receipts) e as faturas de [pagamentos únicos](https://docs.stripe.com/payments/checkout/receipts.md?payment-ui=stripe-hosted#paid-invoices-hosted) de uma sessão de checkout ainda usam as configurações de marca definidas no Dashboard. Certifique-se de usar configurações de marca que sejam consistentes e reconhecíveis por seus clientes para reduzir a confusão e o risco de estornos. ```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" ``` ### Uso de marca com o Connect O Checkout usa as configurações de marca das cobranças de destino da conta conectada com `on_behalf_of` e para plataformas que realizam Direct Charges. Para contas conectadas sem acesso completo ao Stripe Dashboard (inclui contas Express e Custom), as plataformas podem definir as configurações de marca com a API [Accounts](https://docs.stripe.com/api/accounts/object.md#account_object-settings-branding). Para sobrepor as configurações de marca da conta conectada, defina [branding_settings](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings) quando você criar a sessão de Checkout. ## Altere o nome da sua marca O senhor pode alterar o nome no formulário constituído modificando o campo **Business name** em [Business details settings](https://dashboard.stripe.com/settings/business-details) ou configurando [branding_settings.display_name](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-branding_settings-display_name). > Certifique-se de usar um nome de empresa consistente e reconhecível pelos seus clientes para reduzir a confusão e o risco de estornos. As regras da rede também geralmente exigem que você use um nome de empresa e um logotipo precisos e consistentes. ## Compatibilidade de fontes Cada fonte personalizada é compatível com um [subconjunto de localidades](https://docs.stripe.com/js/appendix/supported_locales). Você pode definir explicitamente a localidade de uma sessão do Checkout ao passar o campo de localidade ao criar a sessão, ou usar a configuração `auto` padrão, em que o Checkout escolhe uma localidade com base nas configurações do navegador do cliente. A tabela a seguir lista localidades sem suporte para cada fonte. Os idiomas dessas localidades podem ficar fora do intervalo de caracteres que funcionam para uma determinada fonte. Nesses casos, a Stripe renderiza a página do Checkout com uma fonte alternativa adequada do sistema. Se você escolher uma fonte serifada, mas ela não funcionar em certa localidade, a Stripe adota outra fonte serifada. | Família de fontes | Localidades não aceitas | | ----------------- | ---------------------------------------------------------------------------------------------------------- | | 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` |