> This page is for Afterpay Online Developer, version Main (default).
> For other versions, use one of these documentation indexes:
> - Main (default): https://developers.afterpay.com/afterpay-online-developer/main/llms.txt
> - v1: https://developers.afterpay.com/afterpay-online-developer/v-1/llms.txt
> - Chinese: https://developers.afterpay.com/afterpay-online-developer/chinese/llms.txt

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://developers.afterpay.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://developers.afterpay.com/_mcp/server.

# Payment button

`PaymentButton` is a `UIButton` subclass that shows a branded Afterpay call to action. Present a checkout when the customer taps it.

## Add the button

```swift
let paymentButton = PaymentButton(
  colorScheme: .static(.default),
  buttonKind: .checkout
)
paymentButton.addTarget(
  self,
  action: #selector(didTapPayWithAfterpay),
  for: .touchUpInside
)
view.addSubview(paymentButton)
```

Both initializer parameters are optional. The defaults are `.static(.default)` and `.buyNow`. You can also change `colorScheme` and `buttonKind` after you create the button.

## Visibility

`PaymentButton` doesn't hide itself when `Afterpay.enabled` is `false`. It blanks its artwork but keeps its size and stays tappable. Hide it yourself:

```swift
paymentButton.isHidden = !Afterpay.enabled
```

## Size the button

The button keeps a fixed aspect ratio, so set its width and let the height follow. To keep the text legible, the button has a minimum width of 256 points. The button turns off `translatesAutoresizingMaskIntoConstraints`, so position it with Auto Layout constraints.

## Button kinds

Set `buttonKind` to change the button's text:

| Kind            | Button |
| --------------- | ------ |
| `.buyNow`       |        |
| `.checkout`     |        |
| `.payNow`       |        |
| `.continueWith` |        |

For US merchants, the Cash App Afterpay buttons for these kinds read "Buy with", "Checkout with", "Pay with", and "Continue with".

## Color schemes

The button supports the `.default`, `.alt`, `.darkMono`, and `.lightMono` palettes. For examples and guidance on which background to use each one on, see [Color schemes](/afterpay-online-developer/guides/sdk/ios-sdk/ui-components#color-schemes).

```swift
paymentButton.colorScheme = .dynamic(
  lightPalette: .default,
  darkPalette: .alt
)
```

## Start a checkout

The button doesn't start a checkout by itself. In its action, present the checkout that fits your integration. For example, with Checkout V2:

```swift
@objc func didTapPayWithAfterpay() {
  Afterpay.presentCheckoutV2Modally(
    over: self,
    didCommenceCheckout: { completion in
      // Get a checkout token from your server.
      self.checkoutService.createCheckout { completion($0) }
    },
    completion: { result in
      self.handleCheckoutResult(result)
    }
  )
}
```

For the full flow, see the [iOS implementation guide](/afterpay-online-developer/guides/sdk/ios-sdk/implementation-guide).