Article

Choosing Button Appearance

Choose a button color and size to suit your webpage.

Overview

You can choose from several color options for the Apple Pay button, and increase its size to suit your web page.

To display the Apple Pay button with a black background, set the -webkit-appearance CSS property of an element to -apple-pay-button. You can change the button's appearance by setting the -apple-pay-button-style CSS property to white, white-outline, or black.

To support devices running iOS 10 and macOS 10.12, use the CSS template sample code in Displaying Apple Pay Buttons to draw the appropriate button.

You can resize the Apple Pay buttons to fit your website. The minimum allowed width and height for the buttons are:

• Minimum width for Apple Pay button: 100 pixels

• Minimum width for Buy with Apple Pay button: 140 pixels

• Minimum height for any Apple Pay button: 30 pixels

See the Human Interface Guidelines > Apple Pay for more information.

See Also

Apple Pay Buttons

Displaying Apple Pay Buttons

Use CSS templates to display Apple Pay buttons in Safari.

Localizing Apple Pay Buttons

Set the language of an Apple Pay button.