CINXE.COM
Customize the Card Entry Form
<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta class="swiftype" name="page_type" data-type="enum" content="techref"/><title>Customize the Card Entry Form</title><meta name="description" content="Learn how to apply custom styles to the Web Payments SDK card payment form."/><meta name="environment" content="production"/><meta property="og:site_name" content="Square Developer"/><meta property="og:title" content="Customize the Card Entry Form"/><meta property="og:description" content="Learn how to apply custom styles to the Web Payments SDK card payment form."/><meta property="og:url" content="https://developer.squareup.com/docs/web-payments/customize-styles"/><meta name="twitter:card" content="summary"/><meta name="twitter:site" content="@SquareDev"/><meta name="twitter:creator" content="@SquareDev"/><meta name="twitter:title" content="Customize the Card Entry Form"/><meta name="twitter:url" content="https://developer.squareup.com/docs/web-payments/customize-styles"/><meta name="twitter:description" content="Learn how to apply custom styles to the Web Payments SDK card payment form."/><meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=1"/><link rel="shortcut icon" href="/favicon.ico"/><link rel="canonical" href="https://developer.squareup.com/docs/web-payments/customize-styles"/><meta name="next-head-count" content="18"/><link rel="preconnect" href="https://dex-tech-fe-production-c.squarecdn.com/main"/><link rel="preconnect" href="https://square-fonts-production-f.squarecdn.com"/><link rel="preload" href="https://square-fonts-production-f.squarecdn.com/square-sans.min.css" as="style"/><link rel="stylesheet" href="https://square-fonts-production-f.squarecdn.com/square-sans.min.css"/><script id="sync-theme-from-storage" integrity="" type="text/javascript" data-nscript="beforeInteractive">var canUseLocalStorage = true; try { window.localStorage } catch (e) { canUseLocalStorage = false } var showDark = !1, storedVal = canUseLocalStorage && window.localStorage.getItem("themeSwitcher-isDark"); (showDark = storedVal ? "true" === storedVal : window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) && !window.location.pathname.startsWith("/docs") && document.querySelector("html").classList.add("dark"); if(canUseLocalStorage && !storedVal) { window.localStorage.setItem("themeSwitcher-isDark", showDark); }</script><link rel="preload" href="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/css/b67c827188bc994a.css" as="style"/><link rel="stylesheet" href="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/css/b67c827188bc994a.css" data-n-g=""/><link rel="preload" href="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/css/214e90f9c54d8b89.css" as="style"/><link rel="stylesheet" href="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/css/214e90f9c54d8b89.css" data-n-p=""/><link rel="preload" href="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/css/1ee312704ccd3658.css" as="style"/><link rel="stylesheet" href="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/css/1ee312704ccd3658.css" data-n-p=""/><link rel="preload" href="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/css/f46c8bc19c31c913.css" as="style"/><link rel="stylesheet" href="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/css/f46c8bc19c31c913.css" data-n-p=""/><noscript data-n-css=""></noscript><script defer="" nomodule="" src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/polyfills-c67a75d1b6f99dc8.js"></script><script id="one-trust" src="https://cdn.cookielaw.org/scripttemplates/otSDKStub.js" type="text/javascript" data-domain-script="c4657020-c7d1-4a14-a091-267a7ee4863e" defer="" data-nscript="beforeInteractive"></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/webpack-295bd8df079283c3.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/framework-e3cb3eb2d5f357d8.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/main-6bd61b5a73f90664.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/pages/_app-187c20f4337dae4c.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/32855e9f-1a692ea671250f50.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/6311-971c73fc3e6291d4.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/4678-8aad20363577e47b.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/8834-a2fe10ea1e50d1e4.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/6008-e6bf90c7cb0b44b8.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/8863-d8617f2f83cc6921.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/6588-e55325977561a5db.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/285-31390a691cd85c04.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/5576-40eb1c708a8e78d3.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/7633-b76e657507858118.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/5958-df3791ebb9eca8b8.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/chunks/pages/docs/%5B%5B...slug%5D%5D-36746d6dc5d19fbe.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/b19e9bf6c2e7608b1a09ca60e575f7c7a0540e24/_buildManifest.js" defer=""></script><script src="https://dex-tech-fe-production-c.squarecdn.com/main/_next/static/b19e9bf6c2e7608b1a09ca60e575f7c7a0540e24/_ssgManifest.js" defer=""></script></head><body><market-context-manager></market-context-manager><div id="__next"><div id="user-interaction-publisher"><market-toaster></market-toaster><div class="app_app__T4olD"><div class="grid_dex-grid-container__ZLJnB grid_dex-docs-app-grid-container__k80cL page-layout_page-layout__M2lNk page-layout_fixed-layout__hOmlH"><div class="grid-item_grid-item-full__LsU8d page-layout_top-layout__ejnXB"><div class="mobile-nav-helpers_vars__2Xk6M mobile-nav-helpers_shifter__7JF7H mobile-nav-helpers_show-hamburger-tablet__fNdPX"><div><header class="dex-site-header svelte-180r00y slim noPadding" data-swiftype-index="false" type="button" data-test-selector="site-header"><div class="dex-nav__left-nav svelte-180r00y"><button class="dex-site-header__collapse-button dex-site-header__button-reset svelte-180r00y" aria-label="navigation menu"><svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M2 6a1 1 0 011-1h18a1 1 0 110 2H3a1 1 0 01-1-1zm0 6a1 1 0 011-1h18a1 1 0 110 2H3a1 1 0 01-1-1zm1 5a1 1 0 100 2h18a1 1 0 100-2H3z" fill="var(--dex-nav-nav-hamburger-color)"></path></svg></button> <a class="dex-site-header__link-outer dex-site-header__desktop-nav dex-site-header__logo svelte-180r00y noPadding" href="https://developer.squareup.com" data-test-selector="site-header-square-logo"><div class="dex-site-header__link-inner svelte-180r00y"><div class="dsgn-logo svelte-1afh84a"><svg role="presentation" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" class="svelte-bffzqn"><path d="M7.526 7.866c-.026.08-.026.179-.026.376v3.516c0 .197 0 .296.026.376a.53.53 0 0 0 .34.34c.08.026.179.026.376.026h3.516c.197 0 .296 0 .376-.026a.53.53 0 0 0 .34-.34c.026-.08.026-.179.026-.376V8.242c0-.197 0-.296-.026-.376a.53.53 0 0 0-.34-.34c-.08-.026-.179-.026-.376-.026H8.242c-.197 0-.296 0-.376.026a.53.53 0 0 0-.34.34z" fill="var(--dex-nav-text-color-primary)"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M0 4c0-.62 0-.929.041-1.188A3.333 3.333 0 0 1 2.811.04C3.072 0 3.382 0 4 0h12c.62 0 .929 0 1.188.041a3.333 3.333 0 0 1 2.771 2.77C20 3.072 20 3.382 20 4v12c0 .62 0 .929-.041 1.188a3.333 3.333 0 0 1-2.77 2.771C16.928 20 16.618 20 16 20H4c-.62 0-.929 0-1.188-.041a3.333 3.333 0 0 1-2.771-2.77C0 16.928 0 16.618 0 16V4zm4 .947C4 4.424 4.424 4 4.947 4h10.106c.523 0 .947.424.947.947v10.106a.947.947 0 0 1-.947.947H4.947A.947.947 0 0 1 4 15.053V4.947z" fill="var(--dex-nav-text-color-primary)"></path></svg></div> <div class="dsgn-logo-text svelte-1afh84a"><svg role="presentation" xmlns="http://www.w3.org/2000/svg" width="164" height="20" fill="none" aria-label="Square Developer" class="svelte-1afh84a"><path d="M16.675 0H3.376C1.483 0 0 1.483 0 3.325v13.299a3.318 3.318 0 0 0 3.325 3.325h13.3a3.318 3.318 0 0 0 3.324-3.325v-13.3C20 1.485 18.517 0 16.675 0Zm-.307 15.294a1.08 1.08 0 0 1-1.074 1.074H4.706a1.08 1.08 0 0 1-1.074-1.074V4.706c0-.614.46-1.074 1.074-1.074h10.64c.562 0 1.022.46 1.022 1.074v10.588Zm-4.245-2.557a.591.591 0 0 0 .614-.614V7.877a.591.591 0 0 0-.614-.614H7.877a.591.591 0 0 0-.614.614v4.246c0 .358.256.614.614.614h4.246Zm13.197-.307h2.2c.102 1.227.92 2.2 2.66 2.2 1.534 0 2.454-.768 2.454-1.893 0-1.075-.716-1.535-2.046-1.842l-1.688-.358c-1.841-.41-3.222-1.586-3.222-3.53 0-2.148 1.892-3.58 4.348-3.58 2.608 0 4.296 1.381 4.399 3.376h-2.098c-.255-.92-1.023-1.534-2.301-1.534-1.33 0-2.251.716-2.251 1.636 0 .921.818 1.484 2.2 1.79l1.687.359c1.842.409 3.07 1.534 3.07 3.478 0 2.455-1.842 3.939-4.502 3.939-3.12.102-4.757-1.535-4.91-4.041ZM42.455 20v-3.632l.154-1.585h-.154c-.511 1.125-1.534 1.79-2.966 1.79-2.302 0-3.99-1.893-3.99-4.757 0-2.865 1.688-4.757 3.99-4.757 1.432 0 2.404.665 2.966 1.688h.154V7.212H44.5V19.95h-2.046V20Zm.051-8.184C42.506 9.974 41.381 8.9 40 8.9c-1.381 0-2.506 1.074-2.506 2.916 0 1.841 1.125 2.915 2.506 2.915 1.381 0 2.506-1.074 2.506-2.915Zm3.479.92V7.213h2.046v5.32c0 1.432.716 2.148 1.841 2.148 1.432 0 2.353-1.023 2.353-2.608v-4.86h2.046v9.156H52.38v-1.892h-.154c-.46 1.227-1.432 2.046-2.967 2.046-2.148.05-3.273-1.381-3.273-3.785Zm9.514 1.075c0-1.688 1.176-2.711 3.325-2.814l2.506-.153v-.716c0-.87-.614-1.381-1.74-1.381-1.022 0-1.636.511-1.79 1.227h-2.045c.204-1.841 1.739-2.915 3.836-2.915 2.353 0 3.785 1.023 3.785 2.915v6.394h-1.893V14.68h-.153c-.41 1.126-1.33 1.893-3.018 1.893-1.637 0-2.813-1.125-2.813-2.762Zm5.831-1.126v-.46l-2.046.154c-1.125.05-1.586.46-1.586 1.278 0 .716.563 1.177 1.381 1.177 1.433 0 2.251-.921 2.251-2.149Zm3.58 3.683V7.212h1.893v1.74h.154c.255-1.177 1.176-1.74 2.557-1.74h.92v1.842h-1.176c-1.33 0-2.301.87-2.301 2.455v4.86H64.91Zm14.783-4.194h-6.956c.102 1.688 1.278 2.609 2.608 2.609 1.126 0 1.79-.46 2.2-1.177h1.995c-.563 1.842-2.2 2.967-4.246 2.967-2.71 0-4.603-1.995-4.603-4.757 0-2.711 1.943-4.757 4.603-4.757 2.66 0 4.45 1.841 4.45 4.143 0 .41 0 .665-.05.972Zm-1.944-1.381c-.05-1.279-1.125-2.148-2.404-2.148-1.227 0-2.25.767-2.455 2.148h4.86ZM84.962 16.368V3.888h3.99c3.631 0 6.086 2.301 6.086 6.24 0 3.938-2.455 6.24-6.087 6.24h-3.99Zm2.148-1.892h1.841c2.302 0 3.99-1.484 3.99-4.348 0-2.865-1.688-4.348-3.99-4.348H87.11v8.696ZM104.962 12.174h-6.957c.103 1.688 1.279 2.609 2.609 2.609 1.125 0 1.79-.46 2.199-1.177h1.995c-.562 1.842-2.199 2.967-4.245 2.967-2.711 0-4.604-1.995-4.604-4.757 0-2.762 1.944-4.757 4.604-4.757s4.45 1.841 4.45 4.143c.051.41 0 .665-.051.972Zm-1.944-1.381c-.051-1.279-1.125-2.148-2.404-2.148-1.228 0-2.25.767-2.455 2.148h4.859ZM108.389 16.368l-3.223-9.156h2.251l1.841 5.473.307 1.28h.154l.358-1.28 1.841-5.473h2.251l-3.376 9.156h-2.404ZM123.12 12.174h-6.956c.102 1.688 1.279 2.609 2.608 2.609 1.126 0 1.791-.46 2.2-1.177h1.995c-.563 1.842-2.2 2.967-4.246 2.967-2.711 0-4.603-1.995-4.603-4.757 0-2.762 1.943-4.757 4.603-4.757 2.66 0 4.45 1.841 4.45 4.143 0 .41-.051.665-.051.972Zm-1.995-1.381c-.051-1.279-1.125-2.148-2.404-2.148-1.227 0-2.25.767-2.455 2.148h4.859ZM124.348 16.368V3.683h2.046v12.685h-2.046ZM127.57 11.816c0-2.762 1.842-4.757 4.604-4.757s4.552 1.944 4.552 4.757c0 2.813-1.841 4.757-4.552 4.757-2.813 0-4.604-1.995-4.604-4.757Zm7.059 0c0-1.893-1.125-2.916-2.506-2.916-1.381 0-2.507 1.023-2.507 2.916 0 1.892 1.126 2.915 2.507 2.915 1.381 0 2.506-1.023 2.506-2.915ZM137.903 7.263h1.893v1.535h.153c.563-1.074 1.534-1.74 2.967-1.74 2.302 0 3.989 1.893 3.989 4.758 0 2.864-1.687 4.757-3.989 4.757-1.433 0-2.456-.665-2.967-1.688h-.153l.153 1.534v3.376h-2.046V7.263Zm6.956 4.553c0-1.842-1.125-2.916-2.506-2.916-1.381 0-2.506 1.074-2.506 2.916 0 1.841 1.125 2.915 2.506 2.915 1.381 0 2.506-1.074 2.506-2.915ZM156.829 12.174h-6.957c.103 1.688 1.279 2.609 2.609 2.609 1.125 0 1.79-.46 2.199-1.177h1.995c-.562 1.842-2.199 2.967-4.245 2.967-2.711 0-4.604-1.995-4.604-4.757 0-2.762 1.944-4.757 4.604-4.757s4.45 1.841 4.45 4.143c0 .41-.051.665-.051.972Zm-1.944-1.381c-.051-1.279-1.125-2.148-2.404-2.148-1.228 0-2.251.767-2.455 2.148h4.859ZM158.056 16.368V7.263h1.893v1.74h.153c.256-1.177 1.177-1.74 2.558-1.74h.921v1.842h-1.177c-1.33 0-2.302.87-2.302 2.455v4.808h-2.046Z" fill="var(--dex-nav-logo-color-primary)"></path></svg> </div></div></a> <button class="dex-site-header__link-outer dex-site-header__mobile-nav dex-site-header__button-reset svelte-180r00y"><div class="dex-site-header__link-inner svelte-180r00y"><div class="dsgn-logo svelte-1afh84a"><svg role="presentation" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" class="svelte-bffzqn"><path d="M7.526 7.866c-.026.08-.026.179-.026.376v3.516c0 .197 0 .296.026.376a.53.53 0 0 0 .34.34c.08.026.179.026.376.026h3.516c.197 0 .296 0 .376-.026a.53.53 0 0 0 .34-.34c.026-.08.026-.179.026-.376V8.242c0-.197 0-.296-.026-.376a.53.53 0 0 0-.34-.34c-.08-.026-.179-.026-.376-.026H8.242c-.197 0-.296 0-.376.026a.53.53 0 0 0-.34.34z" fill="var(--dex-nav-text-color-primary)"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M0 4c0-.62 0-.929.041-1.188A3.333 3.333 0 0 1 2.811.04C3.072 0 3.382 0 4 0h12c.62 0 .929 0 1.188.041a3.333 3.333 0 0 1 2.771 2.77C20 3.072 20 3.382 20 4v12c0 .62 0 .929-.041 1.188a3.333 3.333 0 0 1-2.77 2.771C16.928 20 16.618 20 16 20H4c-.62 0-.929 0-1.188-.041a3.333 3.333 0 0 1-2.771-2.77C0 16.928 0 16.618 0 16V4zm4 .947C4 4.424 4.424 4 4.947 4h10.106c.523 0 .947.424.947.947v10.106a.947.947 0 0 1-.947.947H4.947A.947.947 0 0 1 4 15.053V4.947z" fill="var(--dex-nav-text-color-primary)"></path></svg></div> <div class="dsgn-logo-text svelte-1afh84a"><svg role="presentation" xmlns="http://www.w3.org/2000/svg" width="164" height="20" fill="none" aria-label="Square Developer" class="svelte-1afh84a"><path d="M16.675 0H3.376C1.483 0 0 1.483 0 3.325v13.299a3.318 3.318 0 0 0 3.325 3.325h13.3a3.318 3.318 0 0 0 3.324-3.325v-13.3C20 1.485 18.517 0 16.675 0Zm-.307 15.294a1.08 1.08 0 0 1-1.074 1.074H4.706a1.08 1.08 0 0 1-1.074-1.074V4.706c0-.614.46-1.074 1.074-1.074h10.64c.562 0 1.022.46 1.022 1.074v10.588Zm-4.245-2.557a.591.591 0 0 0 .614-.614V7.877a.591.591 0 0 0-.614-.614H7.877a.591.591 0 0 0-.614.614v4.246c0 .358.256.614.614.614h4.246Zm13.197-.307h2.2c.102 1.227.92 2.2 2.66 2.2 1.534 0 2.454-.768 2.454-1.893 0-1.075-.716-1.535-2.046-1.842l-1.688-.358c-1.841-.41-3.222-1.586-3.222-3.53 0-2.148 1.892-3.58 4.348-3.58 2.608 0 4.296 1.381 4.399 3.376h-2.098c-.255-.92-1.023-1.534-2.301-1.534-1.33 0-2.251.716-2.251 1.636 0 .921.818 1.484 2.2 1.79l1.687.359c1.842.409 3.07 1.534 3.07 3.478 0 2.455-1.842 3.939-4.502 3.939-3.12.102-4.757-1.535-4.91-4.041ZM42.455 20v-3.632l.154-1.585h-.154c-.511 1.125-1.534 1.79-2.966 1.79-2.302 0-3.99-1.893-3.99-4.757 0-2.865 1.688-4.757 3.99-4.757 1.432 0 2.404.665 2.966 1.688h.154V7.212H44.5V19.95h-2.046V20Zm.051-8.184C42.506 9.974 41.381 8.9 40 8.9c-1.381 0-2.506 1.074-2.506 2.916 0 1.841 1.125 2.915 2.506 2.915 1.381 0 2.506-1.074 2.506-2.915Zm3.479.92V7.213h2.046v5.32c0 1.432.716 2.148 1.841 2.148 1.432 0 2.353-1.023 2.353-2.608v-4.86h2.046v9.156H52.38v-1.892h-.154c-.46 1.227-1.432 2.046-2.967 2.046-2.148.05-3.273-1.381-3.273-3.785Zm9.514 1.075c0-1.688 1.176-2.711 3.325-2.814l2.506-.153v-.716c0-.87-.614-1.381-1.74-1.381-1.022 0-1.636.511-1.79 1.227h-2.045c.204-1.841 1.739-2.915 3.836-2.915 2.353 0 3.785 1.023 3.785 2.915v6.394h-1.893V14.68h-.153c-.41 1.126-1.33 1.893-3.018 1.893-1.637 0-2.813-1.125-2.813-2.762Zm5.831-1.126v-.46l-2.046.154c-1.125.05-1.586.46-1.586 1.278 0 .716.563 1.177 1.381 1.177 1.433 0 2.251-.921 2.251-2.149Zm3.58 3.683V7.212h1.893v1.74h.154c.255-1.177 1.176-1.74 2.557-1.74h.92v1.842h-1.176c-1.33 0-2.301.87-2.301 2.455v4.86H64.91Zm14.783-4.194h-6.956c.102 1.688 1.278 2.609 2.608 2.609 1.126 0 1.79-.46 2.2-1.177h1.995c-.563 1.842-2.2 2.967-4.246 2.967-2.71 0-4.603-1.995-4.603-4.757 0-2.711 1.943-4.757 4.603-4.757 2.66 0 4.45 1.841 4.45 4.143 0 .41 0 .665-.05.972Zm-1.944-1.381c-.05-1.279-1.125-2.148-2.404-2.148-1.227 0-2.25.767-2.455 2.148h4.86ZM84.962 16.368V3.888h3.99c3.631 0 6.086 2.301 6.086 6.24 0 3.938-2.455 6.24-6.087 6.24h-3.99Zm2.148-1.892h1.841c2.302 0 3.99-1.484 3.99-4.348 0-2.865-1.688-4.348-3.99-4.348H87.11v8.696ZM104.962 12.174h-6.957c.103 1.688 1.279 2.609 2.609 2.609 1.125 0 1.79-.46 2.199-1.177h1.995c-.562 1.842-2.199 2.967-4.245 2.967-2.711 0-4.604-1.995-4.604-4.757 0-2.762 1.944-4.757 4.604-4.757s4.45 1.841 4.45 4.143c.051.41 0 .665-.051.972Zm-1.944-1.381c-.051-1.279-1.125-2.148-2.404-2.148-1.228 0-2.25.767-2.455 2.148h4.859ZM108.389 16.368l-3.223-9.156h2.251l1.841 5.473.307 1.28h.154l.358-1.28 1.841-5.473h2.251l-3.376 9.156h-2.404ZM123.12 12.174h-6.956c.102 1.688 1.279 2.609 2.608 2.609 1.126 0 1.791-.46 2.2-1.177h1.995c-.563 1.842-2.2 2.967-4.246 2.967-2.711 0-4.603-1.995-4.603-4.757 0-2.762 1.943-4.757 4.603-4.757 2.66 0 4.45 1.841 4.45 4.143 0 .41-.051.665-.051.972Zm-1.995-1.381c-.051-1.279-1.125-2.148-2.404-2.148-1.227 0-2.25.767-2.455 2.148h4.859ZM124.348 16.368V3.683h2.046v12.685h-2.046ZM127.57 11.816c0-2.762 1.842-4.757 4.604-4.757s4.552 1.944 4.552 4.757c0 2.813-1.841 4.757-4.552 4.757-2.813 0-4.604-1.995-4.604-4.757Zm7.059 0c0-1.893-1.125-2.916-2.506-2.916-1.381 0-2.507 1.023-2.507 2.916 0 1.892 1.126 2.915 2.507 2.915 1.381 0 2.506-1.023 2.506-2.915ZM137.903 7.263h1.893v1.535h.153c.563-1.074 1.534-1.74 2.967-1.74 2.302 0 3.989 1.893 3.989 4.758 0 2.864-1.687 4.757-3.989 4.757-1.433 0-2.456-.665-2.967-1.688h-.153l.153 1.534v3.376h-2.046V7.263Zm6.956 4.553c0-1.842-1.125-2.916-2.506-2.916-1.381 0-2.506 1.074-2.506 2.916 0 1.841 1.125 2.915 2.506 2.915 1.381 0 2.506-1.074 2.506-2.915ZM156.829 12.174h-6.957c.103 1.688 1.279 2.609 2.609 2.609 1.125 0 1.79-.46 2.199-1.177h1.995c-.562 1.842-2.199 2.967-4.245 2.967-2.711 0-4.604-1.995-4.604-4.757 0-2.762 1.944-4.757 4.604-4.757s4.45 1.841 4.45 4.143c0 .41-.051.665-.051.972Zm-1.944-1.381c-.051-1.279-1.125-2.148-2.404-2.148-1.228 0-2.251.767-2.455 2.148h4.859ZM158.056 16.368V7.263h1.893v1.74h.153c.256-1.177 1.177-1.74 2.558-1.74h.921v1.842h-1.177c-1.33 0-2.302.87-2.302 2.455v4.808h-2.046Z" fill="var(--dex-nav-logo-color-primary)"></path></svg> </div> <span class="chevron svelte-180r00y"><svg class="direction--down svelte-mcdwxn" width="10" height="12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 4l4 4 4-4" stroke="var(--dex-nav-icon-color)" stroke-width="2" stroke-linecap="round"></path></svg></span></div></button></div> <div class="dex-site-header__search-container svelte-180r00y"><button class="dsgn__search-button svelte-ezc5q8" data-test-selector="search-button"><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none"><path fill="var(--dex-nav-text-color-primary)" fill-opacity=".9" d="M5 9.667a4.639 4.639 0 0 0 2.787-.934l2.74 2.74.94-.94-2.74-2.74a4.61 4.61 0 0 0 .933-2.786A4.672 4.672 0 0 0 4.993.34 4.672 4.672 0 0 0 .327 5.007c0 2.573 2.1 4.66 4.673 4.66Zm0-8a3.335 3.335 0 0 1 0 6.666 3.335 3.335 0 0 1 0-6.666Z"></path></svg> <span class="dsgn-search__desktop-view dsgn-search__button-text svelte-ezc5q8">Search developer resources</span> <div data-testid="search-hot-key" class="dsgn-search__desktop-view dsgn-search__button-hotkey-container svelte-ezc5q8"><div class="dsgn-search__desktop-view dsgn-search__button-hotkey-text svelte-ezc5q8">/ </div></div> </button></div> <ul class="dex-site-header__right-nav svelte-180r00y"><li class="dex-site-header__desktop-nav svelte-180r00y"><button class="dsgn__dropdown-button svelte-1dsehf1 highlighted">Docs & Tools</button> </li> <li class="dex-site-header__desktop-nav svelte-180r00y"><button class="dsgn__dropdown-button svelte-1dsehf1">SDKs</button> </li> <li class="dex-site-header__desktop-nav svelte-180r00y"><button class="dsgn__dropdown-button svelte-1dsehf1">Support</button> </li> <li class="dex-site-header__desktop-nav svelte-180r00y"><a data-test-selector="site-header-partnerships-link" class="dex-site-header__right-nav__link dex-site-header__link-outer svelte-180r00y" href="https://www.squareup.com/us/en/partnerships">Partnerships </a></li> <li class="dex-site-header__desktop-nav svelte-180r00y"><a data-test-selector="site-header-sign-in-link" class="dex-site-header__right-nav__link dex-site-header__link-outer sign-in-link svelte-180r00y" href="https://squareup.com/login?app=developer&return_to=https://developer.squareup.com/apps">Sign In </a></li> <li class="dex-site-header__mobile-nav svelte-180r00y"><a data-test-selector="site-header-sign-in-link" class="dex-site-header__right-nav__link dex-site-header__link-outer sign-in-link svelte-180r00y" href="https://squareup.com/login?app=developer&return_to=https://developer.squareup.com/apps">Sign In </a></li></ul></header> </div></div></div><div class="grid-item_grid-item-full__LsU8d"><div data-testid="top-nav-desktop" class="box_p-l-3x__N7Usx box_p-r-3x__0IVNa box_b-t-l-std__qC_VL box_b-b-l-std__q5XI3 top-nav_top-nav__aG_ui top-nav_desktop__iLo1X"><a data-tracking-id="top-nav-link" data-tracking-extra="{"title":"Docs Home"}" href="/docs" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy top-nav-items_link__YZ4rI focus-ring-styles_focus-ring__5P6v0">Docs Home</a><div data-testid="top-nav-divider" class="box_m-l-075x__tnNb9 box_m-r-075x__gXUwj top-nav-items_divider__VVpS8"></div><a data-tracking-id="top-nav-link" data-tracking-extra="{"title":"Dev Essentials"}" href="/docs/development-essentials" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy top-nav-items_link__YZ4rI focus-ring-styles_focus-ring__5P6v0">Dev Essentials</a><div data-testid="top-nav-divider" class="box_m-l-075x__tnNb9 box_m-r-075x__gXUwj top-nav-items_divider__VVpS8"></div><a data-tracking-id="top-nav-link" data-tracking-extra="{"title":"Payments"}" href="/docs/payments-overview" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy top-nav-items_link__YZ4rI top-nav-items_active__uF7_5 focus-ring-styles_focus-ring__5P6v0">Payments</a><a data-tracking-id="top-nav-link" data-tracking-extra="{"title":"Commerce"}" href="/docs/commerce" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy top-nav-items_link__YZ4rI focus-ring-styles_focus-ring__5P6v0">Commerce</a><a data-tracking-id="top-nav-link" data-tracking-extra="{"title":"Customers"}" href="/docs/customers" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy top-nav-items_link__YZ4rI focus-ring-styles_focus-ring__5P6v0">Customers</a><a data-tracking-id="top-nav-link" data-tracking-extra="{"title":"Staff"}" href="/docs/staff" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy top-nav-items_link__YZ4rI focus-ring-styles_focus-ring__5P6v0">Staff</a><a data-tracking-id="top-nav-link" data-tracking-extra="{"title":"Merchants"}" href="/docs/merchant-details" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy top-nav-items_link__YZ4rI focus-ring-styles_focus-ring__5P6v0">Merchants</a><div data-testid="top-nav-divider" class="box_m-l-075x__tnNb9 box_m-r-075x__gXUwj top-nav-items_divider__VVpS8"></div><a data-tracking-id="top-nav-link" data-tracking-extra="{"title":"Publish"}" href="/docs/app-marketplace" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy top-nav-items_link__YZ4rI focus-ring-styles_focus-ring__5P6v0">Publish</a><div data-testid="top-nav-space" class="top-nav-items_space__H5jum"></div><div data-testid="top-nav-divider" class="box_m-l-075x__tnNb9 box_m-r-075x__gXUwj top-nav-items_divider__VVpS8"></div><a data-tracking-id="top-nav-link" data-tracking-extra="{"title":"Release notes"}" href="/docs/release-notes" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy top-nav-items_link__YZ4rI focus-ring-styles_focus-ring__5P6v0">Release notes</a></div></div><div data-testid="docs-mobile-nav" class="box_p-l-3x__N7Usx box_p-r-3x__0IVNa box_p-t-3x__w9FzI box_p-b-3x__BcYHb mobile-nav_mobile-nav__VSQOx"><div class="mobile-nav_top__U5ub2"><div><h2 data-testid="mobile-nav-title" class="heading_base__MS64u heading_heading-30__MH4YZ">Docs</h2></div><button data-tracking-id="docs-mobile-nav-close-button" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 mobile-nav_close-button__q8KNd"><svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="m6.71 18.71 5.29-5.3 5.29 5.3 1.42-1.42-5.3-5.29 5.3-5.29-1.42-1.42-5.29 5.3-5.29-5.3-1.42 1.42 5.3 5.29-5.3 5.29 1.42 1.42Z" fill="#7B61FF"></path></svg></button></div><div class="box_m-t-7x__d2nuT"><div data-testid="mobile-nav-item" class="box_m-t-2x__WfWa6 box_m-b-2x__nVJGZ box_p-b-2x__bSkd6 box_b-b-l-std__q5XI3 mobile-nav_nav-item__d7rgv"><a href="/docs" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy mobile-nav_link__k_jYe">Docs Home</a></div><div data-testid="mobile-nav-item" class="box_m-t-2x__WfWa6 box_m-b-2x__nVJGZ box_p-b-2x__bSkd6 box_b-b-l-std__q5XI3 mobile-nav_nav-item__d7rgv"><a href="/docs/development-essentials" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy mobile-nav_link__k_jYe">Dev Essentials</a><button data-tracking-id="mobile-nav-step-into" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m5 4.586 4 4-4 4L6.414 14l5.414-5.414-5.414-5.414L5 4.586Z" fill="currentColor"></path></svg></button></div><div data-testid="mobile-nav-item" class="box_m-t-2x__WfWa6 box_m-b-2x__nVJGZ box_p-b-2x__bSkd6 box_b-b-l-std__q5XI3 mobile-nav_nav-item__d7rgv"><a href="/docs/payments-overview" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy mobile-nav_link__k_jYe mobile-nav_active__23Zu_">Payments</a><button data-tracking-id="mobile-nav-step-into" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m5 4.586 4 4-4 4L6.414 14l5.414-5.414-5.414-5.414L5 4.586Z" fill="currentColor"></path></svg></button></div><div data-testid="mobile-nav-item" class="box_m-t-2x__WfWa6 box_m-b-2x__nVJGZ box_p-b-2x__bSkd6 box_b-b-l-std__q5XI3 mobile-nav_nav-item__d7rgv"><a href="/docs/commerce" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy mobile-nav_link__k_jYe">Commerce</a><button data-tracking-id="mobile-nav-step-into" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m5 4.586 4 4-4 4L6.414 14l5.414-5.414-5.414-5.414L5 4.586Z" fill="currentColor"></path></svg></button></div><div data-testid="mobile-nav-item" class="box_m-t-2x__WfWa6 box_m-b-2x__nVJGZ box_p-b-2x__bSkd6 box_b-b-l-std__q5XI3 mobile-nav_nav-item__d7rgv"><a href="/docs/customers" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy mobile-nav_link__k_jYe">Customers</a><button data-tracking-id="mobile-nav-step-into" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m5 4.586 4 4-4 4L6.414 14l5.414-5.414-5.414-5.414L5 4.586Z" fill="currentColor"></path></svg></button></div><div data-testid="mobile-nav-item" class="box_m-t-2x__WfWa6 box_m-b-2x__nVJGZ box_p-b-2x__bSkd6 box_b-b-l-std__q5XI3 mobile-nav_nav-item__d7rgv"><a href="/docs/staff" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy mobile-nav_link__k_jYe">Staff</a><button data-tracking-id="mobile-nav-step-into" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m5 4.586 4 4-4 4L6.414 14l5.414-5.414-5.414-5.414L5 4.586Z" fill="currentColor"></path></svg></button></div><div data-testid="mobile-nav-item" class="box_m-t-2x__WfWa6 box_m-b-2x__nVJGZ box_p-b-2x__bSkd6 box_b-b-l-std__q5XI3 mobile-nav_nav-item__d7rgv"><a href="/docs/merchant-details" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy mobile-nav_link__k_jYe">Merchants</a><button data-tracking-id="mobile-nav-step-into" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m5 4.586 4 4-4 4L6.414 14l5.414-5.414-5.414-5.414L5 4.586Z" fill="currentColor"></path></svg></button></div><div data-testid="mobile-nav-item" class="box_m-t-2x__WfWa6 box_m-b-2x__nVJGZ box_p-b-2x__bSkd6 box_b-b-l-std__q5XI3 mobile-nav_nav-item__d7rgv"><a href="/docs/app-marketplace" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy mobile-nav_link__k_jYe">Publish</a><button data-tracking-id="mobile-nav-step-into" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m5 4.586 4 4-4 4L6.414 14l5.414-5.414-5.414-5.414L5 4.586Z" fill="currentColor"></path></svg></button></div><div data-testid="mobile-nav-item" class="box_m-t-2x__WfWa6 box_m-b-2x__nVJGZ box_p-b-2x__bSkd6 box_b-b-l-std__q5XI3 mobile-nav_nav-item__d7rgv"><a href="/docs/release-notes" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy mobile-nav_link__k_jYe">Release notes</a><button data-tracking-id="mobile-nav-step-into" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m5 4.586 4 4-4 4L6.414 14l5.414-5.414-5.414-5.414L5 4.586Z" fill="currentColor"></path></svg></button></div></div></div></div><div data-testid="left-layout" class="page-layout_page-layout__M2lNk page-layout_fixed-layout__hOmlH page-layout_left-layout__rxzHd"><button data-testid="left-nav-toggle" data-tracking-id="left-nav-toggle" aria-label="Toggle left navigation" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 left-nav_left-nav-toggle__M_yBT"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="24" viewBox="0 0 16 12" fill="none"><path fill="#7B61FF" fill-rule="evenodd" d="M0.292893 5.29282L5.29289 0.292818L6.70711 1.70703L3.41421 4.99992L6.5 4.99992L11.5 4.99992L11.5 6.99992L6.5 6.99992L3.41421 6.99992L6.70711 10.2928L5.29289 11.707L0.292893 6.70703C-0.0976315 6.31651 -0.0976315 5.68334 0.292893 5.29282ZM16 -6.99382e-07L14 -6.11959e-07L14 12L16 12L16 -6.99382e-07Z" clip-rule="evenodd"></path></svg></button><div data-testid="left-nav" class="box_p-l-3x__N7Usx box_p-r-3x__0IVNa box_p-t-2x__M5RH8 box_p-b-2x__bSkd6 box_b-r-l-std__Q4dy4 left-nav_left-nav__tj2rk"><div class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Overview"}" href="/docs/payments-overview" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Overview</a></div><div aria-expanded="false" aria-controls=":R59l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Technical Scenarios"}" href="/docs/payments/scenarios" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Technical Scenarios</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R59l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Build a Tip Report"}" href="/docs/payments/scenarios/tip-reporting" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Build a Tip Report</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Split an Online Payment"}" href="/docs/payments/scenarios/split-online-payment" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Split an Online Payment</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Build a Sales Report"}" href="/docs/payments/scenarios/simple-sales-report" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Build a Sales Report</a></div></div></div><div aria-expanded="false" aria-controls=":R79l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Payments"}" href="/docs/payments-refunds" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Payments</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R79l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div aria-expanded="false" aria-controls=":Rq79l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Take Payments"}" href="/docs/payments-api/take-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Take Payments</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":Rq79l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div aria-expanded="false" aria-controls=":R1kq79l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Card Payments"}" href="/docs/payments-api/take-payments/card-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Card Payments</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R1kq79l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Delayed Capture"}" href="/docs/payments-api/take-payments/card-payments/delayed-capture" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Delayed Capture</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Partial Payments"}" href="/docs/payments-api/take-payments/card-payments/partial-payments-with-gift-cards" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Partial Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Statement Descriptions"}" href="/docs/payments-api/take-payments/card-payments/statement-descriptions" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Statement Descriptions</a></div></div></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"ACH Bank Transfer Payment"}" href="/docs/payments-api/take-payments/ach-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>ACH Bank Transfer Payment</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Afterpay and Clearpay Payments"}" href="/docs/payments-api/take-payments/afterpay-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Afterpay and Clearpay Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Cash App Payments"}" href="/docs/payments-api/take-payments/cash-app-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Cash App Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Cash Payments"}" href="/docs/payments-api/take-payments/cash-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Cash Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"External Payments"}" href="/docs/payments-api/take-payments/external-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>External Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"House Accounts"}" href="/docs/payments-api/take-payments/house-accounts" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>House Accounts</a></div></div></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Collect Application Fees"}" href="/docs/payments-api/take-payments-and-collect-fees" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Collect Application Fees</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Update Payment and Tip Amounts"}" href="/docs/payments-api/update-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Update Payment and Tip Amounts</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Retrieve Payments"}" href="/docs/payments-api/retrieve-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Retrieve Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Troubleshoot"}" href="/docs/payments-api/error-codes" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Troubleshoot</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Webhooks"}" href="/docs/payments-api/webhooks" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Webhooks</a></div></div></div><div aria-expanded="false" aria-controls=":R99l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Refunds"}" href="/docs/refunds-api/overview" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Refunds</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R99l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Refund Payments"}" href="/docs/payments-api/refund-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Refund Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Refund a Payment with an App Fee"}" href="/docs/payments-api/collect-fees/payment-with-app-fee-refund" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Refund a Payment with an App Fee</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Retrieve Refunds"}" href="/docs/refunds-api/retrieve-refunds" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Retrieve Refunds</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Process an Unlinked Refund"}" href="/docs/refunds-api/unlinked-refunds" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Process an Unlinked Refund</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Webhooks"}" href="/docs/refunds-api/webhooks" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Webhooks</a></div></div></div><div aria-expanded="false" aria-controls=":Rb9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Disputes"}" href="/docs/disputes-api/overview" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Disputes</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":Rb9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Process Disputes"}" href="/docs/disputes-api/process-disputes" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Process Disputes</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Test in the Sandbox"}" href="/docs/disputes-api/sandbox-testing" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Test in the Sandbox</a></div></div></div><div data-testid="left-nav-divider" class="box_m-l-075x__tnNb9 box_m-r-075x__gXUwj left-nav-items_divider__up2uZ"></div><div aria-expanded="false" aria-controls=":Rf9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Take Payments on Hardware"}" href="/docs/in-person-payment-options" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Take Payments on Hardware</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":Rf9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div aria-expanded="false" aria-controls=":Rqf9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Terminal API"}" href="/docs/terminal-api/overview" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Terminal API</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":Rqf9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Quickstart"}" href="/docs/terminal-api/quickstart" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Quickstart</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Take Payments"}" href="/docs/terminal-api/square-terminal-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Take Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"POS App Pairing with Square Terminal"}" href="/docs/terminal-api/pos-integration" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>POS App Pairing with Square Terminal</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Dismiss Terminal Checkouts and Refunds"}" href="/docs/terminal-api/dismiss-checkouts-and-refunds" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Dismiss Terminal Checkouts and Refunds</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Monitor Square Terminals"}" href="/docs/terminal-api/terminal-device-monitoring" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Monitor Square Terminals</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Manage Terminal Actions"}" href="/docs/terminal-api/advanced-features" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Manage Terminal Actions</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Save Card on File"}" href="/docs/terminal-api/advanced-features/save-card-on-file" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Save Card on File</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Check Device Information"}" href="/docs/terminal-api/advanced-features/check-device-information" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Check Device Information</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Print or Issue Receipts"}" href="/docs/terminal-api/advanced-features/issue-receipts" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Print or Issue Receipts</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Customize the Idle Screen"}" href="/docs/terminal-api/advanced-features/customize-idle-screen" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Customize the Idle Screen</a></div><div aria-expanded="false" aria-controls=":Rbkqf9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Custom Screen Workflows"}" href="/docs/terminal-api/advanced-features/custom-workflows" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Custom Screen Workflows</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":Rbkqf9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Confirmation Screen"}" href="/docs/terminal-api/advanced-features/custom-workflows/confirmation" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Confirmation Screen</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Signature Capture Screen"}" href="/docs/terminal-api/advanced-features/custom-workflows/signature" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Signature Capture Screen</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Data Collection Screen"}" href="/docs/terminal-api/advanced-features/custom-workflows/data-collection" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Data Collection Screen</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Menu Selection List Screen"}" href="/docs/terminal-api/advanced-features/custom-workflows/menu-select" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Menu Selection List Screen</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"QR Code Screen"}" href="/docs/terminal-api/advanced-features/custom-workflows/qr-code-display" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>QR Code Screen</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Link and Dismiss Actions"}" href="/docs/terminal-api/advanced-features/custom-workflows/link-and-dismiss-actions" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Link and Dismiss Actions</a></div></div></div><div aria-expanded="false" aria-controls=":Rckqf9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"International Payment Methods"}" href="/docs/terminal-api/international-payment-methods" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>International Payment Methods</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":Rckqf9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Refund Interac Payments"}" href="/docs/terminal-api/square-terminal-refunds" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Refund Interac Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Take E-Money Payments"}" href="/docs/terminal-api/e-money-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Take E-Money Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Take PayPay QR Code Payments"}" href="/docs/terminal-api/international-payment-methods/paypay-qr-code-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Take PayPay QR Code Payments</a></div></div></div></div></div><div aria-expanded="false" aria-controls=":R1af9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Mobile Payments SDK"}" href="/docs/mobile-payments-sdk" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Mobile Payments SDK</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R1af9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div aria-expanded="false" aria-controls=":R1laf9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Build on Android"}" href="/docs/mobile-payments-sdk/android" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Build on Android</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R1laf9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Authorize the Mobile Payments SDK"}" href="/docs/mobile-payments-sdk/android/configure-authorize" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Authorize the Mobile Payments SDK</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Pair and Manage Card Readers"}" href="/docs/mobile-payments-sdk/android/pair-manage-readers" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Pair and Manage Card Readers</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Take a Payment"}" href="/docs/mobile-payments-sdk/android/take-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Take a Payment</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Offline Payments"}" href="/docs/mobile-payments-sdk/android/offline-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Offline Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Handling Errors"}" href="/docs/mobile-payments-sdk/android/handling-errors" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Handling Errors</a></div></div></div><div aria-expanded="false" aria-controls=":R2laf9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Build on iOS"}" href="/docs/mobile-payments-sdk/ios" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Build on iOS</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R2laf9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Authorize the Mobile Payments SDK"}" href="/docs/mobile-payments-sdk/ios/configure-authorize" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Authorize the Mobile Payments SDK</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Pair and Manage Card Readers"}" href="/docs/mobile-payments-sdk/ios/pair-manage-readers" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Pair and Manage Card Readers</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Take a Payment"}" href="/docs/mobile-payments-sdk/ios/take-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Take a Payment</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Offline Payments"}" href="/docs/mobile-payments-sdk/ios/offline-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Offline Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Configure for Square Stand"}" href="/docs/mobile-payments-sdk/ios/square-stand" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Configure for Square Stand</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Handling Errors"}" href="/docs/mobile-payments-sdk/ios/handling-errors" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Handling Errors</a></div></div></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Migrate from Reader SDK"}" href="/docs/mobile-payments-sdk/migrate" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Migrate from Reader SDK</a></div></div></div><div aria-expanded="false" aria-controls=":R1qf9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Reader SDK"}" href="/docs/reader-sdk/what-it-does" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Reader SDK</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R1qf9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div aria-expanded="false" aria-controls=":R1lqf9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Quickstart"}" href="/docs/reader-sdk/quick-start/start" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Quickstart</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R1lqf9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Get Credentials"}" href="/docs/reader-sdk/quick-start/step-1" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Get Credentials</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Configure the Sample Application"}" href="/docs/reader-sdk/quick-start/step-2" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Configure the Sample Application</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Take a Cash Payment"}" href="/docs/reader-sdk/quick-start/step-3" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Take a Cash Payment</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Customize the Checkout Amount"}" href="/docs/reader-sdk/quick-start/step-4" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Customize the Checkout Amount</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Take a Credit Card Payment"}" href="/docs/reader-sdk/quick-start/step-5" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Take a Credit Card Payment</a></div></div></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"How It Works"}" href="/docs/reader-sdk/how-it-works" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>How It Works</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Build on Android"}" href="/docs/reader-sdk/build-on-android" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Build on Android</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Build on iOS"}" href="/docs/reader-sdk/build-on-ios" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Build on iOS</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Connect a Contactless Reader"}" href="/docs/reader-sdk/cookbook/contactless-reader" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Connect a Contactless Reader</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Charge a Card on File"}" href="/docs/reader-sdk/cookbook/charge-cards-on-file" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Charge a Card on File</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Save a Card on File"}" href="/docs/reader-sdk/cookbook/save-cards-on-file" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Save a Card on File</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Configure on iOS for Square Stand"}" href="/docs/reader-sdk/cookbook/square-stand" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Configure on iOS for Square Stand</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Deauthorize Reader SDK"}" href="/docs/reader-sdk/cookbook/deauthorize-reader-sdk" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Deauthorize Reader SDK</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Capture a Transaction"}" href="/docs/reader-sdk/cookbook/capture-a-transaction" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Capture a Transaction</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Delay the Capture of Payments"}" href="/docs/reader-sdk/cookbook/delay-capture-of-payment" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Delay the Capture of Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Configure APK Splits"}" href="/docs/reader-sdk/cookbook/configure-apk-splits" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Configure APK Splits</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Update to New Reader SDK Version"}" href="/docs/reader-sdk/upgrade-reader-sdk" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Update to New Reader SDK Version</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Flutter Plugin"}" href="/docs/reader-sdk/flutter" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Flutter Plugin</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"React Native Plugin"}" href="/docs/reader-sdk/react-native" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>React Native Plugin</a></div></div></div><div aria-expanded="false" aria-controls=":R2af9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Point of Sale API"}" href="/docs/pos-api/what-it-does" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Point of Sale API</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R2af9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"How It Works"}" href="/docs/pos-api/how-it-works" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>How It Works</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Build on Android"}" href="/docs/pos-api/build-on-android" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Build on Android</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Build on iOS"}" href="/docs/pos-api/build-on-ios" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Build on iOS</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Build on Mobile Web"}" href="/docs/pos-api/build-mobile-web" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Build on Mobile Web</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Find Your Android Fingerprint"}" href="/docs/pos-api/cookbook/find-your-android-fingerprint" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Find Your Android Fingerprint</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Use the API in Offline Mode"}" href="/docs/pos-api/cookbook/offline-mode" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Use the API in Offline Mode</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Add an Alert Dialog Helper Class"}" href="/docs/pos-api/cookbook/alert-dialog-helper" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Add an Alert Dialog Helper Class</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Accept E-Money Payments"}" href="/docs/pos-api/cookbook/electronic-payments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Accept E-Money Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Accept PayPay Payments"}" href="/docs/pos-api/qr-code-payments-paypay" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Accept PayPay Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Mobile Web Technical Reference"}" href="/docs/pos-api/web-technical-reference" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Mobile Web Technical Reference</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Payments API Integration"}" href="/docs/pos-api/payments-integration" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Payments API Integration</a></div></div></div></div></div><div aria-expanded="true" aria-controls=":Rh9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Take Payments Online"}" href="/docs/online-payment-options" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Take Payments Online</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd recursive-nav-item_expanded__VQNoM"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":Rh9l6:" role="region" class="recursive-nav-item_items-container__BBrAQ recursive-nav-item_expanded__VQNoM"><div class="recursive-nav-item_content__WNo9i"><div aria-expanded="true" aria-controls=":Rqh9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Web Payments SDK"}" href="/docs/web-payments/overview" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Web Payments SDK</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd recursive-nav-item_expanded__VQNoM"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":Rqh9l6:" role="region" class="recursive-nav-item_items-container__BBrAQ recursive-nav-item_expanded__VQNoM"><div class="recursive-nav-item_content__WNo9i"><div aria-expanded="false" aria-controls=":R1kqh9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Quickstart"}" href="/docs/web-payments/quickstart" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Quickstart</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R1kqh9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Clone the Quickstart Project Template"}" href="/docs/web-payments/quickstart/clone-quickstart-project" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Clone the Quickstart Project Template</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Add the SDK to the Web Client"}" href="/docs/web-payments/quickstart/add-sdk-to-web-client" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Add the SDK to the Web Client</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Verify the Payment"}" href="/docs/web-payments/quickstart/verify-the-payment" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Verify the Payment</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Add Strong Customer Authentication"}" href="/docs/web-payments/quickstart/add-sca" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Add Strong Customer Authentication</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Deploy the Application"}" href="/docs/web-payments/quickstart/deploy-app" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Deploy the Application</a></div></div></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Take a Card Payment"}" href="/docs/web-payments/take-card-payment" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Take a Card Payment</a></div><div aria-expanded="false" aria-controls=":R3kqh9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Integrate Digital Wallets"}" href="/docs/web-payments/digital-wallets" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Integrate Digital Wallets</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R3kqh9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Apple Pay"}" href="/docs/web-payments/apple-pay" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Apple Pay</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Google Pay"}" href="/docs/web-payments/google-pay" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Google Pay</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Digital Wallet Payment Requests"}" href="/docs/web-payments/payment-requests" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Digital Wallet Payment Requests</a></div></div></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"ACH Bank Transfer"}" href="/docs/web-payments/add-ach" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>ACH Bank Transfer</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Afterpay"}" href="/docs/web-payments/add-afterpay" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Afterpay</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Cash App Pay"}" href="/docs/web-payments/add-cash-app-pay" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Cash App Pay</a></div><div aria-expanded="false" aria-controls=":R7kqh9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Square Gift Card Payments"}" href="/docs/web-payments/gift-cards-intro" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Square Gift Card Payments</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R7kqh9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Take a Gift Card Payment"}" href="/docs/web-payments/gift-card" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Take a Gift Card Payment</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Take Partial Payments"}" href="/docs/web-payments/gift-card-walkthrough" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Take Partial Payments</a></div></div></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Customize the Card Entry Form"}" id="left-nav-active-item" href="/docs/web-payments/customize-styles" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_active__X6xck left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Customize the Card Entry Form</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Add SCA to a Card Payment"}" href="/docs/web-payments/sca" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Add SCA to a Card Payment</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Store Card on File with SCA"}" href="/docs/web-payments/sca-add-card" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Store Card on File with SCA</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Charge Card on File with SCA"}" href="/docs/web-payments/sca-charge-card-on-file" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Charge Card on File with SCA</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Charge and Store Card on File with SCA"}" href="/docs/web-payments/sca-charge-and-store-card-on-file" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Charge and Store Card on File with SCA</a></div></div></div><div aria-expanded="false" aria-controls=":R1ah9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"In-App Payments SDK"}" href="/docs/in-app-payments-sdk/what-it-does" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">In-App Payments SDK</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R1ah9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div aria-expanded="false" aria-controls=":R1lah9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Quickstart"}" href="/docs/in-app-payments-sdk/quick-start" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Quickstart</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R1lah9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Set up the Client"}" href="/docs/in-app-payments-sdk/quick-start/generate-token" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Set up the Client</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Deploy the Server"}" href="/docs/in-app-payments-sdk/quick-start/deploy-server-backend" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Deploy the Server</a></div></div></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Install the SDK"}" href="/docs/in-app-payments-sdk/installation" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Install the SDK</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Build on Android"}" href="/docs/in-app-payments-sdk/build-on-android" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Build on Android</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Build on iOS"}" href="/docs/in-app-payments-sdk/build-on-ios" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Build on iOS</a></div><div aria-expanded="false" aria-controls=":R5lah9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Integrate Digital Wallets"}" href="/docs/in-app-payments-sdk/add-digital-wallets" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Integrate Digital Wallets</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R5lah9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Google Pay"}" href="/docs/in-app-payments-sdk/add-digital-wallets/google-pay" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Google Pay</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Apple Pay"}" href="/docs/in-app-payments-sdk/add-digital-wallets/apple-pay" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Apple Pay</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Enable SRC for Android"}" href="/docs/in-app-payments-sdk/add-digital-wallets/src/android" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Enable SRC for Android</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Enable SRC for iOS"}" href="/docs/in-app-payments-sdk/add-digital-wallets/src/ios" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Enable SRC for iOS</a></div></div></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Localize an Application "}" href="/docs/in-app-payments/localize-ios" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Localize an Application </a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Gift Card Payments"}" href="/docs/in-app-payments-sdk/cookbook/giftcards" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Gift Card Payments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Flutter Plugin"}" href="/docs/in-app-payments-sdk/flutter" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Flutter Plugin</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"React Native Plugin"}" href="/docs/in-app-payments-sdk/react-native" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>React Native Plugin</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Customize the Payment Entry Form"}" href="/docs/in-app-payments-sdk/cookbook/customize-payment-form" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Customize the Payment Entry Form</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Connect to a Backend Service"}" href="/docs/in-app-payments-sdk/cookbook/connect-to-a-backend-service" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Connect to a Backend Service</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Remove the Postal Code Requirement"}" href="/docs/in-app-payments-sdk/cookbook/disable-postal-code" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Remove the Postal Code Requirement</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Troubleshoot"}" href="/docs/in-app-payments-sdk/troubleshooting" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Troubleshoot</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"How It Works"}" href="/docs/in-app-payments-sdk/how-it-works" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>How It Works</a></div><div aria-expanded="false" aria-controls=":Rflah9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Strong Customer Authentication"}" href="/docs/sca-overview-iap" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Strong Customer Authentication</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":Rflah9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Verify a Buyer"}" href="/docs/in-app-payments-sdk/verify-buyer" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span><span class="left-nav-items_depth-space__b597h"></span>Verify a Buyer</a></div></div></div></div></div><div aria-expanded="false" aria-controls=":R1qh9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Checkout API"}" href="/docs/checkout-api" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Checkout API</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R1qh9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Quick Pay Checkout"}" href="/docs/checkout-api/quick-pay-checkout" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Quick Pay Checkout</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Square Order Checkout"}" href="/docs/checkout-api/square-order-checkout" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Square Order Checkout</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Subscription Plan Checkout"}" href="/docs/checkout-api/subscription-plan-checkout" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Subscription Plan Checkout</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Checkout Settings"}" href="/docs/checkout-api/checkout-settings" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Checkout Settings</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Checkout Configurations"}" href="/docs/checkout-api/optional-checkout-configurations" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Checkout Configurations</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Manage Checkout"}" href="/docs/checkout-api/manage-checkout" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Manage Checkout</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Guidelines and Limitations"}" href="/docs/checkout-api/guidelines-and-limitations" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Guidelines and Limitations</a></div></div></div><div aria-expanded="false" aria-controls=":R2ah9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Subscriptions API"}" href="/docs/subscriptions/overview" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Subscriptions API</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R2ah9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Subscription Plans and Variations"}" href="/docs/subscriptions-api/plans-and-variations" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Subscription Plans and Variations</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Manage Subscriptions"}" href="/docs/subscriptions-api/manage-subscriptions" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Manage Subscriptions</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Subscription Actions and Events"}" href="/docs/subscriptions-api/actions-events" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Subscription Actions and Events</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Pause, Resume, or Cancel Subscriptions"}" href="/docs/subscriptions-api/pause-resume-cancel-subscriptions" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Pause, Resume, or Cancel Subscriptions</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Subscription Billing and Invoices"}" href="/docs/subscriptions-api/subscription-billing" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Subscription Billing and Invoices</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Swap Subscription Plan Variations"}" href="/docs/subscriptions-api/swap-plan-variations" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Swap Subscription Plan Variations</a></div></div></div><div aria-expanded="false" aria-controls=":R2qh9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_inner-sub-cat__ngiQT"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Invoices API"}" href="/docs/invoices-api/overview" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Invoices API</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":R2qh9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Create and Publish Invoices"}" href="/docs/invoices-api/create-publish-invoices" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Create and Publish Invoices</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Retrieve, List, or Search Invoices"}" href="/docs/invoices-api/retrieve-list-search-invoices" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Retrieve, List, or Search Invoices</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Create or Delete Invoice Attachments"}" href="/docs/invoices-api/attachments" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Create or Delete Invoice Attachments</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Update Invoices"}" href="/docs/invoices-api/update-invoices" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Update Invoices</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Cancel or Delete Invoices"}" href="/docs/invoices-api/cancel-delete-invoices" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Cancel or Delete Invoices</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Pay or Refund Invoices"}" href="/docs/invoices-api/pay-refund-invoices" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Pay or Refund Invoices</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Walkthrough: Create and Publish Invoices"}" href="/docs/invoices-api/walkthrough" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0"><span class="left-nav-items_depth-space__b597h"></span>Walkthrough: Create and Publish Invoices</a></div></div></div></div></div><div data-testid="left-nav-divider" class="box_m-l-075x__tnNb9 box_m-r-075x__gXUwj left-nav-items_divider__up2uZ"></div><div aria-expanded="false" aria-controls=":Rl9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Cards"}" href="/docs/cards-api/overview" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Cards</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":Rl9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Manage Cards"}" href="/docs/cards-api/manage-cards" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Manage Cards</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Create a Card on File from Payment ID"}" href="/docs/cards-api/walkthrough/card-from-payment-id" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Create a Card on File from Payment ID</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Create a Card on File and Make a Payment"}" href="/docs/cards-api/walkthrough-seller-card" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Create a Card on File and Make a Payment</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Create a Shared Card on File and Make a Payment"}" href="/docs/cards-api/walkthrough-shared-card" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Create a Shared Card on File and Make a Payment</a></div></div></div><div aria-expanded="false" aria-controls=":Rn9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Payouts"}" href="/docs/payouts-api/overview" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Payouts</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":Rn9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"List Payouts"}" href="/docs/payouts-api/list-payouts" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">List Payouts</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Get Payout"}" href="/docs/payouts-api/get-payout" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Get Payout</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"List Payout Entries"}" href="/docs/payouts-api/list-payout-entries" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">List Payout Entries</a></div></div></div><div class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Bank Accounts"}" href="/docs/bank-accounts-api" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Bank Accounts</a></div><div aria-expanded="false" aria-controls=":Rr9l6:" class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Mobile Authorization"}" href="/docs/mobile-authz/what-it-does" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Mobile Authorization</a><button data-testid="expand-nav-items" data-tracking-id="expand-nav-items" aria-label="Expand navigation items" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 recursive-nav-item_expand-button__OaGCd"><svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="m4 4.586 4 4 4-4L13.414 6 8 11.414 2.586 6 4 4.586Z" fill="#7B61FF"></path></svg></button></div><div id=":Rr9l6:" inert="true" role="region" class="recursive-nav-item_items-container__BBrAQ"><div class="recursive-nav-item_content__WNo9i"><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"How It Works"}" href="/docs/mobile-authz/how-it-works" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">How It Works</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Build with Mobile Authorization"}" href="/docs/mobile-authz/build-with-mobile-authz" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Build with Mobile Authorization</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Get Authorization Code on Command Line"}" href="/docs/mobile-authz/cookbook/mobile-code-with-curl" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_medium-20__UlBGy left-nav-items_link__skoFI left-nav-items_sub-level__bbmd6 focus-ring-styles_focus-ring__5P6v0">Get Authorization Code on Command Line</a></div></div></div><div data-testid="left-nav-divider" class="box_m-l-075x__tnNb9 box_m-r-075x__gXUwj left-nav-items_divider__up2uZ"></div><div class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Payment Methods by Country"}" href="/docs/payment-card-support-by-country" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Payment Methods by Country</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Payments Pricing"}" href="/docs/payments-pricing" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Payments Pricing</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Strong Customer Authentication"}" href="/docs/sca-overview" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Strong Customer Authentication</a></div><div class="recursive-nav-item_nav-item-wrap__7yT4s recursive-nav-item_top-level__aAjx6"><a data-tracking-id="left-nav-link" data-tracking-extra="{"title":"Payment Minimums"}" href="/docs/payment-minimums" class="text_base__bZ6a4 text_paragraph-30___agDz text_medium-30__U9kB2 left-nav-items_link__skoFI left-nav-items_top-level__zpAn3 focus-ring-styles_focus-ring__5P6v0">Payment Minimums</a></div></div></div><div class="grid_dex-grid-container__ZLJnB grid_dex-docs-app-grid-container__k80cL page-layout_page-layout__M2lNk page-layout_static-layout__CfHWZ"><div class="grid-item_grid-item-small__Xb5VI page-layout_left-nav__gfhJ2"></div><div class="box_m-t-6x__LvLNv box_m-b-6x__RhdjX page-layout_page-main__W1JTS grid-item_grid-item-medium__GhKvB"><div data-testid="docs-content-layout" class="grid_dex-grid-container__ZLJnB grid_dex-docs-content-grid-container__diyxN"><div class="page-layout_content-main-grid-item__VRqbw page-layout_grid-item-column-autosizing__PtGh2 grid-item_grid-item-medium__GhKvB page-layout_limit-width__VDAgU"><div data-testid="doc-page-heading-breadcrumbs" class="box_m-b-05x__rKeET doc-breadcrumb_container__l80u_"><a aria-label="Documentation homepage" href="/docs" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 doc-breadcrumb_breadcrumb__xyMjK focus-ring-styles_focus-ring__5P6v0"><svg width="10" height="20" viewBox="0 0 10 22" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M.5 16a.5.5 0 0 1-.5-.5V9.02a1 1 0 0 1 .427-.819l4-2.8a1 1 0 0 1 1.146 0l4 2.8a1 1 0 0 1 .427.82V15.5a.5.5 0 0 1-.5.5H6v-4H4v4H.5Z" fill="#000" fill-opacity="0.55"></path></svg></a><p class="box_m-l-05x__zb9MT box_m-r-05x__m9ODf text_base__bZ6a4 text_paragraph-10__9t3Cn text_color-30__dpPZ4">/</p><a href="/docs/payments-overview" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 doc-breadcrumb_breadcrumb__xyMjK focus-ring-styles_focus-ring__5P6v0">Payments</a><p class="box_m-l-05x__zb9MT box_m-r-05x__m9ODf text_base__bZ6a4 text_paragraph-10__9t3Cn text_color-30__dpPZ4">/</p><a href="/docs/online-payment-options" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 doc-breadcrumb_breadcrumb__xyMjK focus-ring-styles_focus-ring__5P6v0">Take Payments Online</a><p class="box_m-l-05x__zb9MT box_m-r-05x__m9ODf text_base__bZ6a4 text_paragraph-10__9t3Cn text_color-30__dpPZ4">/</p><a href="/docs/web-payments/overview" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 doc-breadcrumb_breadcrumb__xyMjK focus-ring-styles_focus-ring__5P6v0">Web Payments SDK</a></div><h1 data-testid="doc-page-heading" class="box_m-b-3x__A9ryy heading_base__MS64u heading_display-10__HZsS7 content_heading__9PVgB">Customize the Card Entry Form</h1><div><div><article data-testid="markdown-doc" class="text_base__bZ6a4 text_paragraph-30___agDz nodes_article__2nMA2"><p><strong>Applies to:</strong> <span slot="trigger"><a data-tracking-id="markdown-link" href="/docs/web-payments/overview" class="nodes_markdown-link__1J6_a">Web Payments SDK</a></span></p><p><span class="box_m-t-1x__GR9iT text_base__bZ6a4 text_paragraph-30___agDz markdown-subheading_subheading__g4TR2">Learn how to apply custom styles to the Web Payments SDK card payment form.</span></p><div data-testid="toc-narrow" class="box_m-t-3x__rN_qC box_m-b-6x__RhdjX markdown-toc_narrow__ErCJb"><button data-tracking-id="toc-accordion-clicked" aria-expanded="true" aria-controls=":Rgucpddl6:" class="box_m-t-1x__GR9iT box_m-b-1x__b2HHn box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 accordion_accordion__vbQko"><h5 class="box_p-t-1x__1ZOZv box_p-b-1x__E6rAE heading_base__MS64u heading_heading-5__lcRR4">On this page</h5><svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg" class="icon_icon-color__dAdSt" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="m12 11.414-4-4-4 4L2.586 10 8 4.586 13.414 10 12 11.414Z" fill="#7B61FF"></path></svg></button><div role="region" id=":Rgucpddl6:" class="accordion_container__Q6e6I accordion_expanded__gzqmt"><div class="accordion_content__zl9fW"><div class="box_m-b-1x__b2HHn"><a data-tracking-id="sidebar-link-clicked" href="/docs/web-payments/customize-styles#overview" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 sidebar-link_sidebar-link__hvuMG sidebar-link_sidebar-container__NFtV_">Overview</a></div><div class="box_m-b-1x__b2HHn"><a data-tracking-id="sidebar-link-clicked" href="/docs/web-payments/customize-styles#configure-a-customized-card-payment-method" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 sidebar-link_sidebar-link__hvuMG sidebar-link_sidebar-container__NFtV_">Configure a customized Card payment method</a></div><div class="box_m-b-1x__b2HHn"><a data-tracking-id="sidebar-link-clicked" href="/docs/web-payments/customize-styles#dynamic-layout" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 sidebar-link_sidebar-link__hvuMG sidebar-link_sidebar-container__NFtV_">Dynamic layout</a></div><div><a data-tracking-id="sidebar-link-clicked" href="/docs/web-payments/customize-styles#see-also" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 sidebar-link_sidebar-link__hvuMG sidebar-link_sidebar-container__NFtV_">See also</a></div></div></div></div><div data-markdown-heading="2" class="box_m-t-5x__L06CC box_m-b-2x__nVJGZ"><a href="#overview" id="overview" aria-label="anchor link for overview" class="anchored-heading_anchor__JhuiX"></a><div class="anchored-heading_heading__2wlPu"><div class="anchored-heading_container__rfGXv"><market-tooltip popover-placement="top-start"><a data-tracking-id="heading-anchor" role="link" tabindex="0" slot="trigger" aria-label="click to copy link for overview" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 anchored-heading_trigger__XOE12 anchored-heading_button__TMpy8"><svg width="16" height="16" viewBox="0 0 16 16" class="anchored-heading_icon__4HlYl"><path d="M10.432 1.032c-.641.093-.887.239-1.099.649-.056.109-.07.184-.071.391-.001.229.009.276.097.455a.921.921 0 0 0 .486.471c.198.092.446.102.849.035.807-.133 1.657.312 2.034 1.065.161.321.212.538.212.9 0 .361-.05.573-.216.916-.122.254-.131.262-1.778 1.91C9.299 9.471 9.29 9.48 9.036 9.602c-.375.182-.572.223-.988.207-.538-.021-.887-.163-1.303-.533-.259-.23-.453-.312-.741-.313a.971.971 0 0 0-.681.263c-.2.18-.29.382-.304.684-.017.354.065.54.365.829.502.484 1.096.81 1.797.986.424.107 1.137.133 1.589.059.366-.06.832-.209 1.141-.364.549-.276.665-.378 2.46-2.172 1.462-1.462 1.725-1.738 1.886-1.982.483-.732.692-1.417.692-2.269 0-1.11-.398-2.063-1.189-2.844a3.97 3.97 0 0 0-2.019-1.074 4.553 4.553 0 0 0-1.309-.047M6.93 3.694a4.276 4.276 0 0 0-1.955.778c-.103.074-.931.877-1.839 1.786C1.352 8.041 1.242 8.167.959 8.75c-.171.354-.25.583-.336.974-.083.379-.088 1.156-.011 1.518.34 1.59 1.458 2.767 2.996 3.155.256.065.401.081.835.093 1.025.028 1.494-.153 1.731-.666a.786.786 0 0 0 .082-.411.753.753 0 0 0-.098-.426 1.004 1.004 0 0 0-.482-.476c-.157-.077-.462-.089-.897-.036-.628.078-1.179-.115-1.645-.575a1.563 1.563 0 0 1-.354-.495c-.3-.608-.3-1.185-.001-1.799l.14-.285 1.64-1.639c1.567-1.566 1.65-1.644 1.88-1.761.34-.173.568-.228.946-.228.525 0 .954.164 1.36.522.293.257.404.307.714.323.234.012.277.005.442-.069.226-.101.452-.331.533-.54.084-.22.078-.58-.014-.787-.128-.287-.727-.792-1.249-1.053-.64-.319-1.553-.48-2.241-.395" fill-rule="evenodd"></path></svg></a><span slot="content">Link to section</span></market-tooltip></div><h2 class="heading_base__MS64u heading_heading-30__MH4YZ">Overview</h2></div></div><p>The Web Payments SDK lets you customize the style of the card entry and gift card entry forms. The following sections show the available style choices, how to set them, and what the resulting form looks like. You can see several customization ideas by viewing the <span slot="trigger"><a data-tracking-id="markdown-link" href="https://square.github.io/web-payments-showcase" class="nodes_markdown-link__1J6_a">Design Showcase</a></span> sample on GitHub.</p><p>The following steps add code to the application you created from the <span slot="trigger"><a data-tracking-id="markdown-link" href="https://github.com/square/web-payments-quickstart/blob/main/public/examples/card-payment.html" class="nodes_markdown-link__1J6_a">quickstart project sample</a></span>. If you haven't created an application using the quickstart, you need to do so before completing these steps. You can find a complete example of the <span slot="trigger"><a data-tracking-id="markdown-link" href="https://github.com/square/web-payments-quickstart/blob/main/public/examples/card-styling-simple.html" class="nodes_markdown-link__1J6_a">customized card</a></span> on GitHub.</p><p>You can view the supported stylesheet classes and properties in the <span slot="trigger"><a data-tracking-id="markdown-link" href="https://developer.squareup.com/reference/sdks/web/payments/objects/CardClassSelectors" class="nodes_markdown-link__1J6_a">CardClassSelectors</a></span> object API Reference.</p><p>The five visual elements of the <code class="box_p-l-05x__pvvKi box_p-r-05x__PX6jO box_b-r-4__1LPp7 text_base__bZ6a4 text_paragraph-20__2lYBq text_code-field___GL_9 nodes_inline-code__HksNY">Card</code> payment method are represented as selectors that you specify in a card option styling object. You can set colors, fonts, and border options as shown in the following image:</p><p><img src="https://images.ctfassets.net/1nw4q0oohfju/512I6lwzWyHzA4wz588KD6/ab5513807c73b5d3eefe27fd15563929/visual-elements-card-payment-method-rev1.png?fm=webp" alt="A graphic showing the five visual elements of the Card payment method, which are represented as selectors that you specify in a card option styling object."/></p><div data-testid="toc-narrow" class="box_m-t-3x__rN_qC box_m-b-6x__RhdjX markdown-toc_narrow__ErCJb"><button data-tracking-id="toc-accordion-clicked" aria-expanded="true" aria-controls=":Rimcpddl6:" class="box_m-t-1x__GR9iT box_m-b-1x__b2HHn box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 accordion_accordion__vbQko"><h5 class="box_p-t-1x__1ZOZv box_p-b-1x__E6rAE heading_base__MS64u heading_heading-5__lcRR4">On this page</h5><svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg" class="icon_icon-color__dAdSt" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="m12 11.414-4-4-4 4L2.586 10 8 4.586 13.414 10 12 11.414Z" fill="#7B61FF"></path></svg></button><div role="region" id=":Rimcpddl6:" class="accordion_container__Q6e6I accordion_expanded__gzqmt"><div class="accordion_content__zl9fW"><div class="box_m-b-1x__b2HHn"><a data-tracking-id="sidebar-link-clicked" href="/docs/web-payments/customize-styles#overview" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 sidebar-link_sidebar-link__hvuMG sidebar-link_sidebar-container__NFtV_">Overview</a></div><div class="box_m-b-1x__b2HHn"><a data-tracking-id="sidebar-link-clicked" href="/docs/web-payments/customize-styles#configure-a-customized-card-payment-method" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 sidebar-link_sidebar-link__hvuMG sidebar-link_sidebar-container__NFtV_">Configure a customized Card payment method</a></div><div class="box_m-b-1x__b2HHn"><a data-tracking-id="sidebar-link-clicked" href="/docs/web-payments/customize-styles#dynamic-layout" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 sidebar-link_sidebar-link__hvuMG sidebar-link_sidebar-container__NFtV_">Dynamic layout</a></div><div><a data-tracking-id="sidebar-link-clicked" href="/docs/web-payments/customize-styles#see-also" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 sidebar-link_sidebar-link__hvuMG sidebar-link_sidebar-container__NFtV_">See also</a></div></div></div></div><div data-markdown-heading="2" class="box_m-t-5x__L06CC box_m-b-2x__nVJGZ"><a href="#configure-a-customized-card-payment-method" id="configure-a-customized-card-payment-method" aria-label="anchor link for configure-a-customized-card-payment-method" class="anchored-heading_anchor__JhuiX"></a><div class="anchored-heading_heading__2wlPu"><div class="anchored-heading_container__rfGXv"><market-tooltip popover-placement="top-start"><a data-tracking-id="heading-anchor" role="link" tabindex="0" slot="trigger" aria-label="click to copy link for configure-a-customized-card-payment-method" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 anchored-heading_trigger__XOE12 anchored-heading_button__TMpy8"><svg width="16" height="16" viewBox="0 0 16 16" class="anchored-heading_icon__4HlYl"><path d="M10.432 1.032c-.641.093-.887.239-1.099.649-.056.109-.07.184-.071.391-.001.229.009.276.097.455a.921.921 0 0 0 .486.471c.198.092.446.102.849.035.807-.133 1.657.312 2.034 1.065.161.321.212.538.212.9 0 .361-.05.573-.216.916-.122.254-.131.262-1.778 1.91C9.299 9.471 9.29 9.48 9.036 9.602c-.375.182-.572.223-.988.207-.538-.021-.887-.163-1.303-.533-.259-.23-.453-.312-.741-.313a.971.971 0 0 0-.681.263c-.2.18-.29.382-.304.684-.017.354.065.54.365.829.502.484 1.096.81 1.797.986.424.107 1.137.133 1.589.059.366-.06.832-.209 1.141-.364.549-.276.665-.378 2.46-2.172 1.462-1.462 1.725-1.738 1.886-1.982.483-.732.692-1.417.692-2.269 0-1.11-.398-2.063-1.189-2.844a3.97 3.97 0 0 0-2.019-1.074 4.553 4.553 0 0 0-1.309-.047M6.93 3.694a4.276 4.276 0 0 0-1.955.778c-.103.074-.931.877-1.839 1.786C1.352 8.041 1.242 8.167.959 8.75c-.171.354-.25.583-.336.974-.083.379-.088 1.156-.011 1.518.34 1.59 1.458 2.767 2.996 3.155.256.065.401.081.835.093 1.025.028 1.494-.153 1.731-.666a.786.786 0 0 0 .082-.411.753.753 0 0 0-.098-.426 1.004 1.004 0 0 0-.482-.476c-.157-.077-.462-.089-.897-.036-.628.078-1.179-.115-1.645-.575a1.563 1.563 0 0 1-.354-.495c-.3-.608-.3-1.185-.001-1.799l.14-.285 1.64-1.639c1.567-1.566 1.65-1.644 1.88-1.761.34-.173.568-.228.946-.228.525 0 .954.164 1.36.522.293.257.404.307.714.323.234.012.277.005.442-.069.226-.101.452-.331.533-.54.084-.22.078-.58-.014-.787-.128-.287-.727-.792-1.249-1.053-.64-.319-1.553-.48-2.241-.395" fill-rule="evenodd"></path></svg></a><span slot="content">Link to section</span></market-tooltip></div><h2 class="heading_base__MS64u heading_heading-30__MH4YZ">Configure a customized Card payment method</h2></div></div><p>The following steps produce the dark mode card previously shown.</p><div data-markdown-heading="3" class="box_m-t-3x__rN_qC box_m-b-2x__nVJGZ"><a href="#step-1-add-a-dark-mode-style-to-the-page" id="step-1-add-a-dark-mode-style-to-the-page" aria-label="anchor link for step-1-add-a-dark-mode-style-to-the-page" class="anchored-heading_anchor__JhuiX"></a><div class="anchored-heading_heading__2wlPu"><div class="anchored-heading_container__rfGXv"><market-tooltip popover-placement="top-start"><a data-tracking-id="heading-anchor" role="link" tabindex="0" slot="trigger" aria-label="click to copy link for step-1-add-a-dark-mode-style-to-the-page" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 anchored-heading_trigger__XOE12 anchored-heading_button__TMpy8"><svg width="16" height="16" viewBox="0 0 16 16" class="anchored-heading_icon__4HlYl"><path d="M10.432 1.032c-.641.093-.887.239-1.099.649-.056.109-.07.184-.071.391-.001.229.009.276.097.455a.921.921 0 0 0 .486.471c.198.092.446.102.849.035.807-.133 1.657.312 2.034 1.065.161.321.212.538.212.9 0 .361-.05.573-.216.916-.122.254-.131.262-1.778 1.91C9.299 9.471 9.29 9.48 9.036 9.602c-.375.182-.572.223-.988.207-.538-.021-.887-.163-1.303-.533-.259-.23-.453-.312-.741-.313a.971.971 0 0 0-.681.263c-.2.18-.29.382-.304.684-.017.354.065.54.365.829.502.484 1.096.81 1.797.986.424.107 1.137.133 1.589.059.366-.06.832-.209 1.141-.364.549-.276.665-.378 2.46-2.172 1.462-1.462 1.725-1.738 1.886-1.982.483-.732.692-1.417.692-2.269 0-1.11-.398-2.063-1.189-2.844a3.97 3.97 0 0 0-2.019-1.074 4.553 4.553 0 0 0-1.309-.047M6.93 3.694a4.276 4.276 0 0 0-1.955.778c-.103.074-.931.877-1.839 1.786C1.352 8.041 1.242 8.167.959 8.75c-.171.354-.25.583-.336.974-.083.379-.088 1.156-.011 1.518.34 1.59 1.458 2.767 2.996 3.155.256.065.401.081.835.093 1.025.028 1.494-.153 1.731-.666a.786.786 0 0 0 .082-.411.753.753 0 0 0-.098-.426 1.004 1.004 0 0 0-.482-.476c-.157-.077-.462-.089-.897-.036-.628.078-1.179-.115-1.645-.575a1.563 1.563 0 0 1-.354-.495c-.3-.608-.3-1.185-.001-1.799l.14-.285 1.64-1.639c1.567-1.566 1.65-1.644 1.88-1.761.34-.173.568-.228.946-.228.525 0 .954.164 1.36.522.293.257.404.307.714.323.234.012.277.005.442-.069.226-.101.452-.331.533-.54.084-.22.078-.58-.014-.787-.128-.287-.727-.792-1.249-1.053-.64-.319-1.553-.48-2.241-.395" fill-rule="evenodd"></path></svg></a><span slot="content">Link to section</span></market-tooltip></div><h3 class="heading_base__MS64u heading_heading-20__RIpnh">Step 1: Add a dark mode style to the page</h3></div></div><ol><li><p>Add a reference to the <code class="box_p-l-05x__pvvKi box_p-r-05x__PX6jO box_b-r-4__1LPp7 text_base__bZ6a4 text_paragraph-20__2lYBq text_code-field___GL_9 nodes_inline-code__HksNY">dark-mode</code> css class to the body of the page.</p><div class="box_m-t-3x__rN_qC code-block_header__urOUF code-block_floating__ocyWk code-block_request__DDmE0 dark-mode-theme"><div></div><div class="box_m-r-1x__uw0iY box_m-t-5x__L06CC"><div class="code-block-action-button-group_button-group__QsOaL"><div></div><div><div class="icon-button_dropdown__e8K_5"><button data-testid="copy-code-block" data-tracking-id="copy-code-block" slot="trigger" aria-label="Copy code" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 icon-button_icon__Iew7h"><svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg" class="icon_icon-color__dAdSt"><path fill-rule="evenodd" clip-rule="evenodd" d="M11 6a1 1 0 1 0 0 2h5v6a1 1 0 1 0 2 0V8a2 2 0 0 0-2-2h-5ZM9 16v-5h4v5H9Zm-2-6a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H8a1 1 0 0 1-1-1v-7Z" fill="#7B61FF"></path></svg></button></div></div><div><div class="icon-button_dropdown__e8K_5"><button data-testid="expand-code-block" data-tracking-id="expand-code-block" slot="trigger" aria-label="Expand code" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 icon-button_icon__Iew7h"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="icon_icon-color__dAdSt"><path fill-rule="evenodd" clip-rule="evenodd" d="M7 3H13V9H11V6.414L6.414 11H9V13H3V7H5V9.586L9.586 5H7V3Z" fill="#7B61FF"></path></svg></button></div></div></div></div></div><div data-testid="code-block" data-language="html" class="box_m-b-3x__A9ryy box_b-b-l-std__q5XI3 box_b-l-l-std__REGyC box_b-r-l-std__Q4dy4 box_b-r-6__eFn6m code-block_code-block__7vruq code-block_request__DDmE0 dark-mode-theme markdown-code-block_limit-height__WOJUw"><pre tabindex="-1" class="box_p-l-2x__0A2_9 box_p-r-2x__z29W6 box_p-t-2x__M5RH8 box_p-b-2x__bSkd6 code-block_main__7BHb4"><div data-testid="code-block-contents" data-line-numbers-active="true" style="--line-number-length:1ch" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_code-field___GL_9 code_code__4FNSr highlight_code-highlight___caZ6 code_line-numbers___xHrc"><span data-line-number=""></span> <span class="hljs-tag"><<span class="hljs-name">body</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"dark-mode"</span>></span> <span data-line-number=""></span> <span class="hljs-tag"><<span class="hljs-name">form</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"payment-form"</span>></span> <span data-line-number=""></span> <span class="hljs-tag"><<span class="hljs-name">div</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"card-container"</span>></span><span class="hljs-tag"></<span class="hljs-name">div</span>></span> <span data-line-number=""></span> <span class="hljs-tag"></<span class="hljs-name">form</span>></span> <span data-line-number=""></span> <span class="hljs-tag"></<span class="hljs-name">body</span>></span></div></pre><div class="markdown-code-block_bottom-bar___1uwP"><div class="markdown-code-block_bar-position__B59Cr markdown-code-block_footer-action__9cq8l"></div></div></div></li><li><p>Add a <code class="box_p-l-05x__pvvKi box_p-r-05x__PX6jO box_b-r-4__1LPp7 text_base__bZ6a4 text_paragraph-20__2lYBq text_code-field___GL_9 nodes_inline-code__HksNY"> *</code> tag after the current <code class="box_p-l-05x__pvvKi box_p-r-05x__PX6jO box_b-r-4__1LPp7 text_base__bZ6a4 text_paragraph-20__2lYBq text_code-field___GL_9 nodes_inline-code__HksNY"><link href="app.css" rel="stylesheet" /></code> in the header to add dark-mode.css.</p><div class="box_m-t-3x__rN_qC code-block_header__urOUF code-block_floating__ocyWk code-block_request__DDmE0 dark-mode-theme"><div></div><div class="box_m-r-1x__uw0iY box_m-t-5x__L06CC"><div class="code-block-action-button-group_button-group__QsOaL"><div></div><div><div class="icon-button_dropdown__e8K_5"><button data-testid="copy-code-block" data-tracking-id="copy-code-block" slot="trigger" aria-label="Copy code" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 icon-button_icon__Iew7h"><svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg" class="icon_icon-color__dAdSt"><path fill-rule="evenodd" clip-rule="evenodd" d="M11 6a1 1 0 1 0 0 2h5v6a1 1 0 1 0 2 0V8a2 2 0 0 0-2-2h-5ZM9 16v-5h4v5H9Zm-2-6a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H8a1 1 0 0 1-1-1v-7Z" fill="#7B61FF"></path></svg></button></div></div><div></div></div></div></div><div data-testid="code-block" data-language="html" class="box_m-b-3x__A9ryy box_b-b-l-std__q5XI3 box_b-l-l-std__REGyC box_b-r-l-std__Q4dy4 box_b-r-6__eFn6m code-block_code-block__7vruq code-block_request__DDmE0 dark-mode-theme markdown-code-block_limit-height__WOJUw"><pre tabindex="-1" class="box_p-l-2x__0A2_9 box_p-r-2x__z29W6 box_p-t-2x__M5RH8 box_p-b-2x__bSkd6 code-block_main__7BHb4"><div data-testid="code-block-contents" data-line-numbers-active="false" style="--line-number-length:1ch" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_code-field___GL_9 code_code__4FNSr highlight_code-highlight___caZ6"><span data-line-number=""></span> <span class="hljs-tag"><<span class="hljs-name">link</span> <span class="hljs-attr">href</span>=<span class="hljs-string">"dark-mode.css"</span> <span class="hljs-attr">rel</span>=<span class="hljs-string">"stylesheet"</span> /></span></div></pre><div class="markdown-code-block_bottom-bar___1uwP"><div class="markdown-code-block_bar-position__B59Cr markdown-code-block_footer-action__9cq8l"></div></div></div></li></ol><div data-markdown-heading="3" class="box_m-t-3x__rN_qC box_m-b-2x__nVJGZ"><a href="#step-2-define-a-custom-style" id="step-2-define-a-custom-style" aria-label="anchor link for step-2-define-a-custom-style" class="anchored-heading_anchor__JhuiX"></a><div class="anchored-heading_heading__2wlPu"><div class="anchored-heading_container__rfGXv"><market-tooltip popover-placement="top-start"><a data-tracking-id="heading-anchor" role="link" tabindex="0" slot="trigger" aria-label="click to copy link for step-2-define-a-custom-style" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 anchored-heading_trigger__XOE12 anchored-heading_button__TMpy8"><svg width="16" height="16" viewBox="0 0 16 16" class="anchored-heading_icon__4HlYl"><path d="M10.432 1.032c-.641.093-.887.239-1.099.649-.056.109-.07.184-.071.391-.001.229.009.276.097.455a.921.921 0 0 0 .486.471c.198.092.446.102.849.035.807-.133 1.657.312 2.034 1.065.161.321.212.538.212.9 0 .361-.05.573-.216.916-.122.254-.131.262-1.778 1.91C9.299 9.471 9.29 9.48 9.036 9.602c-.375.182-.572.223-.988.207-.538-.021-.887-.163-1.303-.533-.259-.23-.453-.312-.741-.313a.971.971 0 0 0-.681.263c-.2.18-.29.382-.304.684-.017.354.065.54.365.829.502.484 1.096.81 1.797.986.424.107 1.137.133 1.589.059.366-.06.832-.209 1.141-.364.549-.276.665-.378 2.46-2.172 1.462-1.462 1.725-1.738 1.886-1.982.483-.732.692-1.417.692-2.269 0-1.11-.398-2.063-1.189-2.844a3.97 3.97 0 0 0-2.019-1.074 4.553 4.553 0 0 0-1.309-.047M6.93 3.694a4.276 4.276 0 0 0-1.955.778c-.103.074-.931.877-1.839 1.786C1.352 8.041 1.242 8.167.959 8.75c-.171.354-.25.583-.336.974-.083.379-.088 1.156-.011 1.518.34 1.59 1.458 2.767 2.996 3.155.256.065.401.081.835.093 1.025.028 1.494-.153 1.731-.666a.786.786 0 0 0 .082-.411.753.753 0 0 0-.098-.426 1.004 1.004 0 0 0-.482-.476c-.157-.077-.462-.089-.897-.036-.628.078-1.179-.115-1.645-.575a1.563 1.563 0 0 1-.354-.495c-.3-.608-.3-1.185-.001-1.799l.14-.285 1.64-1.639c1.567-1.566 1.65-1.644 1.88-1.761.34-.173.568-.228.946-.228.525 0 .954.164 1.36.522.293.257.404.307.714.323.234.012.277.005.442-.069.226-.101.452-.331.533-.54.084-.22.078-.58-.014-.787-.128-.287-.727-.792-1.249-1.053-.64-.319-1.553-.48-2.241-.395" fill-rule="evenodd"></path></svg></a><span slot="content">Link to section</span></market-tooltip></div><h3 class="heading_base__MS64u heading_heading-20__RIpnh">Step 2: Define a custom style</h3></div></div><p>Declare style customizing options in the<!-- --> <span slot="trigger"><a data-tracking-id="markdown-link" href="https://developer.squareup.com/reference/sdks/web/payments/objects/CardOptions" class="nodes_markdown-link__1J6_a">CardOptions</a></span> object. The <code class="box_p-l-05x__pvvKi box_p-r-05x__PX6jO box_b-r-4__1LPp7 text_base__bZ6a4 text_paragraph-20__2lYBq text_code-field___GL_9 nodes_inline-code__HksNY">style</code> field value is of the <span slot="trigger"><a data-tracking-id="markdown-link" href="https://developer.squareup.com/reference/sdks/web/payments/objects/CardClassSelectors" class="nodes_markdown-link__1J6_a">CardClassSelectors</a></span> type.</p><div class="box_m-t-3x__rN_qC code-block_header__urOUF code-block_floating__ocyWk code-block_request__DDmE0 dark-mode-theme"><div></div><div class="box_m-r-1x__uw0iY box_m-t-5x__L06CC"><div class="code-block-action-button-group_button-group__QsOaL"><div></div><div><div class="icon-button_dropdown__e8K_5"><button data-testid="copy-code-block" data-tracking-id="copy-code-block" slot="trigger" aria-label="Copy code" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 icon-button_icon__Iew7h"><svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg" class="icon_icon-color__dAdSt"><path fill-rule="evenodd" clip-rule="evenodd" d="M11 6a1 1 0 1 0 0 2h5v6a1 1 0 1 0 2 0V8a2 2 0 0 0-2-2h-5ZM9 16v-5h4v5H9Zm-2-6a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H8a1 1 0 0 1-1-1v-7Z" fill="#7B61FF"></path></svg></button></div></div><div><div class="icon-button_dropdown__e8K_5"><button data-testid="expand-code-block" data-tracking-id="expand-code-block" slot="trigger" aria-label="Expand code" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 icon-button_icon__Iew7h"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="icon_icon-color__dAdSt"><path fill-rule="evenodd" clip-rule="evenodd" d="M7 3H13V9H11V6.414L6.414 11H9V13H3V7H5V9.586L9.586 5H7V3Z" fill="#7B61FF"></path></svg></button></div></div></div></div></div><div data-testid="code-block" data-language="javascript" data-test-expanded="false" aria-expanded="false" class="box_m-b-3x__A9ryy box_b-b-l-std__q5XI3 box_b-l-l-std__REGyC box_b-r-l-std__Q4dy4 box_b-r-6__eFn6m code-block_code-block__7vruq code-block_request__DDmE0 dark-mode-theme markdown-code-block_limit-height__WOJUw"><pre tabindex="-1" class="box_p-l-2x__0A2_9 box_p-r-2x__z29W6 box_p-t-2x__M5RH8 box_p-b-2x__bSkd6 code-block_main__7BHb4"><div data-testid="code-block-contents" data-line-numbers-active="true" style="--line-number-length:2ch" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_code-field___GL_9 code_code__4FNSr highlight_code-highlight___caZ6 code_line-numbers___xHrc"><span data-line-number=""></span><span class="hljs-keyword">const</span> darkModeCardStyle = { <span data-line-number=""></span> <span class="hljs-string">'.input-container'</span>: { <span data-line-number=""></span> <span class="hljs-attr">borderColor</span>: <span class="hljs-string">'#2D2D2D'</span>, <span data-line-number=""></span> <span class="hljs-attr">borderRadius</span>: <span class="hljs-string">'6px'</span>, <span data-line-number=""></span> }, <span data-line-number=""></span> <span class="hljs-string">'.input-container.is-focus'</span>: { <span data-line-number=""></span> <span class="hljs-attr">borderColor</span>: <span class="hljs-string">'#006AFF'</span>, <span data-line-number=""></span> }, <span data-line-number=""></span> <span class="hljs-string">'.input-container.is-error'</span>: { <span data-line-number=""></span> <span class="hljs-attr">borderColor</span>: <span class="hljs-string">'#ff1600'</span>, <span data-line-number=""></span> }, <span data-line-number=""></span> <span class="hljs-string">'.message-text'</span>: { <span data-line-number=""></span> <span class="hljs-attr">color</span>: <span class="hljs-string">'#999999'</span>, <span data-line-number=""></span> }, <span data-line-number=""></span> <span class="hljs-string">'.message-icon'</span>: { <span data-line-number=""></span> <span class="hljs-attr">color</span>: <span class="hljs-string">'#999999'</span>, <span data-line-number=""></span> }, <span data-line-number=""></span> <span class="hljs-string">'.message-text.is-error'</span>: { <span data-line-number=""></span> <span class="hljs-attr">color</span>: <span class="hljs-string">'#ff1600'</span>, <span data-line-number=""></span> }, <span data-line-number=""></span> <span class="hljs-string">'.message-icon.is-error'</span>: { <span data-line-number=""></span> <span class="hljs-attr">color</span>: <span class="hljs-string">'#ff1600'</span>, <span data-line-number=""></span> }, <span data-line-number=""></span> <span class="hljs-attr">input</span>: { <span data-line-number=""></span> <span class="hljs-attr">backgroundColor</span>: <span class="hljs-string">'#2D2D2D'</span>, <span data-line-number=""></span> <span class="hljs-attr">color</span>: <span class="hljs-string">'#FFFFFF'</span>, <span data-line-number=""></span> <span class="hljs-attr">fontFamily</span>: <span class="hljs-string">'helvetica neue, sans-serif'</span>, <span data-line-number=""></span> }, <span data-line-number=""></span> <span class="hljs-string">'input::placeholder'</span>: { <span data-line-number=""></span> <span class="hljs-attr">color</span>: <span class="hljs-string">'#999999'</span>, <span data-line-number=""></span> }, <span data-line-number=""></span> <span class="hljs-string">'input.is-error'</span>: { <span data-line-number=""></span> <span class="hljs-attr">color</span>: <span class="hljs-string">'#ff1600'</span>, <span data-line-number=""></span> }, <span data-line-number=""></span> <span class="hljs-string">'@media screen and (max-width: 600px)'</span>: { <span data-line-number=""></span> <span class="hljs-string">'input'</span>: { <span data-line-number=""></span> <span class="hljs-string">'fontSize'</span>: <span class="hljs-string">'12px'</span>, <span data-line-number=""></span> } <span data-line-number=""></span> } <span data-line-number=""></span>};</div></pre><div class="markdown-code-block_bottom-bar___1uwP"><button data-testid="expand-bottom-code-block" data-tracking-id="expand-bottom-code-block" class="native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 code-block-footer_button__TNCq_ code-block-footer_round__rqS_d markdown-code-block_bar-position__B59Cr"><svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg" class="icon_icon-color__dAdSt"><path fill-rule="evenodd" clip-rule="evenodd" d="M16.414 13 12 17.414 7.586 13 9 11.586l2 2V7h2v6.586l2-2L16.414 13Z" fill="#7B61FF"></path></svg></button><div class="markdown-code-block_bar-position__B59Cr markdown-code-block_footer-action__9cq8l"></div></div></div><div data-markdown-heading="3" class="box_m-t-3x__rN_qC box_m-b-2x__nVJGZ"><a href="#step-3-initialize-the-card-payment-method-with-a-custom-style" id="step-3-initialize-the-card-payment-method-with-a-custom-style" aria-label="anchor link for step-3-initialize-the-card-payment-method-with-a-custom-style" class="anchored-heading_anchor__JhuiX"></a><div class="anchored-heading_heading__2wlPu"><div class="anchored-heading_container__rfGXv"><market-tooltip popover-placement="top-start"><a data-tracking-id="heading-anchor" role="link" tabindex="0" slot="trigger" aria-label="click to copy link for step-3-initialize-the-card-payment-method-with-a-custom-style" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 anchored-heading_trigger__XOE12 anchored-heading_button__TMpy8"><svg width="16" height="16" viewBox="0 0 16 16" class="anchored-heading_icon__4HlYl"><path d="M10.432 1.032c-.641.093-.887.239-1.099.649-.056.109-.07.184-.071.391-.001.229.009.276.097.455a.921.921 0 0 0 .486.471c.198.092.446.102.849.035.807-.133 1.657.312 2.034 1.065.161.321.212.538.212.9 0 .361-.05.573-.216.916-.122.254-.131.262-1.778 1.91C9.299 9.471 9.29 9.48 9.036 9.602c-.375.182-.572.223-.988.207-.538-.021-.887-.163-1.303-.533-.259-.23-.453-.312-.741-.313a.971.971 0 0 0-.681.263c-.2.18-.29.382-.304.684-.017.354.065.54.365.829.502.484 1.096.81 1.797.986.424.107 1.137.133 1.589.059.366-.06.832-.209 1.141-.364.549-.276.665-.378 2.46-2.172 1.462-1.462 1.725-1.738 1.886-1.982.483-.732.692-1.417.692-2.269 0-1.11-.398-2.063-1.189-2.844a3.97 3.97 0 0 0-2.019-1.074 4.553 4.553 0 0 0-1.309-.047M6.93 3.694a4.276 4.276 0 0 0-1.955.778c-.103.074-.931.877-1.839 1.786C1.352 8.041 1.242 8.167.959 8.75c-.171.354-.25.583-.336.974-.083.379-.088 1.156-.011 1.518.34 1.59 1.458 2.767 2.996 3.155.256.065.401.081.835.093 1.025.028 1.494-.153 1.731-.666a.786.786 0 0 0 .082-.411.753.753 0 0 0-.098-.426 1.004 1.004 0 0 0-.482-.476c-.157-.077-.462-.089-.897-.036-.628.078-1.179-.115-1.645-.575a1.563 1.563 0 0 1-.354-.495c-.3-.608-.3-1.185-.001-1.799l.14-.285 1.64-1.639c1.567-1.566 1.65-1.644 1.88-1.761.34-.173.568-.228.946-.228.525 0 .954.164 1.36.522.293.257.404.307.714.323.234.012.277.005.442-.069.226-.101.452-.331.533-.54.084-.22.078-.58-.014-.787-.128-.287-.727-.792-1.249-1.053-.64-.319-1.553-.48-2.241-.395" fill-rule="evenodd"></path></svg></a><span slot="content">Link to section</span></market-tooltip></div><h3 class="heading_base__MS64u heading_heading-20__RIpnh">Step 3: Initialize the Card payment method with a custom style</h3></div></div><p>Add the <code class="box_p-l-05x__pvvKi box_p-r-05x__PX6jO box_b-r-4__1LPp7 text_base__bZ6a4 text_paragraph-20__2lYBq text_code-field___GL_9 nodes_inline-code__HksNY">style</code> parameter to the <span slot="trigger"><a data-tracking-id="markdown-link" href="https://developer.squareup.com/reference/sdks/web/payments/objects/Payments" class="nodes_markdown-link__1J6_a">payments.card</a></span> function call.</p><div class="box_m-t-3x__rN_qC code-block_header__urOUF code-block_floating__ocyWk code-block_request__DDmE0 dark-mode-theme"><div></div><div class="box_m-r-1x__uw0iY box_m-t-5x__L06CC"><div class="code-block-action-button-group_button-group__QsOaL"><div></div><div><div class="icon-button_dropdown__e8K_5"><button data-testid="copy-code-block" data-tracking-id="copy-code-block" slot="trigger" aria-label="Copy code" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 icon-button_icon__Iew7h"><svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg" class="icon_icon-color__dAdSt"><path fill-rule="evenodd" clip-rule="evenodd" d="M11 6a1 1 0 1 0 0 2h5v6a1 1 0 1 0 2 0V8a2 2 0 0 0-2-2h-5ZM9 16v-5h4v5H9Zm-2-6a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H8a1 1 0 0 1-1-1v-7Z" fill="#7B61FF"></path></svg></button></div></div><div><div class="icon-button_dropdown__e8K_5"><button data-testid="expand-code-block" data-tracking-id="expand-code-block" slot="trigger" aria-label="Expand code" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 icon-button_icon__Iew7h"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="icon_icon-color__dAdSt"><path fill-rule="evenodd" clip-rule="evenodd" d="M7 3H13V9H11V6.414L6.414 11H9V13H3V7H5V9.586L9.586 5H7V3Z" fill="#7B61FF"></path></svg></button></div></div></div></div></div><div data-testid="code-block" data-language="javascript" class="box_m-b-3x__A9ryy box_b-b-l-std__q5XI3 box_b-l-l-std__REGyC box_b-r-l-std__Q4dy4 box_b-r-6__eFn6m code-block_code-block__7vruq code-block_request__DDmE0 dark-mode-theme markdown-code-block_limit-height__WOJUw"><pre tabindex="-1" class="box_p-l-2x__0A2_9 box_p-r-2x__z29W6 box_p-t-2x__M5RH8 box_p-b-2x__bSkd6 code-block_main__7BHb4"><div data-testid="code-block-contents" data-line-numbers-active="true" style="--line-number-length:1ch" class="text_base__bZ6a4 text_paragraph-20__2lYBq text_code-field___GL_9 code_code__4FNSr highlight_code-highlight___caZ6 code_line-numbers___xHrc"><span data-line-number=""></span><span class="hljs-keyword">async</span> <span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">initializeCard</span>(<span class="hljs-params">payments</span>) </span>{ <span data-line-number=""></span> <span class="hljs-keyword">const</span> card = <span class="hljs-keyword">await</span> payments.card({ <span data-line-number=""></span> <span class="hljs-attr">style</span>: darkModeCardStyle, <span data-line-number=""></span> }); <span data-line-number=""></span> <span class="hljs-keyword">await</span> card.attach(<span class="hljs-string">'#card-container'</span>); <span data-line-number=""></span> <span data-line-number=""></span> <span class="hljs-keyword">return</span> card; <span data-line-number=""></span>}</div></pre><div class="markdown-code-block_bottom-bar___1uwP"><div class="markdown-code-block_bar-position__B59Cr markdown-code-block_footer-action__9cq8l"></div></div></div><div data-markdown-heading="2" class="box_m-t-5x__L06CC box_m-b-2x__nVJGZ"><a href="#dynamic-layout" id="dynamic-layout" aria-label="anchor link for dynamic-layout" class="anchored-heading_anchor__JhuiX"></a><div class="anchored-heading_heading__2wlPu"><div class="anchored-heading_container__rfGXv"><market-tooltip popover-placement="top-start"><a data-tracking-id="heading-anchor" role="link" tabindex="0" slot="trigger" aria-label="click to copy link for dynamic-layout" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 anchored-heading_trigger__XOE12 anchored-heading_button__TMpy8"><svg width="16" height="16" viewBox="0 0 16 16" class="anchored-heading_icon__4HlYl"><path d="M10.432 1.032c-.641.093-.887.239-1.099.649-.056.109-.07.184-.071.391-.001.229.009.276.097.455a.921.921 0 0 0 .486.471c.198.092.446.102.849.035.807-.133 1.657.312 2.034 1.065.161.321.212.538.212.9 0 .361-.05.573-.216.916-.122.254-.131.262-1.778 1.91C9.299 9.471 9.29 9.48 9.036 9.602c-.375.182-.572.223-.988.207-.538-.021-.887-.163-1.303-.533-.259-.23-.453-.312-.741-.313a.971.971 0 0 0-.681.263c-.2.18-.29.382-.304.684-.017.354.065.54.365.829.502.484 1.096.81 1.797.986.424.107 1.137.133 1.589.059.366-.06.832-.209 1.141-.364.549-.276.665-.378 2.46-2.172 1.462-1.462 1.725-1.738 1.886-1.982.483-.732.692-1.417.692-2.269 0-1.11-.398-2.063-1.189-2.844a3.97 3.97 0 0 0-2.019-1.074 4.553 4.553 0 0 0-1.309-.047M6.93 3.694a4.276 4.276 0 0 0-1.955.778c-.103.074-.931.877-1.839 1.786C1.352 8.041 1.242 8.167.959 8.75c-.171.354-.25.583-.336.974-.083.379-.088 1.156-.011 1.518.34 1.59 1.458 2.767 2.996 3.155.256.065.401.081.835.093 1.025.028 1.494-.153 1.731-.666a.786.786 0 0 0 .082-.411.753.753 0 0 0-.098-.426 1.004 1.004 0 0 0-.482-.476c-.157-.077-.462-.089-.897-.036-.628.078-1.179-.115-1.645-.575a1.563 1.563 0 0 1-.354-.495c-.3-.608-.3-1.185-.001-1.799l.14-.285 1.64-1.639c1.567-1.566 1.65-1.644 1.88-1.761.34-.173.568-.228.946-.228.525 0 .954.164 1.36.522.293.257.404.307.714.323.234.012.277.005.442-.069.226-.101.452-.331.533-.54.084-.22.078-.58-.014-.787-.128-.287-.727-.792-1.249-1.053-.64-.319-1.553-.48-2.241-.395" fill-rule="evenodd"></path></svg></a><span slot="content">Link to section</span></market-tooltip></div><h2 class="heading_base__MS64u heading_heading-30__MH4YZ">Dynamic layout</h2></div></div><p>Your application and the buyer's actions determine whether the form is shown as a single line or a two-line form. If your application has styled the <code class="box_p-l-05x__pvvKi box_p-r-05x__PX6jO box_b-r-4__1LPp7 text_base__bZ6a4 text_paragraph-20__2lYBq text_code-field___GL_9 nodes_inline-code__HksNY"><d鈥媔v></code> that the form is attached to as a fixed width of less than 480 pixels, the form is rendered as two lines. If the <code class="box_p-l-05x__pvvKi box_p-r-05x__PX6jO box_b-r-4__1LPp7 text_base__bZ6a4 text_paragraph-20__2lYBq text_code-field___GL_9 nodes_inline-code__HksNY"><d鈥媔v></code> is declared with minimum and maximum widths that let the buyer resize the page, the form reacts to a wider <code class="box_p-l-05x__pvvKi box_p-r-05x__PX6jO box_b-r-4__1LPp7 text_base__bZ6a4 text_paragraph-20__2lYBq text_code-field___GL_9 nodes_inline-code__HksNY"><d鈥媔v></code> container by rendering as a single line.</p><div data-markdown-heading="2" class="box_m-t-5x__L06CC box_m-b-2x__nVJGZ"><a href="#see-also" id="see-also" aria-label="anchor link for see-also" class="anchored-heading_anchor__JhuiX"></a><div class="anchored-heading_heading__2wlPu"><div class="anchored-heading_container__rfGXv"><market-tooltip popover-placement="top-start"><a data-tracking-id="heading-anchor" role="link" tabindex="0" slot="trigger" aria-label="click to copy link for see-also" class="box_b-r-6__eFn6m native-button_button__Iabj1 native-button_no-border__LHOho native-button_button-padding__xncbB focus-ring-styles_focus-ring__5P6v0 anchored-heading_trigger__XOE12 anchored-heading_button__TMpy8"><svg width="16" height="16" viewBox="0 0 16 16" class="anchored-heading_icon__4HlYl"><path d="M10.432 1.032c-.641.093-.887.239-1.099.649-.056.109-.07.184-.071.391-.001.229.009.276.097.455a.921.921 0 0 0 .486.471c.198.092.446.102.849.035.807-.133 1.657.312 2.034 1.065.161.321.212.538.212.9 0 .361-.05.573-.216.916-.122.254-.131.262-1.778 1.91C9.299 9.471 9.29 9.48 9.036 9.602c-.375.182-.572.223-.988.207-.538-.021-.887-.163-1.303-.533-.259-.23-.453-.312-.741-.313a.971.971 0 0 0-.681.263c-.2.18-.29.382-.304.684-.017.354.065.54.365.829.502.484 1.096.81 1.797.986.424.107 1.137.133 1.589.059.366-.06.832-.209 1.141-.364.549-.276.665-.378 2.46-2.172 1.462-1.462 1.725-1.738 1.886-1.982.483-.732.692-1.417.692-2.269 0-1.11-.398-2.063-1.189-2.844a3.97 3.97 0 0 0-2.019-1.074 4.553 4.553 0 0 0-1.309-.047M6.93 3.694a4.276 4.276 0 0 0-1.955.778c-.103.074-.931.877-1.839 1.786C1.352 8.041 1.242 8.167.959 8.75c-.171.354-.25.583-.336.974-.083.379-.088 1.156-.011 1.518.34 1.59 1.458 2.767 2.996 3.155.256.065.401.081.835.093 1.025.028 1.494-.153 1.731-.666a.786.786 0 0 0 .082-.411.753.753 0 0 0-.098-.426 1.004 1.004 0 0 0-.482-.476c-.157-.077-.462-.089-.897-.036-.628.078-1.179-.115-1.645-.575a1.563 1.563 0 0 1-.354-.495c-.3-.608-.3-1.185-.001-1.799l.14-.285 1.64-1.639c1.567-1.566 1.65-1.644 1.88-1.761.34-.173.568-.228.946-.228.525 0 .954.164 1.36.522.293.257.404.307.714.323.234.012.277.005.442-.069.226-.101.452-.331.533-.54.084-.22.078-.58-.014-.787-.128-.287-.727-.792-1.249-1.053-.64-.319-1.553-.48-2.241-.395" fill-rule="evenodd"></path></svg></a><span slot="content">Link to section</span></market-tooltip></div><h2 class="heading_base__MS64u heading_heading-30__MH4YZ">See also</h2></div></div><ul><li><span slot="trigger"><a data-tracking-id="markdown-link" href="/docs/web-payments/quickstart" class="nodes_markdown-link__1J6_a">Web Payments SDK Quickstart</a></span></li><li><span slot="trigger"><a data-tracking-id="markdown-link" href="/docs/web-payments/apple-pay" class="nodes_markdown-link__1J6_a">Take an Apple Pay Payment</a></span></li><li><span slot="trigger"><a data-tracking-id="markdown-link" href="/docs/web-payments/add-ach" class="nodes_markdown-link__1J6_a">Take ACH Bank Transfer Payments</a></span></li><li><span slot="trigger"><a data-tracking-id="markdown-link" href="/docs/web-payments/gift-card" class="nodes_markdown-link__1J6_a">Take a Gift Card Payment</a></span></li><li><span slot="trigger"><a data-tracking-id="markdown-link" href="/docs/web-payments/sca" class="nodes_markdown-link__1J6_a">Verify the Buyer When Using a Payment Token</a></span></li></ul></article></div></div></div><div class="box_m-t-8x__7Ip7V grid-item_grid-item-small__Xb5VI page-layout_sidebar-floating-toc__oeaXi"><div data-testid="ftoc" class="sticky-container_container__FNSI1 floating-toc_docs-floating-toc__UfFM_"><h5 data-testid="docs-heading" class="heading_base__MS64u heading_heading-5__lcRR4">On this page</h5><div data-testid="ftoc-scroll" class="box_m-t-1x__GR9iT box_m-b-1x__b2HHn floating-toc_docs-scrollable-el__7yERK"><a data-tracking-id="floating-toc-item" data-tracking-extra="{"title":"Overview"}" href="/docs/web-payments/customize-styles#overview" class="box_m-b-1x__b2HHn text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 sidebar-link_sidebar-link__hvuMG sidebar-link_sidebar-container__NFtV_ floating-toc_docs-item__J_ik3">Overview</a><a data-tracking-id="floating-toc-item" data-tracking-extra="{"title":"Configure a customized Card payment method"}" href="/docs/web-payments/customize-styles#configure-a-customized-card-payment-method" class="box_m-b-1x__b2HHn text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 sidebar-link_sidebar-link__hvuMG sidebar-link_sidebar-container__NFtV_ floating-toc_docs-item__J_ik3">Configure a customized Card payment method</a><a data-tracking-id="floating-toc-item" data-tracking-extra="{"title":"Dynamic layout"}" href="/docs/web-payments/customize-styles#dynamic-layout" class="box_m-b-1x__b2HHn text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 sidebar-link_sidebar-link__hvuMG sidebar-link_sidebar-container__NFtV_ floating-toc_docs-item__J_ik3">Dynamic layout</a><a data-tracking-id="floating-toc-item" data-tracking-extra="{"title":"See also"}" href="/docs/web-payments/customize-styles#see-also" class="box_m-b-1x__b2HHn text_base__bZ6a4 text_paragraph-20__2lYBq text_color-20__myvq7 sidebar-link_sidebar-link__hvuMG sidebar-link_sidebar-container__NFtV_ floating-toc_docs-item__J_ik3">See also</a></div></div></div><div class="grid-item_grid-item-full__LsU8d"><div data-testid="docs-feedback-prompt" class="box_p-t-8x__SI6nV box_p-b-2x__bSkd6 box_b-t-l-10__Aa_Rv doc-feedback-prompt_container__E7_8O"><div class="box_m-b-2x__nVJGZ"><div class="feedback-widget_large__PmiLi"><div></div></div></div><article data-testid="markdown-doc" class="text_base__bZ6a4 text_paragraph-30___agDz nodes_article__2nMA2"><p>If you need more assistance, contact <span slot="trigger"><a data-tracking-id="markdown-link" href="https://squareup.com/help/contact?panel=BF53A9C8EF68" class="nodes_markdown-link__1J6_a">Developer and App Marketplace Support</a></span> or ask for help in the <span slot="trigger"><a data-tracking-id="markdown-link" href="https://developer.squareup.com/forums" class="nodes_markdown-link__1J6_a">Developer Forums</a></span>.</p></article></div></div></div><div class="grid_dex-grid-container__ZLJnB grid_dex-docs-content-grid-container__diyxN"><div class="box_m-t-10x__IyRMt box_m-b-10x__CM1Qo page-layout_footer__qY_8T"><div><div class="footer-wrapper svelte-ytvx2v"><footer class="dex-site-footer svelte-ytvx2v" data-swiftype-index="false"><div class="dex-site-footer__section svelte-ytvx2v"><div class="dex-site-footer__section__heading__title svelte-ytvx2v" data-test-site-footer-section-title="Development">Development </div> <ul class="dex-site-footer__section__links svelte-ytvx2v"><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="/docs" data-test-site-footer-section-link="Guides" class="svelte-ytvx2v">Guides</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="/reference/square" data-test-site-footer-section-link="API Reference" class="svelte-ytvx2v">API Reference</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="/explorer" data-test-site-footer-section-link="API Explorer" class="svelte-ytvx2v">API Explorer</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="/docs/sdks" data-test-site-footer-section-link="SDKs" class="svelte-ytvx2v">SDKs</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="/docs/sample-apps" data-test-site-footer-section-link="Sample apps" class="svelte-ytvx2v">Sample apps</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://www.issquareup.com/" data-test-site-footer-section-link="System status" class="svelte-ytvx2v">System status</a> </li></ul></div> <div class="dex-site-footer__section svelte-ytvx2v"><div class="dex-site-footer__section__heading__title svelte-ytvx2v" data-test-site-footer-section-title="Support">Support </div> <ul class="dex-site-footer__section__links svelte-ytvx2v"><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://developer.squareup.com/forums/" data-test-site-footer-section-link="Developer forums" class="svelte-ytvx2v">Developer forums</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://squareup.com/help/contact?panel=BF53A9C8EF68" data-test-site-footer-section-link="Contact support" class="svelte-ytvx2v">Contact support</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="/blog" data-test-site-footer-section-link="Developer blog" class="svelte-ytvx2v">Developer blog</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://discord.gg/squaredev" data-test-site-footer-section-link="Discord community" class="svelte-ytvx2v">Discord community</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://www.youtube.com/channel/UC1N2X6PEMGo2xjJY1Pm0vng" data-test-site-footer-section-link="YouTube" class="svelte-ytvx2v">YouTube</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://twitter.com/SquareDev" data-test-site-footer-section-link="X" class="svelte-ytvx2v">X</a> </li></ul></div> <div class="dex-site-footer__section svelte-ytvx2v"><div class="dex-site-footer__section__heading__title svelte-ytvx2v" data-test-site-footer-section-title="More">More </div> <ul class="dex-site-footer__section__links svelte-ytvx2v"><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://squareup.com" data-test-site-footer-section-link="Square Home" class="svelte-ytvx2v">Square Home</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://developer.squareup.com" data-test-site-footer-section-link="Square Developer" class="svelte-ytvx2v">Square Developer</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://squareup.com/app-marketplace" data-test-site-footer-section-link="App Marketplace" class="svelte-ytvx2v">App Marketplace</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://squareup.com/partnerships" data-test-site-footer-section-link="Partner with Square" class="svelte-ytvx2v">Partner with Square</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://squareup.com/partnerships/solutions-partner-program" data-test-site-footer-section-link="Solutions Partner Program" class="svelte-ytvx2v">Solutions Partner Program</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://squareup.com/pricing" data-test-site-footer-section-link="Pricing" class="svelte-ytvx2v">Pricing</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://squareup.com/sales" data-test-site-footer-section-link="Sales" class="svelte-ytvx2v">Sales</a> </li></ul></div> <div class="dex-site-footer__square-container svelte-ytvx2v"><p class="dex-site-footer__square-text svelte-ytvx2v">漏 2024 Square, Inc. </p> <ul class="dex-site-footer__section__links svelte-ytvx2v"><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://squareup.com/legal/general/developers" data-test-site-footer-section-link="Developer terms of service" class="svelte-ytvx2v">Developer terms of service</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://squareup.com/legal/general/global-developer-integration-marketing-agreement" data-test-site-footer-section-link="Developer Integration and Marketing Agreement" class="svelte-ytvx2v">Developer Integration and Marketing Agreement</a> </li><li class="dex-site-footer__section__links__item svelte-ytvx2v"><a href="https://squareup.com/legal/general/privacy" data-test-site-footer-section-link="Privacy policy" class="svelte-ytvx2v">Privacy policy</a> </li> </ul></div></footer> </div></div></div></div></div></div></div></div></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"data":{"getFlags":{"data":{"addons_page_devs_console":false,"api_explorer_in_explorer_ui":false,"api_explorer_input_retention":true,"api_explorer_null_fields":true,"api_explorer_sdk_visibility":true,"api_explorer_share_link":true,"api_explorer_standalone_navigation":true,"api_keys_enabled":false,"api_logger_alpha":true,"api_logs_opt_in_enabled":false,"api_logs_to_explorer_share_link":true,"api_ref_rewrite_proxy_enabled":true,"api_version_migrator_alpha":false,"app_launch_beta":true,"app_launch_comment_history_revamp":true,"app_launch_video_submissions":true,"ccpa_enabled":true,"code_blocks_to_explorer_share_link":true,"dev_portal_app_marketplace_listings":true,"dev_portal_overview_page":false,"developer_data_feedback_param_validation":true,"developer_feedback_phase_one":true,"developer_onboarding":true,"developer_onboarding_questions":true,"developer_onboarding_variant":"V0_0","developer_rbac_permissions":false,"developer_recommendations":true,"devplat/api_explorer_in_explorer_ui":false,"devplat/api_explorer_standalone_navigation":true,"devplat/api_logger_alpha":true,"devplat/dev_portal_app_marketplace_listings":true,"devplat/firestorm_api_explorer":true,"devplat/firestorm_api_explorer_sdk_examples":true,"devplat/firestorm_connect_v1":true,"devplat/firestorm_docs_api_explorer_ga":true,"devplat/firestorm_docs_ga":true,"devplat/firestorm_docs_php_examples":false,"devplat/firestorm_static_lang_examples":true,"devs_console_app_marketplace_reviews_page":true,"devs_console_app_reviews_page":false,"devs_console_app_submissions":false,"devs_console_app_subscription_pages":true,"devs_console_app_subscription_plan_management":true,"devs_console_apps_page":true,"devs_console_incomplete_features":false,"devs_console_locations_page":true,"devs_console_oauth_page":true,"devs_console_settings_pages":false,"devs_console_webhook_subscriptions":false,"dex/addons_page_devs_console":false,"dex/api_explorer_input_retention":true,"dex/api_explorer_null_fields":true,"dex/api_explorer_sdk_visibility":true,"dex/api_explorer_share_link":true,"dex/api_keys_enabled":false,"dex/api_logs_opt_in_enabled":false,"dex/api_logs_to_explorer_share_link":true,"dex/api_ref_rewrite_proxy_enabled":true,"dex/api_version_migrator_alpha":false,"dex/app_launch_beta":true,"dex/app_launch_comment_history_revamp":true,"dex/app_launch_video_submissions":true,"dex/ccpa_enabled":true,"dex/code_blocks_to_explorer_share_link":true,"dex/dev_portal_overview_page":false,"dex/developer_data_feedback_param_validation":true,"dex/developer_feedback_phase_one":true,"dex/developer_onboarding":true,"dex/developer_onboarding_questions":true,"dex/developer_onboarding_variant":"V0_0","dex/developer_rbac_permissions":false,"dex/developer_recommendations":true,"dex/devs_console_app_marketplace_reviews_page":true,"dex/devs_console_app_reviews_page":false,"dex/devs_console_app_submissions":false,"dex/devs_console_app_subscription_pages":true,"dex/devs_console_app_subscription_plan_management":true,"dex/devs_console_apps_page":true,"dex/devs_console_incomplete_features":false,"dex/devs_console_locations_page":true,"dex/devs_console_oauth_page":true,"dex/devs_console_settings_pages":false,"dex/doc_link_preview":false,"dex/docs_link_preview":false,"dex/explorer_to_logger_link":false,"dex/fetch_devs_content_connectv2":true,"dex/fetch_devs_content_files":true,"dex/fetch_devs_content_sparkplug":true,"dex/firestorm_docs_access_token_input_ux_changes":false,"dex/firestorm_docs_changelog":false,"dex/firestorm_docs_links_to_longform":true,"dex/firestorm_docs_multiple_examples":true,"dex/firestorm_docs_new_left_nav":true,"dex/firestorm_docs_sandbox_access_tokens":true,"dex/firestorm_docs_webhooks":true,"dex/global_nav_phase_one":true,"dex/global_search_frontend":true,"dex/graphql_explorer_alpha":true,"dex/graphql_explorer_production":true,"dex/heartbeat_monitor_enabled":true,"dex/ignition_nodejs_examples":true,"dex/ignition_php_examples":true,"dex/lfd_migration_enabled":true,"dex/markdown_link_preview":true,"dex/mobile_payments_sdk_docs_enabled":true,"dex/narrow_property_table":true,"dex/onetrust_enabled":true,"dex/payment_supported_countries":false,"dex/person_based_rbac":false,"dex/remarkability_feb_2022":false,"dex/remarkability_jul_2022":true,"dex/scenario_builder_mvp":false,"dex/smart_code_block_enabled":true,"dex/square_labs_allowed":false,"dex/use_split_users_endpoint":true,"dex/web_app_log_to_cdp":true,"dex/web_app_log_to_es2":true,"dex/web_payments_sdk_ga":true,"doc_link_preview":false,"docs_link_preview":false,"dpw/devs_console_webhook_subscriptions":false,"dpw/flagged_resubmission":false,"dpw/legacy_app_marketplace_partners":false,"explorer_to_logger_link":false,"fetch_devs_content_connectv2":true,"fetch_devs_content_files":true,"fetch_devs_content_sparkplug":true,"firestorm_api_explorer":true,"firestorm_api_explorer_sdk_examples":true,"firestorm_connect_v1":true,"firestorm_docs_access_token_input_ux_changes":false,"firestorm_docs_api_explorer_ga":true,"firestorm_docs_changelog":false,"firestorm_docs_ga":true,"firestorm_docs_links_to_longform":true,"firestorm_docs_multiple_examples":true,"firestorm_docs_new_left_nav":true,"firestorm_docs_php_examples":false,"firestorm_docs_sandbox_access_tokens":true,"firestorm_docs_webhooks":true,"firestorm_static_lang_examples":true,"flagged_resubmission":false,"global_nav_phase_one":true,"global_search_frontend":true,"graphql_explorer_alpha":true,"graphql_explorer_production":true,"heartbeat_monitor_enabled":true,"ignition_nodejs_examples":true,"ignition_php_examples":true,"legacy_app_marketplace_partners":false,"lfd_migration_enabled":true,"markdown_link_preview":true,"mobile_payments_sdk_docs_enabled":true,"narrow_property_table":true,"onetrust_enabled":true,"payment_supported_countries":false,"person_based_rbac":false,"remarkability_feb_2022":false,"remarkability_jul_2022":true,"sandbox_account_limit":"INT64_10","sandcastle/sandbox_account_limit":"INT64_10","scenario_builder_mvp":false,"smart_code_block_enabled":true,"square_labs_allowed":false,"use_split_users_endpoint":true,"web_app_log_to_cdp":true,"web_app_log_to_es2":true,"web_payments_sdk_ga":true},"meta":{"headers":{}}},"doc":{"pageInView":{"page":{"type":"doc-page","id":"1iQW9xby1T19GntnOd4kv9","slug":"web-payments/customize-styles","searchSummary":"Learn how to apply custom styles to the Web Payments SDK card payment form.","heading":{"title":"Customize the Card Entry Form","browserTitle":"Customize the Card Entry Form","releaseStatus":"PUBLIC"},"languagesSupported":["All"],"platforms":["All"],"leftNavId":"1JxXf5dweJNagXLkQOFGsh","content":[{"type":"markdown","name":"web-payments-sdk : customization : body","markdown":"**Applies to:** [Web Payments SDK](web-payments/overview)\n\n{% subheading %}Learn how to apply custom styles to the Web Payments SDK card payment form.{% /subheading %}\n\n{% toc hide=true /%}\n\n## Overview\n\nThe Web Payments SDK lets you customize the style of the card entry and gift card entry forms. The following sections show the available style choices, how to set them, and what the resulting form looks like. You can see several customization ideas by viewing the [Design Showcase](https://square.github.io/web-payments-showcase) sample on GitHub.\n\nThe following steps add code to the application you created from the [quickstart project sample](https://github.com/square/web-payments-quickstart/blob/main/public/examples/card-payment.html). If you haven't created an application using the quickstart, you need to do so before completing these steps. You can find a complete example of the [customized card](https://github.com/square/web-payments-quickstart/blob/main/public/examples/card-styling-simple.html) on GitHub. \n\nYou can view the supported stylesheet classes and properties in the [CardClassSelectors](https://developer.{{SQUARE_DOMAIN}}/reference/sdks/web/payments/objects/CardClassSelectors) object API Reference.\n\nThe five visual elements of the `Card` payment method are represented as selectors that you specify in a card option styling object. You can set colors, fonts, and border options as shown in the following image:\n\n\n\n{% toc hide=true /%}\n\n## Configure a customized Card payment method\n\nThe following steps produce the dark mode card previously shown.\n\n### Step 1: Add a dark mode style to the page\n\n1. Add a reference to the `dark-mode` css class to the body of the page.\n\n ```html copy_code\n \u003cbody class=\"dark-mode\"\u003e\n \u003cform id=\"payment-form\"\u003e\n \u003cdiv id=\"card-container\"\u003e\u003c/div\u003e\n \u003c/form\u003e\n \u003c/body\u003e\n ``` \n\n1. Add a `\u003clink\u003e` tag after the current `\u003clink href=\"app.css\" rel=\"stylesheet\" /\u003e` in the header to add dark-mode.css.\n\n ```html copy_code\n \u003clink href=\"dark-mode.css\" rel=\"stylesheet\" /\u003e\n ```\n\n### Step 2: Define a custom style \n\nDeclare style customizing options in the \n[CardOptions](https://developer.{{SQUARE_DOMAIN}}/reference/sdks/web/payments/objects/CardOptions) object. The `style` field value is of the [CardClassSelectors](https://developer.{{SQUARE_DOMAIN}}/reference/sdks/web/payments/objects/CardClassSelectors) type.\n\n ```javascript copy_code\n const darkModeCardStyle = {\n '.input-container': {\n borderColor: '#2D2D2D',\n borderRadius: '6px',\n },\n '.input-container.is-focus': {\n borderColor: '#006AFF',\n },\n '.input-container.is-error': {\n borderColor: '#ff1600',\n },\n '.message-text': {\n color: '#999999',\n },\n '.message-icon': {\n color: '#999999',\n },\n '.message-text.is-error': {\n color: '#ff1600',\n },\n '.message-icon.is-error': {\n color: '#ff1600',\n },\n input: {\n backgroundColor: '#2D2D2D',\n color: '#FFFFFF',\n fontFamily: 'helvetica neue, sans-serif',\n },\n 'input::placeholder': {\n color: '#999999',\n },\n 'input.is-error': {\n color: '#ff1600',\n },\n '@media screen and (max-width: 600px)': {\n 'input': {\n 'fontSize': '12px',\n }\n } \n };\n ```\n\n### Step 3: Initialize the Card payment method with a custom style\n\nAdd the `style` parameter to the [payments.card](https://developer.{{SQUARE_DOMAIN}}/reference/sdks/web/payments/objects/Payments) function call.\n\n```javascript copy_code\nasync function initializeCard(payments) {\n const card = await payments.card({\n style: darkModeCardStyle,\n });\n await card.attach('#card-container');\n\n return card;\n} \n```\n\n## Dynamic layout\n\nYour application and the buyer's actions determine whether the form is shown as a single line or a two-line form. If your application has styled the `\u003cd鈥媔v\u003e` that the form is attached to as a fixed width of less than 480 pixels, the form is rendered as two lines. If the `\u003cd鈥媔v\u003e` is declared with minimum and maximum widths that let the buyer resize the page, the form reacts to a wider `\u003cd鈥媔v\u003e` container by rendering as a single line.\n\n## See also\n\n* [Web Payments SDK Quickstart](web-payments/quickstart)\n* [Take an Apple Pay Payment](web-payments/apple-pay)\n* [Take ACH Bank Transfer Payments](web-payments/add-ach)\n* [Take a Gift Card Payment](web-payments/gift-card)\n* [Verify the Buyer When Using a Payment Token](web-payments/sca)","programmingLanguage":"All","platform":"All"}]},"requirementsDomain":null},"navSet":{"value":{"items":[{"type":"link","url":"/","title":"Docs Home"},{"type":"divider","style":"divider"},{"id":"iO7IcPwigJctqIkoJ11Zo","type":"subcategory","items":[{"id":"7dlzvOUwboNqjIqujGxzcq","type":"subcategory","items":[{"type":"link","url":"/get-started/create-account-and-application","title":"Create an Account and App"},{"type":"link","url":"/get-started/make-api-request","title":"Make your First API Call"},{"type":"link","url":"/get-started/view-log","title":"View the API Logs"},{"type":"link","url":"/get-started/verify-transaction-in-seller-dashboard","title":"Verify the Payment"},{"type":"link","url":"/get-started/what-next","title":"What's Next"}],"title":"Get Started","url":"/square-get-started"},{"type":"divider","style":"divider"},{"type":"link","url":"/development-essentials","title":"Overview"},{"id":"2bnJ76IVdWdlJkBxvg7SmH","type":"subcategory","items":[{"type":"link","url":"/build-basics/versioning-overview","title":"Versioning"},{"type":"link","url":"/build-basics/access-tokens","title":"Access Tokens"},{"type":"link","url":"/build-basics/frontend-backend-development","title":"Frontend and Backend Development"},{"id":"4TMGdBKMRZhCtNaE99difL","type":"subcategory","items":[{"type":"link","url":"/build-basics/general-considerations/tls-and-https","title":"TLS and HTTPS"},{"type":"link","url":"/build-basics/general-considerations/using-rest-api","title":"Using the REST API"},{"type":"link","url":"/build-basics/general-considerations/handling-errors","title":"Handling Errors"},{"type":"link","url":"/build-basics/general-considerations/collecting-information","title":"Collecting Information"},{"type":"link","url":"/build-basics/general-considerations/language-preferences","title":"Language Preferences"}],"title":"General Development Concepts","url":"/build-basics/general-considerations"},{"id":"3aMdMffYnkZVVVgdISQxCp","type":"subcategory","items":[{"type":"link","url":"/build-basics/common-data-types/working-with-dates","title":"Working with Dates"},{"type":"link","url":"/build-basics/common-data-types/working-with-monetary-amounts","title":" Working with Monetary Amounts"},{"type":"link","url":"/build-basics/common-data-types/working-with-addresses","title":"Working with Addresses"}],"title":"Common Data Types","url":"/build-basics/common-data-types"},{"id":"3RImgYl86M2FgJQKHeKyoX","type":"subcategory","items":[{"type":"link","url":"/devtools/customattributes/overview","title":"Custom Attributes"},{"type":"link","url":"/build-basics/common-api-patterns/idempotency","title":"Idempotency"},{"type":"link","url":"/build-basics/common-api-patterns/pagination","title":"Pagination"},{"type":"link","url":"/build-basics/common-api-patterns/optimistic-concurrency","title":"Optimistic Concurrency"},{"type":"link","url":"/build-basics/clearing-fields","title":"Clear Object Fields"}],"title":"Common Square API Patterns","url":"/build-basics/common-api-patterns"},{"type":"link","url":"/ecommerce-api","title":"Square eCommerce APIs"},{"type":"link","url":"/build-basics/api-lifecycle","title":"Square API Lifecycle"}],"title":"Build Basics","url":"/buildbasics"},{"id":"3xPiA4blL9jPuuayGJ6MTW","type":"subcategory","items":[{"type":"link","url":"/devtools/developer-dashboard","title":"Developer Console"},{"type":"link","url":"/devtools/developer-permissions","title":"Build a Team of Developers"},{"type":"link","url":"/devtools/seller-dashboard","title":"Square Dashboard"},{"id":"3KRB4IB9BlZtJ6B2m6vUfS","type":"subcategory","items":[{"type":"link","url":"/devtools/sandbox/testing","title":"Test in Sandbox"},{"type":"link","url":"/devtools/sandbox/payments","title":"Sandbox Payments"}],"title":"Sandbox","url":"/devtools/sandbox/overview"},{"type":"link","url":"/devtools/api-explorer","title":"API Explorer"},{"type":"link","url":"/devtools/api-logs","title":"API Logs"},{"type":"link","url":"/devtools/webhook-logs","title":"Webhook Event Logs"},{"id":"gjri5F4fH2T3zkF44a67X","type":"subcategory","items":[{"type":"link","url":"/webhooks/step1createurl","title":"Create a Notification URL"},{"type":"link","url":"/webhooks/step2subscribe","title":"Subscribe to Event Notifications"},{"type":"link","url":"/webhooks/step3validate","title":"Verify and Validate an Event Notification"},{"type":"link","url":"/webhooks/step4manage","title":"Manage Operations"},{"type":"link","url":"/webhooks/movetoprod","title":"Move Event Notifications to Production"},{"type":"link","url":"/webhooks/v2webhook-events-tech-ref","title":"Webhook Events Reference"},{"type":"link","url":"/webhooks/troubleshooting","title":"Troubleshooting"}],"title":"Webhooks","url":"/webhooks/overview"},{"type":"link","url":"/auth","title":"Authentication"},{"type":"link","url":"/devtools/postman","title":"Postman"}],"title":"Developer Tools","url":"/devtools/overview"},{"id":"3Dla3ISAkrXINrZrVMau3d","type":"subcategory","items":[{"id":"2Ca4WvgGRCnQW4KBXsLDjR","type":"subcategory","items":[{"type":"link","url":"/sdks/java/quick-start","title":"Quickstart"},{"type":"link","url":"/sdks/java/setup-project","title":"Project Setup"},{"type":"link","url":"/sdks/java/using-java-sdk","title":"Using the SDK"},{"type":"link","url":"/sdks/java/common-square-api-patterns","title":"Common API Patterns"},{"type":"link","url":"/sdks/java/stay-current-with-sdk-version","title":"Stay Current with SDK Version"}],"title":"Java","url":"/sdks/java"},{"id":"6ioIsulmzIRS1Fp5LbpySx","type":"subcategory","items":[{"type":"link","url":"/sdks/dotnet/quick-start","title":"Quickstart"},{"type":"link","url":"/sdks/dotnet/setup-project","title":"Project Setup"},{"type":"link","url":"/sdks/dotnet/using-dot-net-sdk","title":"Using the SDK"},{"type":"link","url":"/sdks/dotnet/common-square-api-patterns","title":"Common API Patterns"},{"type":"link","url":"/sdks/dotnet/stay-current-with-sdk-version","title":"Stay Current with SDK Version"}],"title":".NET","url":"/sdks/dotnet"},{"id":"TtR5ma1jNu33j5Up3QRZ7","type":"subcategory","items":[{"type":"link","url":"/sdks/nodejs/quick-start","title":"Quickstart"},{"type":"link","url":"/sdks/nodejs/setup-project","title":"Project Setup"},{"type":"link","url":"/sdks/nodejs/using-nodejs-sdk","title":"Using the SDK"},{"type":"link","url":"/sdks/nodejs/common-square-api-patterns","title":"Common API Patterns"},{"type":"link","url":"/sdks/nodejs/stay-current-with-sdk-version","title":"Stay Current with SDK Version"}],"title":"Node.js","url":"/sdks/nodejs"},{"id":"3hWuvXuREAS464rBzFn5S6","type":"subcategory","items":[{"type":"link","url":"/sdks/php/quick-start","title":"Quickstart"},{"type":"link","url":"/sdks/php/setup-project","title":"Project Setup"},{"type":"link","url":"/sdks/php/using-php-sdk","title":"Using the SDK"},{"type":"link","url":"/sdks/php/common-square-api-patterns","title":"Common API Patterns"},{"type":"link","url":"/sdks/php/stay-current-with-sdk-version","title":"Stay Current with SDK Version"}],"title":"PHP","url":"/sdks/php"},{"id":"6wVrPqjTomk2Pg7Y2aPTPX","type":"subcategory","items":[{"type":"link","url":"/sdks/python/quick-start","title":"Quickstart"},{"type":"link","url":"/sdks/python/setup-project","title":"Project Setup"},{"type":"link","url":"/sdks/python/using-python-sdk","title":"Using the SDK"},{"type":"link","url":"/sdks/python/common-square-api-patterns","title":"Common API Patterns"},{"type":"link","url":"/sdks/python/stay-current-with-sdk-version","title":"Stay Current with SDK Version"}],"title":"Python","url":"/sdks/python"},{"id":"1tWDddcaCZLVqVBGIxvs4A","type":"subcategory","items":[{"type":"link","url":"/sdks/ruby/quick-start","title":"Quickstart"},{"type":"link","url":"/sdks/ruby/setup-project","title":"Project Setup"},{"type":"link","url":"/sdks/ruby/using-ruby-sdk","title":"Using the SDK"},{"type":"link","url":"/sdks/ruby/common-square-api-patterns","title":"Common API Patterns"},{"type":"link","url":"/sdks/ruby/stay-current-with-sdk-version","title":"Stay Current with SDK Version"}],"title":"Ruby","url":"/sdks/ruby"}],"title":"Square SDKs","url":"/sdks"},{"type":"link","url":"/sample-apps","title":"Sample Applications"},{"type":"divider","style":"divider"},{"id":"31uVZVus1mPqbgRgRBWk2b","type":"subcategory","items":[{"type":"link","url":"/graphql/basics","title":"GraphQL Basics"},{"type":"link","url":"/graphql/build-your-first-query","title":"Build your First Query"},{"type":"link","url":"/devtools/graphqlexplorer","title":"GraphQL Explorer"},{"type":"link","url":"/graphql/query-examples","title":"Query Examples"}],"title":"GraphQL","url":"/devtools/graphql"},{"type":"divider","style":"divider"},{"id":"1xR5tTBo3FKTtqQB9F8d6J","type":"subcategory","items":[{"type":"link","url":"/oauth-api/create-urls-for-square-authorization","title":"Create Redirect URL and Authorization Page URL"},{"type":"link","url":"/oauth-api/receive-and-manage-tokens","title":"Receive Authorization and Manage OAuth Tokens"},{"type":"link","url":"/oauth-api/refresh-revoke-limit-scope","title":"Refresh and Revoke OAuth Tokens"},{"type":"link","url":"/oauth-api/token-introspection","title":"Token Introspection"},{"type":"link","url":"/oauth-api/best-practices","title":"OAuth Best Practices"},{"type":"link","url":"/oauth-api/walkthrough","title":"OAuth Walkthrough"},{"type":"link","url":"/oauth-api/migrate-to-square-oauth-flow","title":"Migrate to the Square API OAuth Flow"},{"type":"link","url":"/oauth-api/movetoprod","title":"Move OAuth to Production"},{"type":"link","url":"/oauth-api/square-permissions","title":"Permissions Reference"}],"title":"OAuth","url":"/oauth-api/overview"},{"type":"link","url":"/webhooks/webhook-subscriptions-api","title":"Webhook Subscriptions"},{"type":"link","url":"/events-api/overview","title":"Events"},{"type":"divider","style":"divider"},{"id":"2b6GKzXmebfh3NFImkw69V","type":"subcategory","items":[{"type":"link","url":"/migrate-from-v1/current-status","title":"Deprecated Items"},{"id":"2S2I7wKsntsXiMbpEYl1vv","type":"subcategory","items":[{"type":"link","url":"/migrate-from-v1/guides/v1-payments","title":"v1 Payments API"},{"type":"link","url":"/migrate-from-v1/guides/v1-refunds","title":"v1 Refunds API"},{"type":"link","url":"/payments-api/migrate-from-transactions-api","title":"Square Transactions API"},{"type":"link","url":"/labor-api/migrate-to-teams","title":"Migrate Employees to Team Members"},{"type":"link","url":"/migrate-from-v1/guides/v1-checkout","title":"Migrate from CreateCheckout to CreatePaymentLink"}],"title":"API Migration Guides"}],"title":"Migrate from Deprecated APIs","url":"/migrate-from-v1"},{"id":"2FbyzmNmotvJlFa0lkrvGa","type":"subcategory","items":[{"type":"link","url":"/international-development/oauth-testing","title":"OAuth and Testing"},{"type":"link","url":"/international-development/payments","title":"International Payments"},{"type":"link","url":"/international-development/regional-differences","title":"Regional Differences for International Development"},{"type":"link","url":"/international-development/japan-invoice-system","title":"Compliance with Japan's Tax Invoice System"}],"title":"International Development","url":"/international-development"}],"title":"Dev Essentials","url":"/development-essentials"},{"type":"divider","style":"divider"},{"id":"1JxXf5dweJNagXLkQOFGsh","type":"subcategory","items":[{"type":"link","url":"/payments-overview","title":"Overview"},{"id":"7zfhvbp4AghuyT3BkoJd1v","type":"subcategory","items":[{"type":"link","url":"/payments/scenarios/tip-reporting","title":"Build a Tip Report"},{"type":"link","url":"/payments/scenarios/split-online-payment","title":"Split an Online Payment"},{"type":"link","url":"/payments/scenarios/simple-sales-report","title":"Build a Sales Report"}],"title":"Technical Scenarios","url":"/payments/scenarios"},{"id":"uUZ9NoDit8f9tVTf5zSRm","type":"subcategory","items":[{"id":"1gxFZ2zjIW9IxVIOVrlHsi","type":"subcategory","items":[{"id":"cX9mbMbYzJRiexfbw1HuZ","type":"subcategory","items":[{"type":"link","url":"/payments-api/take-payments/card-payments/delayed-capture","title":"Delayed Capture"},{"type":"link","url":"/payments-api/take-payments/card-payments/partial-payments-with-gift-cards","title":"Partial Payments"},{"type":"link","url":"/payments-api/take-payments/card-payments/statement-descriptions","title":"Statement Descriptions"}],"title":"Card Payments","url":"/payments-api/take-payments/card-payments"},{"type":"link","url":"/payments-api/take-payments/ach-payments","title":"ACH Bank Transfer Payment"},{"type":"link","url":"/payments-api/take-payments/afterpay-payments","title":"Afterpay and Clearpay Payments"},{"type":"link","url":"/payments-api/take-payments/cash-app-payments","title":"Cash App Payments"},{"type":"link","url":"/payments-api/take-payments/cash-payments","title":"Cash Payments"},{"type":"link","url":"/payments-api/take-payments/external-payments","title":"External Payments"},{"type":"link","url":"/payments-api/take-payments/house-accounts","title":"House Accounts"}],"title":"Take Payments","url":"/payments-api/take-payments"},{"type":"link","url":"/payments-api/take-payments-and-collect-fees","title":"Collect Application Fees"},{"type":"link","url":"/payments-api/update-payments","title":"Update Payment and Tip Amounts"},{"type":"link","url":"/payments-api/retrieve-payments","title":"Retrieve Payments"},{"type":"link","url":"/payments-api/error-codes","title":"Troubleshoot"},{"type":"link","url":"/payments-api/webhooks","title":"Webhooks"}],"title":"Payments","url":"/payments-refunds"},{"id":"2zvmrqXp2ajTw6sZprzRpu","type":"subcategory","items":[{"type":"link","url":"/payments-api/refund-payments","title":"Refund Payments"},{"type":"link","url":"/payments-api/collect-fees/payment-with-app-fee-refund","title":"Refund a Payment with an App Fee"},{"type":"link","url":"/refunds-api/retrieve-refunds","title":"Retrieve Refunds"},{"type":"link","url":"/refunds-api/unlinked-refunds","title":"Process an Unlinked Refund"},{"type":"link","url":"/refunds-api/webhooks","title":"Webhooks"}],"title":"Refunds","url":"/refunds-api/overview"},{"id":"zsWHyi2OOINzGoMk3KheJ","type":"subcategory","items":[{"type":"link","url":"/disputes-api/process-disputes","title":"Process Disputes"},{"type":"link","url":"/disputes-api/sandbox-testing","title":"Test in the Sandbox"}],"title":"Disputes","url":"/disputes-api/overview"},{"type":"divider","style":"divider"},{"id":"3QI4Ij83kOJO4XY5vg44ec","type":"subcategory","items":[{"id":"4qST1Mhcut4CEO49Ymx2wJ","type":"subcategory","items":[{"type":"link","url":"/terminal-api/quickstart","title":"Quickstart"},{"type":"link","url":"/terminal-api/square-terminal-payments","title":"Take Payments"},{"type":"link","url":"/terminal-api/pos-integration","title":"POS App Pairing with Square Terminal"},{"type":"link","url":"/terminal-api/dismiss-checkouts-and-refunds","title":"Dismiss Terminal Checkouts and Refunds"},{"type":"link","url":"/terminal-api/terminal-device-monitoring","title":"Monitor Square Terminals"},{"type":"link","url":"/terminal-api/advanced-features","title":"Manage Terminal Actions"},{"type":"link","url":"/terminal-api/advanced-features/save-card-on-file","title":"Save Card on File"},{"type":"link","url":"/terminal-api/advanced-features/check-device-information","title":"Check Device Information"},{"type":"link","url":"/terminal-api/advanced-features/issue-receipts","title":"Print or Issue Receipts"},{"type":"link","url":"/terminal-api/advanced-features/customize-idle-screen","title":"Customize the Idle Screen"},{"id":"5csDnJcAAfXw1PIO507K5i","type":"subcategory","items":[{"type":"link","url":"/terminal-api/advanced-features/custom-workflows/confirmation","title":"Confirmation Screen"},{"type":"link","url":"/terminal-api/advanced-features/custom-workflows/signature","title":"Signature Capture Screen"},{"type":"link","url":"/terminal-api/advanced-features/custom-workflows/data-collection","title":"Data Collection Screen"},{"type":"link","url":"/terminal-api/advanced-features/custom-workflows/menu-select","title":"Menu Selection List Screen"},{"type":"link","url":"/terminal-api/advanced-features/custom-workflows/qr-code-display","title":"QR Code Screen"},{"type":"link","url":"/terminal-api/advanced-features/custom-workflows/link-and-dismiss-actions","title":"Link and Dismiss Actions"}],"title":"Custom Screen Workflows","url":"/terminal-api/advanced-features/custom-workflows"},{"id":"1diR890qlxltZJ0tUr6fPB","type":"subcategory","items":[{"type":"link","url":"/terminal-api/square-terminal-refunds","title":"Refund Interac Payments"},{"type":"link","url":"/terminal-api/e-money-payments","title":"Take E-Money Payments"},{"type":"link","url":"/terminal-api/international-payment-methods/paypay-qr-code-payments","title":"Take PayPay QR Code Payments"}],"title":"International Payment Methods","url":"/terminal-api/international-payment-methods"}],"title":"Terminal API","url":"/terminal-api/overview"},{"id":"4sRkVAYqVuVcsx5Xht8EIO","type":"subcategory","items":[{"id":"V2EiCWkS7R7XRjihKoGRJ","type":"subcategory","items":[{"type":"link","url":"/mobile-payments-sdk/android/configure-authorize","title":"Authorize the Mobile Payments SDK"},{"type":"link","url":"/mobile-payments-sdk/android/pair-manage-readers","title":"Pair and Manage Card Readers"},{"type":"link","url":"/mobile-payments-sdk/android/take-payments","title":"Take a Payment"},{"type":"link","url":"/mobile-payments-sdk/android/offline-payments","title":"Offline Payments"},{"type":"link","url":"/mobile-payments-sdk/android/handling-errors","title":"Handling Errors"}],"title":"Build on Android","url":"/mobile-payments-sdk/android"},{"id":"184IwlKxX3dToiJCIgybi7","type":"subcategory","items":[{"type":"link","url":"/mobile-payments-sdk/ios/configure-authorize","title":"Authorize the Mobile Payments SDK"},{"type":"link","url":"/mobile-payments-sdk/ios/pair-manage-readers","title":"Pair and Manage Card Readers"},{"type":"link","url":"/mobile-payments-sdk/ios/take-payments","title":"Take a Payment"},{"type":"link","url":"/mobile-payments-sdk/ios/offline-payments","title":"Offline Payments"},{"type":"link","url":"/mobile-payments-sdk/ios/square-stand","title":"Configure for Square Stand"},{"type":"link","url":"/mobile-payments-sdk/ios/handling-errors","title":"Handling Errors"}],"title":"Build on iOS","url":"/mobile-payments-sdk/ios"},{"type":"link","url":"/mobile-payments-sdk/migrate","title":"Migrate from Reader SDK"}],"title":"Mobile Payments SDK","url":"/mobile-payments-sdk"},{"id":"41VWCwHuOVzHNHKVQOT41","type":"subcategory","items":[{"id":"4xNhvuBpEO78hn0xLFBiJp","type":"subcategory","items":[{"type":"link","url":"/reader-sdk/quick-start/step-1","title":"Get Credentials"},{"type":"link","url":"/reader-sdk/quick-start/step-2","title":"Configure the Sample Application"},{"type":"link","url":"/reader-sdk/quick-start/step-3","title":"Take a Cash Payment"},{"type":"link","url":"/reader-sdk/quick-start/step-4","title":"Customize the Checkout Amount"},{"type":"link","url":"/reader-sdk/quick-start/step-5","title":"Take a Credit Card Payment"}],"title":"Quickstart","url":"/reader-sdk/quick-start/start"},{"type":"link","url":"/reader-sdk/how-it-works","title":"How It Works"},{"type":"link","url":"/reader-sdk/build-on-android","title":"Build on Android"},{"type":"link","url":"/reader-sdk/build-on-ios","title":"Build on iOS"},{"type":"link","url":"/reader-sdk/cookbook/contactless-reader","title":"Connect a Contactless Reader"},{"type":"link","url":"/reader-sdk/cookbook/charge-cards-on-file","title":"Charge a Card on File"},{"type":"link","url":"/reader-sdk/cookbook/save-cards-on-file","title":"Save a Card on File"},{"type":"link","url":"/reader-sdk/cookbook/square-stand","title":"Configure on iOS for Square Stand"},{"type":"link","url":"/reader-sdk/cookbook/deauthorize-reader-sdk","title":"Deauthorize Reader SDK"},{"type":"link","url":"/reader-sdk/cookbook/capture-a-transaction","title":"Capture a Transaction"},{"type":"link","url":"/reader-sdk/cookbook/delay-capture-of-payment","title":"Delay the Capture of Payments"},{"type":"link","url":"/reader-sdk/cookbook/configure-apk-splits","title":"Configure APK Splits"},{"type":"link","url":"/reader-sdk/upgrade-reader-sdk","title":"Update to New Reader SDK Version"},{"type":"link","url":"/reader-sdk/flutter","title":"Flutter Plugin"},{"type":"link","url":"/reader-sdk/react-native","title":"React Native Plugin"}],"title":"Reader SDK","url":"/reader-sdk/what-it-does"},{"id":"3afip77TiGS5ECyUYIRM96","type":"subcategory","items":[{"type":"link","url":"/pos-api/how-it-works","title":"How It Works"},{"type":"link","url":"/pos-api/build-on-android","title":"Build on Android"},{"type":"link","url":"/pos-api/build-on-ios","title":"Build on iOS"},{"type":"link","url":"/pos-api/build-mobile-web","title":"Build on Mobile Web"},{"type":"link","url":"/pos-api/cookbook/find-your-android-fingerprint","title":"Find Your Android Fingerprint"},{"type":"link","url":"/pos-api/cookbook/offline-mode","title":"Use the API in Offline Mode"},{"type":"link","url":"/pos-api/cookbook/alert-dialog-helper","title":"Add an Alert Dialog Helper Class"},{"type":"link","url":"/pos-api/cookbook/electronic-payments","title":"Accept E-Money Payments"},{"type":"link","url":"/pos-api/qr-code-payments-paypay","title":"Accept PayPay Payments"},{"type":"link","url":"/pos-api/web-technical-reference","title":"Mobile Web Technical Reference"},{"type":"link","url":"/pos-api/payments-integration","title":"Payments API Integration"}],"title":"Point of Sale API","url":"/pos-api/what-it-does"}],"title":"Take Payments on Hardware","url":"/in-person-payment-options"},{"id":"6sXAr41iJBMDHea2l3Z8gv","type":"subcategory","items":[{"id":"7jyjtk6YX9Vvjr6IB3nf2J","type":"subcategory","items":[{"id":"50fRf1DljbdST7WDPNFEwv","type":"subcategory","items":[{"type":"link","url":"/web-payments/quickstart/clone-quickstart-project","title":"Clone the Quickstart Project Template"},{"type":"link","url":"/web-payments/quickstart/add-sdk-to-web-client","title":"Add the SDK to the Web Client"},{"type":"link","url":"/web-payments/quickstart/verify-the-payment","title":"Verify the Payment"},{"type":"link","url":"/web-payments/quickstart/add-sca","title":"Add Strong Customer Authentication"},{"type":"link","url":"/web-payments/quickstart/deploy-app","title":"Deploy the Application"}],"title":"Quickstart","url":"/web-payments/quickstart"},{"type":"link","url":"/web-payments/take-card-payment","title":"Take a Card Payment"},{"id":"76vVgo6CnCmx5Xt8tJJnS8","type":"subcategory","items":[{"type":"link","url":"/web-payments/apple-pay","title":"Apple Pay"},{"type":"link","url":"/web-payments/google-pay","title":"Google Pay"},{"type":"link","url":"/web-payments/payment-requests","title":"Digital Wallet Payment Requests"}],"title":"Integrate Digital Wallets","url":"/web-payments/digital-wallets"},{"type":"link","url":"/web-payments/add-ach","title":"ACH Bank Transfer"},{"type":"link","url":"/web-payments/add-afterpay","title":"Afterpay"},{"type":"link","url":"/web-payments/add-cash-app-pay","title":"Cash App Pay"},{"id":"UmgjQ7AynheCEMWohcGmp","type":"subcategory","items":[{"type":"link","url":"/web-payments/gift-card","title":"Take a Gift Card Payment"},{"type":"link","url":"/web-payments/gift-card-walkthrough","title":"Take Partial Payments"}],"title":"Square Gift Card Payments","url":"/web-payments/gift-cards-intro"},{"type":"link","url":"/web-payments/customize-styles","title":"Customize the Card Entry Form"},{"type":"link","url":"/web-payments/sca","title":"Add SCA to a Card Payment"},{"type":"link","url":"/web-payments/sca-add-card","title":"Store Card on File with SCA"},{"type":"link","url":"/web-payments/sca-charge-card-on-file","title":"Charge Card on File with SCA"},{"type":"link","url":"/web-payments/sca-charge-and-store-card-on-file","title":"Charge and Store Card on File with SCA"}],"title":"Web Payments SDK","url":"/web-payments/overview"},{"id":"3kx6yG9fmBAdJZbbO6F1yD","type":"subcategory","items":[{"id":"61aUeKzNEGAElKXXrUTg3x","type":"subcategory","items":[{"type":"link","url":"/in-app-payments-sdk/quick-start/generate-token","title":"Set up the Client"},{"type":"link","url":"/in-app-payments-sdk/quick-start/deploy-server-backend","title":"Deploy the Server"}],"title":"Quickstart","url":"/in-app-payments-sdk/quick-start"},{"type":"link","url":"/in-app-payments-sdk/installation","title":"Install the SDK"},{"type":"link","url":"/in-app-payments-sdk/build-on-android","title":"Build on Android"},{"type":"link","url":"/in-app-payments-sdk/build-on-ios","title":"Build on iOS"},{"id":"1YvixWOltemNhXC61aCNfc","type":"subcategory","items":[{"type":"link","url":"/in-app-payments-sdk/add-digital-wallets/google-pay","title":"Google Pay"},{"type":"link","url":"/in-app-payments-sdk/add-digital-wallets/apple-pay","title":"Apple Pay"},{"type":"link","url":"/in-app-payments-sdk/add-digital-wallets/src/android","title":"Enable SRC for Android"},{"type":"link","url":"/in-app-payments-sdk/add-digital-wallets/src/ios","title":"Enable SRC for iOS"}],"title":"Integrate Digital Wallets","url":"/in-app-payments-sdk/add-digital-wallets"},{"type":"link","url":"/in-app-payments/localize-ios","title":"Localize an Application "},{"type":"link","url":"/in-app-payments-sdk/cookbook/giftcards","title":"Gift Card Payments"},{"type":"link","url":"/in-app-payments-sdk/flutter","title":"Flutter Plugin"},{"type":"link","url":"/in-app-payments-sdk/react-native","title":"React Native Plugin"},{"type":"link","url":"/in-app-payments-sdk/cookbook/customize-payment-form","title":"Customize the Payment Entry Form"},{"type":"link","url":"/in-app-payments-sdk/cookbook/connect-to-a-backend-service","title":"Connect to a Backend Service"},{"type":"link","url":"/in-app-payments-sdk/cookbook/disable-postal-code","title":"Remove the Postal Code Requirement"},{"type":"link","url":"/in-app-payments-sdk/troubleshooting","title":"Troubleshoot"},{"type":"link","url":"/in-app-payments-sdk/how-it-works","title":"How It Works"},{"id":"6CxT0SjYvqtIoHogrU592e","type":"subcategory","items":[{"type":"link","url":"/in-app-payments-sdk/verify-buyer","title":"Verify a Buyer"}],"title":"Strong Customer Authentication","url":"/sca-overview-iap"}],"title":"In-App Payments SDK","url":"/in-app-payments-sdk/what-it-does"},{"id":"V4hkw0bOYUpdBadmYBHr0","type":"subcategory","items":[{"type":"link","url":"/checkout-api/quick-pay-checkout","title":"Quick Pay Checkout"},{"type":"link","url":"/checkout-api/square-order-checkout","title":"Square Order Checkout"},{"type":"link","url":"/checkout-api/subscription-plan-checkout","title":"Subscription Plan Checkout"},{"type":"link","url":"/checkout-api/checkout-settings","title":"Checkout Settings"},{"type":"link","url":"/checkout-api/optional-checkout-configurations","title":"Checkout Configurations"},{"type":"link","url":"/checkout-api/manage-checkout","title":"Manage Checkout"},{"type":"link","url":"/checkout-api/guidelines-and-limitations","title":"Guidelines and Limitations"}],"title":"Checkout API","url":"/checkout-api"},{"id":"48IHue04VlAsOncIA5GupV","type":"subcategory","items":[{"type":"link","url":"/subscriptions-api/plans-and-variations","title":"Subscription Plans and Variations"},{"type":"link","url":"/subscriptions-api/manage-subscriptions","title":"Manage Subscriptions"},{"type":"link","url":"/subscriptions-api/actions-events","title":"Subscription Actions and Events"},{"type":"link","url":"/subscriptions-api/pause-resume-cancel-subscriptions","title":"Pause, Resume, or Cancel Subscriptions"},{"type":"link","url":"/subscriptions-api/subscription-billing","title":"Subscription Billing and Invoices"},{"type":"link","url":"/subscriptions-api/swap-plan-variations","title":"Swap Subscription Plan Variations"}],"title":"Subscriptions API","url":"/subscriptions/overview"},{"id":"56mq1PzSktrD9m24himiW5","type":"subcategory","items":[{"type":"link","url":"/invoices-api/create-publish-invoices","title":"Create and Publish Invoices"},{"type":"link","url":"/invoices-api/retrieve-list-search-invoices","title":"Retrieve, List, or Search Invoices"},{"type":"link","url":"/invoices-api/attachments","title":"Create or Delete Invoice Attachments"},{"type":"link","url":"/invoices-api/update-invoices","title":"Update Invoices"},{"type":"link","url":"/invoices-api/cancel-delete-invoices","title":"Cancel or Delete Invoices"},{"type":"link","url":"/invoices-api/pay-refund-invoices","title":"Pay or Refund Invoices"},{"type":"link","url":"/invoices-api/walkthrough","title":"Walkthrough: Create and Publish Invoices"}],"title":"Invoices API","url":"/invoices-api/overview"}],"title":"Take Payments Online","url":"/online-payment-options"},{"type":"divider","style":"divider"},{"id":"3crTgQawiMx30ZW42kX5w8","type":"subcategory","items":[{"type":"link","url":"/cards-api/manage-cards","title":"Manage Cards"},{"type":"link","url":"/cards-api/walkthrough/card-from-payment-id","title":"Create a Card on File from Payment ID"},{"type":"link","url":"/cards-api/walkthrough-seller-card","title":"Create a Card on File and Make a Payment"},{"type":"link","url":"/cards-api/walkthrough-shared-card","title":"Create a Shared Card on File and Make a Payment"}],"title":"Cards","url":"/cards-api/overview"},{"id":"3oWs4JO3JfhkfDcUEhNGeJ","type":"subcategory","items":[{"type":"link","url":"/payouts-api/list-payouts","title":"List Payouts"},{"type":"link","url":"/payouts-api/get-payout","title":"Get Payout"},{"type":"link","url":"/payouts-api/list-payout-entries","title":"List Payout Entries"}],"title":"Payouts","url":"/payouts-api/overview"},{"type":"link","url":"/bank-accounts-api","title":"Bank Accounts"},{"id":"7re5dyp7kQZpvvwAJUee93","type":"subcategory","items":[{"type":"link","url":"/mobile-authz/how-it-works","title":"How It Works"},{"type":"link","url":"/mobile-authz/build-with-mobile-authz","title":"Build with Mobile Authorization"},{"type":"link","url":"/mobile-authz/cookbook/mobile-code-with-curl","title":"Get Authorization Code on Command Line"}],"title":"Mobile Authorization","url":"/mobile-authz/what-it-does"},{"type":"divider","style":"divider"},{"type":"link","url":"/payment-card-support-by-country","title":"Payment Methods by Country"},{"type":"link","url":"/payments-pricing","title":"Payments Pricing"},{"type":"link","url":"/sca-overview","title":"Strong Customer Authentication"},{"type":"link","url":"/payment-minimums","title":"Payment Minimums"}],"title":"Payments","url":"/payments-overview"},{"id":"3NKV9K0UfSbHh8odPIJR1c","type":"subcategory","items":[{"type":"link","url":"/commerce","title":"Overview"},{"id":"4F79mKtS4eqZigce67OxFF","type":"subcategory","items":[{"type":"link","url":"/commerce/scenarios/tip-reporting","title":"Build a Tip Report"},{"type":"link","url":"/commerce/scenarios/split-online-payment","title":"Split an Online Payment"},{"type":"link","url":"/commerce/scenarios/simple-sales-report","title":"Build a Sales Report"}],"title":"Technical Scenarios","url":"/commerce-scenarios"},{"id":"1fQKpXBuZJnPgVRaDRKLg0","type":"subcategory","items":[{"type":"link","url":"/orders-api/create-orders","title":"Create Orders"},{"type":"link","url":"/orders-api/manage-orders/update-orders","title":"Update Orders"},{"type":"link","url":"/orders-api/manage-orders/search-orders","title":"Search Orders"},{"type":"link","url":"/orders-api/manage-orders/retrieve-orders","title":"Retrieve Orders"},{"id":"3actPvHZPDJZx122xWJpED","type":"subcategory","items":[{"type":"link","url":"/orders-api/apply-taxes-and-discounts/auto-apply-discounts","title":"Apply Square-Defined Discounts"},{"type":"link","url":"/orders-api/apply-taxes-and-discounts/auto-apply-taxes","title":"Apply Catalog Taxes to Orders"}],"title":"Apply Catalog Taxes and Discounts","url":"/orders-api/apply-taxes-and-discounts"},{"id":"ebWImqVQwkBx3xfF0lbvb","type":"subcategory","items":[{"type":"link","url":"/orders-api/discounts","title":"Order Discounts"},{"type":"link","url":"/orders-api/taxes","title":"Order Taxes"},{"type":"link","url":"/orders-api/service-charges","title":"Order Service Charges"}],"title":"Order Price Adjustments","url":"/orders-api/price-adjustments"},{"type":"link","url":"/orders-api/pay-for-orders","title":"Pay for Orders"},{"type":"divider","style":"divider"},{"type":"link","url":"/orders-api/order-returns-exchanges","title":"Refunds and Exchanges"},{"type":"link","url":"/orders-api/fulfillments","title":"Manage Fulfillments"},{"type":"link","url":"/orders-api/how-it-works","title":"How It Works"},{"type":"link","url":"/orders-api/order-ahead-usecase","title":"Order-Ahead Use Case"},{"id":"7zVLALaKpsa7uX7WLYhQ8e","type":"subcategory","items":[{"type":"link","url":"/orders-api/quick-start/step-1","title":"Get Developer Credentials"},{"type":"link","url":"/orders-api/quick-start/step-2","title":"Configure the Sample Application"},{"type":"link","url":"/orders-api/quick-start/step-3","title":"Generate Test Catalog Items"},{"type":"link","url":"/orders-api/quick-start/step-4","title":"Take a Pickup Order"},{"type":"link","url":"/orders-api/quick-start/step-5","title":"Verify a Pickup Order"}],"title":"Order-Ahead Sample App","url":"/orders-api/quick-start"},{"type":"link","url":"/orders-api/metadata","title":"Metadata"}],"title":"Orders","url":"/orders-api/what-it-does"},{"id":"7uE6hgqgUI1iKEWFxYKPYb","type":"subcategory","items":[{"type":"link","url":"/orders-custom-attributes-api/custom-attribute-definitions","title":"Define Custom Attributes"},{"type":"link","url":"/orders-custom-attributes-api/custom-attributes","title":"Use Custom Attributes"}],"title":"Order Custom Attributes","url":"/orders-custom-attributes-api/overview"},{"id":"5uzyfjmBfADM23ka1K1pWH","type":"subcategory","items":[{"type":"link","url":"/catalog-api/design-a-catalog","title":"Design a Catalog"},{"type":"link","url":"/catalog-api/build-with-catalog","title":"Build a Catalog"},{"type":"link","url":"/catalog-api/update-catalog-objects","title":"Update Catalog Objects"},{"type":"link","url":"/catalog-api/retrieve-catalog-objects","title":"Retrieve Catalog Objects"},{"id":"XauByVgbcHPakYrcVm4lx","type":"subcategory","items":[{"type":"link","url":"/catalog-api/search-catalog-items","title":"Call SearchCatalogItems"},{"type":"link","url":"/catalog-api/search-catalog-objects","title":"Call SearchCatalogObjects"}],"title":"Search a Catalog","url":"/catalog-api/search-catalog"},{"type":"link","url":"/catalog-api/sync-with-external-system","title":"Synchronize Catalog With External Platform"},{"type":"link","url":"/catalog-api/archive-catalog-items","title":"Archive Catalog Items"},{"type":"link","url":"/catalog-api/delete-catalog-objects","title":"Delete Catalog Objects"},{"type":"link","url":"/catalog-api/categorize-catalog-items","title":"Categorize Catalog Items"},{"type":"link","url":"/catalog-api/enable-modifiers-on-items","title":"Enable Modifiers on Items"},{"type":"link","url":"/catalog-api/item-options","title":"Use Item Options"},{"id":"6lb9Ids2YTwmZdYSSWo9ZU","type":"subcategory","items":[{"type":"link","url":"/catalog-api/upload-and-attach-images","title":"Upload and Attach Images"},{"type":"link","url":"/catalog-api/manage-images","title":"Manage Images"}],"title":"Work with Images","url":"/catalog-api/cookbook/create-catalog-image"},{"type":"link","url":"/catalog-api/add-custom-attributes","title":"Add Custom Attributes"},{"id":"4uO79DXTpBj486wRLPVjD9","type":"subcategory","items":[{"type":"link","url":"/catalog-api/cookbook/auto-apply-discounts/volume-discounts","title":"Create Volume Discounts"},{"type":"link","url":"/catalog-api/cookbook/auto-apply-discounts/bundle-discounts","title":"Create Bundled Discounts"},{"type":"link","url":"/catalog-api/cookbook/auto-apply-discounts/timeframe-discounts","title":"Create Time-Based Discounts"},{"type":"link","url":"/catalog-api/configure-customer-group-discounts","title":"Create Customer Group Discounts"}],"title":"Configure Discounts","url":"/catalog-api/cookbook/auto-apply-discounts"},{"type":"link","url":"/catalog-api/cookbook/set-quick-amounts","title":"Configure Quick Payments"},{"type":"link","url":"/catalog-api/webhooks","title":"Use Webhooks"}],"title":"Catalog","url":"/catalog-api/what-it-does"},{"id":"1VGd8FbxwmjW0KMaajkmro","type":"subcategory","items":[{"type":"link","url":"/inventory-api/how-it-works","title":"How It Works"},{"type":"link","url":"/inventory-api/build-with-inventory","title":"Build an Inventory"},{"type":"link","url":"/inventory-api/enable-stock-conversion","title":"Enable Stock Conversion"},{"type":"link","url":"/inventory-api/cookbook/reconcile-computed-quantity","title":"Reconcile Inventory Counts"},{"type":"link","url":"/inventory-api/cookbook/retrieve-specific-instock-quantity","title":"Retrieve Inventory Counts"},{"type":"link","url":"/inventory-api/cookbook/inventory-change-history","title":"Inspect Inventory Changes"},{"type":"link","url":"/inventory-api/monitor-sold-out-status-on-item-variation","title":"Monitor Sold-out Item Variations"},{"type":"link","url":"/inventory-api/webhooks","title":"Handle Inventory Events"},{"type":"link","url":"/inventory-api/migrate-to-updated-api-entities","title":"Migrate to Updated API Entities"}],"title":"Inventory","url":"/inventory-api/what-it-does"},{"id":"1oCvFBbwIfvkgSqzjsVtl2","type":"subcategory","items":[{"type":"link","url":"/bookings-api/get-ready-to-use-the-api","title":"Basic Concepts"},{"type":"link","url":"/bookings-api/onboard-to-the-api","title":"Onboard to Square Appointments"},{"type":"link","url":"/bookings-api/use-the-api","title":"Create and Manage Bookings"},{"type":"link","url":"/bookings-api/use-webhooks","title":"Handle Event Notifications"}],"title":"Bookings","url":"/bookings-api/what-it-is"},{"id":"3IFs9Vd3B5uWf4LFR7k8EL","type":"subcategory","items":[{"type":"link","url":"/booking-custom-attributes-api/custom-attribute-definitions","title":"Manage Custom Attribute Definitions for Bookings"},{"type":"link","url":"/booking-custom-attributes-api/custom-attributes","title":"Manage Custom Attributes for Bookings"}],"title":"Booking Custom Attributes","url":"/booking-custom-attributes-api/overview"},{"id":"5XXuzzOGN1H5FPRGJcikVN","type":"subcategory","items":[{"type":"link","url":"/vendors-api/create-vendors","title":"Create Vendors"},{"type":"link","url":"/vendors-api/update-vendors","title":"Update Vendors"},{"type":"link","url":"/vendors-api/retrieve-vendors","title":"Retrieve Vendors"},{"type":"link","url":"/vendors-api/search-for-vendors","title":"Search for Vendors"},{"type":"link","url":"/vendors-api/receive-vendors-events","title":"Receive Vendors Events"}],"title":"Vendors","url":"/vendors-api/manage-vendors-in-apps"},{"id":"1mKQKHnvTn1nAsKsA2JRCl","type":"subcategory","items":[{"id":"6bKuXUnDxmCCuIR7ihe7jW","type":"subcategory","items":[{"type":"link","url":"/sites-api/use-the-api","title":"Use the Sites API"}],"title":"Sites API","url":"/sites-api/overview"},{"id":"5Cl3kPc7CUDPgqnbaJBDVJ","type":"subcategory","items":[{"type":"link","url":"/snippets-api/use-the-api","title":"Use the Snippets API"},{"type":"link","url":"/snippets-api/add-a-snippet","title":"Add a Snippet to a Site"}],"title":"Snippets API","url":"/snippets-api/overview"}],"title":"Square Online","url":"/online-api"},{"type":"link","url":"/cashdrawershift-api/reporting","title":"Cash Drawer Shifts"}],"title":"Commerce","url":"/commerce"},{"id":"4URmYFehLwquxQBCQKBKSx","type":"subcategory","items":[{"type":"link","url":"/customers","title":"Overview"},{"id":"5A6vAFRO33giYriws2hfBB","type":"subcategory","items":[{"type":"link","url":"/customers/scenarios/tip-reporting","title":"Build a Tip Report"},{"type":"link","url":"/customers/scenarios/split-online-payment","title":"Split an Online Payment"},{"type":"link","url":"/customers/scenarios/simple-sales-report","title":"Build a Sales Report"}],"title":"Technical Scenarios","url":"/customers/scenarios"},{"id":"15dy7EMFV93TibH1VXLeuV","type":"subcategory","items":[{"type":"link","url":"/customers-api/how-it-works","title":"Customers API Workflows"},{"type":"link","url":"/customers-api/use-the-api/keep-records","title":"Manage Customer Profiles"},{"type":"link","url":"/customers-api/use-the-api/retrieve-profiles","title":"Retrieve Customer Profiles"},{"type":"link","url":"/customers-api/use-the-api/search-customers","title":"Search for Customer Profiles"},{"type":"link","url":"/customers-api/use-the-api/integrate-with-other-services","title":"Integrate with Other Services"},{"type":"link","url":"/customers-api/use-the-api/customer-webhooks","title":"Use Customer Webhooks"}],"title":"Customers","url":"/customers-api/what-it-does"},{"id":"76835s9ZeAgwsAQ3g4bAGW","type":"subcategory","items":[{"type":"link","url":"/customer-custom-attributes-api/custom-attribute-definitions","title":"Manage Customer Custom Attribute Definitions"},{"type":"link","url":"/customer-custom-attributes-api/custom-attributes","title":"Manage Customer Custom Attributes"}],"title":"Customer Custom Attributes","url":"/customer-custom-attributes-api/overview"},{"id":"3o5YnQHQmUFb3JPaTZB1DC","type":"subcategory","items":[{"type":"link","url":"/customer-groups-api/how-to-use-it","title":"Use Customer Groups"}],"title":"Customer Groups","url":"/customer-groups-api/what-it-does"},{"id":"1sYaoLP7iJ1tVaklA24liK","type":"subcategory","items":[{"type":"link","url":"/customer-segments-api/how-to-use-it","title":"Use Customer Segments"}],"title":"Customer Segments","url":"/customer-segments-api/what-it-does"},{"id":"JVl8yM8tzLNaxzj7qZtMM","type":"subcategory","items":[{"type":"link","url":"/loyalty/overview","title":"Loyalty Program Overview"},{"type":"link","url":"/loyalty-api/loyalty-programs","title":"Retrieve Loyalty Program"},{"type":"link","url":"/loyalty-api/loyalty-promotions","title":"Manage Loyalty Promotions"},{"type":"link","url":"/loyalty-api/loyalty-accounts","title":"Create and Retrieve Loyalty Accounts"},{"type":"link","url":"/loyalty-api/loyalty-points","title":"Manage Loyalty Points"},{"type":"link","url":"/loyalty-api/loyalty-rewards","title":"Manage Loyalty Rewards"},{"type":"link","url":"/loyalty-api/loyalty-events","title":"Search for Loyalty Events"},{"id":"1y9o6Z4aUBI2x7iBbs7dem","type":"subcategory","items":[{"type":"link","url":"/loyalty-api/walkthrough1/setup-loyalty-program","title":"Set up a Loyalty Program"},{"type":"link","url":"/loyalty-api/walkthrough1/enroll-buyer","title":"Enroll a Buyer"},{"type":"link","url":"/loyalty-api/walkthrough1/accrue-points","title":"Accumulate Points"},{"type":"link","url":"/loyalty-api/walkthrough1/redeem-points","title":"Redeem Points"}],"title":"Loyalty Walkthrough 1","url":"/loyalty-api/walkthrough1"},{"id":"11C6YxWjq6Ln0oPvOntZIE","type":"subcategory","items":[{"type":"link","url":"/loyalty-api/walkthrough2-setup-loyalty-program","title":"Set up a Loyalty Program"},{"type":"link","url":"/loyalty-api/walkthrough2-enroll-buyer","title":"Enroll a Buyer"},{"type":"link","url":"/loyalty-api/walkthrough2-accrue-points","title":"Adjust Points"},{"type":"link","url":"/loyalty-api/walkthrough2-redeem-points","title":"Redeem Points"}],"title":"Loyalty Walkthrough 2","url":"/loyalty-api/walkthrough2"}],"title":"Loyalty","url":"/loyalty-api/overview"},{"id":"SkbBIiQbMBmohDyoTixOJ","type":"subcategory","items":[{"type":"link","url":"/gift-cards/sell-gift-cards","title":"Sell Gift Cards"},{"type":"link","url":"/gift-cards/reload-gift-cards","title":"Reload Gift Cards"},{"type":"link","url":"/gift-cards/redeem-gift-cards","title":"Redeem Gift Cards"},{"type":"link","url":"/gift-cards/retrieve-gift-cards-and-activities","title":"Retrieve Gift Cards and Track Activity"},{"type":"link","url":"/gift-cards/manage-gift-cards-on-file","title":"Manage Gift Cards on File"},{"id":"6jk6v9WCq58u7FwD9THjoZ","type":"subcategory","items":[{"type":"link","url":"/gift-cards/walkthrough-1-with-orders-api","title":"Sell a Gift Card (Orders API Integration)"},{"type":"link","url":"/gift-cards/walkthrough-1-without-orders-api","title":"Sell a Gift Card (Custom Processing System)"}],"title":"Walkthrough 1: Sell a Gift Card","url":"/gift-cards/walkthrough-1"},{"id":"3dKyCAtUVMdrXS6NlwDLHz","type":"subcategory","items":[{"type":"link","url":"/gift-cards/walkthrough-2-orders-and-payments-integration","title":"Use a Gift Card (Orders and Payments APIs Integration)"},{"type":"link","url":"/gift-cards/walkthrough-2-custom-processing-system","title":"Use a Gift Card (Custom Processing System)"}],"title":"Walkthrough 2: Use a Gift Card","url":"/gift-cards/walkthrough-2"},{"type":"link","url":"/gift-cards/webhooks","title":"Webhooks"}],"title":"Gift Cards","url":"/gift-cards/using-gift-cards-api"}],"title":"Customers","url":"/customers"},{"id":"1ThKdZQl6m1Eioed7ZwOsS","type":"subcategory","items":[{"type":"link","url":"/staff","title":"Overview"},{"id":"6mOVdvn1uSAoAb8iJaDzEo","type":"subcategory","items":[{"type":"link","url":"/staff/scenarios/tip-reporting","title":"Build a Tip Report"},{"type":"link","url":"/staff/scenarios/split-online-payment","title":"Split an Online Payment"},{"type":"link","url":"/staff/scenarios/simple-sales-report","title":"Build a Sales Report"}],"title":"Technical Scenarios","url":"/staff/scenarios"},{"id":"2nH2TMoml4cRDkyaLvM892","type":"subcategory","items":[{"type":"link","url":"/team/integration","title":"Integration Guide"},{"type":"link","url":"/team/troubleshooting","title":"Troubleshoot Team API"},{"type":"link","url":"/team/permissions","title":"Team Permissions"}],"title":"Team","url":"/team/overview"},{"id":"4onB3obwWl1foVPal7Sq8X","type":"subcategory","items":[{"type":"link","url":"/labor-api/build-with-labor","title":"Build with Labor"},{"type":"link","url":"/labor-api/cookbook/add-shift-breaks","title":"Add Shift Breaks"},{"type":"link","url":"/labor-api/cookbook/get-completed-shifts","title":"Get Completed Shifts"},{"type":"link","url":"/labor-api/how-it-works","title":"How It Works"},{"type":"link","url":"/labor-api/troubleshooting","title":"Troubleshoot"},{"type":"link","url":"/labor-api/webhooks","title":"Webhooks"}],"title":"Labor","url":"/labor-api/what-it-does"},{"id":"7cXeSK6EqmhzhIFmcpba7h","type":"subcategory","items":[{"type":"link","url":"/access-management/integration-guide","title":"Integration guide"}],"title":"Access Management","url":"/access-management"}],"title":"Staff","url":"/staff"},{"id":"5BHWPSspAJWZD75mfWezwx","type":"subcategory","items":[{"type":"link","url":"/merchant-details","title":"Overview"},{"id":"3OwozWeQAYofh9tmoyrEPq","type":"subcategory","items":[{"type":"link","url":"/merchants/scenarios/tip-reporting","title":"Build a Tip Report"},{"type":"link","url":"/merchants/scenarios/split-online-payment","title":"Split an Online Payment"},{"type":"link","url":"/merchants/scenarios/simple-sales-report","title":"Build a Sales Report"}],"title":"Technical Scenarios","url":"/merchants/scenarios"},{"type":"link","url":"/merchants-api","title":"Merchants"},{"id":"3busOpLCt9zKcYBv4DnkxZ","type":"subcategory","items":[{"type":"link","url":"/merchant-custom-attributes-api/custom-attribute-definitions","title":"Define Custom Attributes for Merchants"},{"type":"link","url":"/merchant-custom-attributes-api/custom-attributes","title":"Use Custom Attributes for Merchants"}],"title":"Merchant Custom Attributes","url":"/merchant-custom-attributes-api/overview"},{"type":"link","url":"/locations-api","title":"Locations"},{"id":"3OtQbV9DLTefjKNm185T2k","type":"subcategory","items":[{"type":"link","url":"/location-custom-attributes-api/custom-attribute-definitions","title":"Define Custom Attributes for Locations"},{"type":"link","url":"/location-custom-attributes-api/custom-attributes","title":"Use Custom Attributes for Locations"}],"title":"Location Custom Attributes","url":"/location-custom-attributes-api/overview"}],"title":"Merchants","url":"/merchant-details"},{"type":"divider","style":"divider"},{"id":"2FhNpYU8iPn0qCJYFJureL","type":"subcategory","items":[{"id":"4dMAnH4WGqOuZx7AQsbW6W","type":"subcategory","items":[{"type":"link","url":"/app-marketplace/what-should-i-build","title":"What Should I Build?"},{"id":"PkhOF4kBMi8AcjqYu6NjO","type":"subcategory","items":[{"type":"link","url":"/app-marketplace/requirements/general","title":"General"},{"type":"link","url":"/app-marketplace/requirements/oauth-api","title":"OAuth API"},{"type":"link","url":"/app-marketplace/requirements/locations-api","title":"Locations API"},{"type":"divider","style":"divider"},{"type":"link","url":"/app-marketplace/requirements/app-subscriptions","title":"App Subscriptions"},{"type":"link","url":"/app-marketplace/requirements/bookings-api","title":"Bookings API"},{"type":"link","url":"/app-marketplace/requirements/catalog-api","title":"Catalog and Inventory API"},{"type":"link","url":"/app-marketplace/requirements/customers-api","title":"Customers API"},{"type":"link","url":"/app-marketplace/requirements/invoices-api","title":"Invoices API"},{"type":"link","url":"/app-marketplace/requirements/gift-cards-api","title":"Gift Cards API"},{"type":"link","url":"/app-marketplace/requirements/labor-api","title":"Labor API"},{"type":"link","url":"/app-marketplace/requirements/loyalty-api","title":"Loyalty API"},{"type":"link","url":"/app-marketplace/requirements/orders-api","title":"Orders API"},{"type":"link","url":"/app-marketplace/requirements/payments-api","title":"Payments"},{"type":"link","url":"/app-marketplace/requirements/payouts-api","title":"Payouts API"},{"type":"link","url":"/app-marketplace/requirements/snippets-api","title":"Snippets API"},{"type":"link","url":"/app-marketplace/requirements/subscriptions-api","title":"Subscriptions API"},{"type":"link","url":"/app-marketplace/requirements/team-api","title":"Team API"},{"type":"link","url":"/app-marketplace/requirements/terminal-api","title":"Terminal API"},{"type":"link","url":"/app-marketplace/requirements/webhooks","title":"Webhooks"}],"title":"Requirements","url":"/app-marketplace/requirements"},{"type":"link","url":"/app-marketplace/video-submission","title":"Video Submission Requirements"},{"id":"24UhdFmhHPDXsMEzIJ6OG4","type":"subcategory","items":[{"type":"link","url":"/app-marketplace/listing-best-practices/basics","title":"Basic Information"},{"type":"link","url":"/app-marketplace/listing-best-practices/details","title":"Details"},{"type":"link","url":"/app-marketplace/listing-best-practices/get-started","title":"Get Started"},{"type":"link","url":"/app-marketplace/listing-best-practices/pricing","title":"Pricing"},{"type":"link","url":"/app-marketplace/listing-best-practices/brand-and-images","title":"Brand and Images"},{"type":"link","url":"/app-marketplace/listing-best-practices/support-information","title":"Support Information"}],"title":"Create an App Marketplace Listing","url":"/app-marketplace/listing-best-practices"},{"type":"link","url":"/app-marketplace/app-reviews","title":"App Marketplace Reviews"},{"type":"link","url":"/app-marketplace/rev-share","title":"App Marketplace Revenue Sharing"},{"type":"link","url":"/app-marketplace/faq","title":"App Marketplace Frequently Asked Questions"},{"id":"1el38dmWf4nbVIBAf60U2Q","type":"subcategory","items":[{"type":"link","url":"/app-marketplace/app-subscriptions/billing","title":"App Subscriptions Billing"}],"title":"App Subscriptions","url":"/app-marketplace/app-subscriptions"}],"title":"App Marketplace","url":"/app-marketplace"}],"title":"Publish","url":"/app-marketplace"},{"type":"divider","style":"space"},{"type":"divider","style":"divider"},{"id":"347zcabrwZkdfbgVsDmSBO","type":"subcategory","items":[{"type":"link","url":"/release-notes","title":"Overview"},{"type":"link","url":"/changelog/connect","title":"Square APIs and SDKs"},{"type":"link","url":"/changelog/mobile","title":"Mobile SDKs"},{"id":"6QrXNH8opd01JmuzgLjUXU","type":"subcategory","items":[{"type":"link","url":"/changelog/webpaymentsdk","title":"Web Payments SDK"},{"type":"link","url":"/changelog/paymentform","title":"Payment Form"}],"title":"Web SDKs","url":"/changelog/websdks"},{"type":"link","url":"/changelog/requirements","title":"App Marketplace Requirements"}],"title":"Release notes","url":"/release-notes"}]}},"notFound":false,"preview":false,"didRedirect":false}},"_sentryTraceData":"c7650af1dc7848d2b2370ee90c3d17b8-ac67d19e8fd92215-1","_sentryBaggage":"sentry-environment=production,sentry-release=b19e9bf6c2e7608b1a09ca60e575f7c7a0540e24,sentry-public_key=94d09c8eb5834eb282d762cecbbd40e6,sentry-trace_id=c7650af1dc7848d2b2370ee90c3d17b8,sentry-sample_rate=1,sentry-transaction=%2Fdocs%2F%5B%5B...slug%5D%5D,sentry-sampled=true"}},"page":"/docs/[[...slug]]","query":{"slug":["web-payments","customize-styles"]},"buildId":"b19e9bf6c2e7608b1a09ca60e575f7c7a0540e24","assetPrefix":"https://dex-tech-fe-production-c.squarecdn.com/main","isFallback":false,"gip":true,"scriptLoader":[]}</script></body></html>