Smart Fields examples

Smart Fields are pre-built rich UI components that help you build your own pixel-perfect checkout flows across desktop and mobile, without worrying about PCI.

Learn more Explore the docs

Example 1

Add Payment Method

NAME

CARD NUMBER

EXPIRATION

SECURITY CODE

INSTALLMENTS ▼

Payment successful

Thanks for trying Smart Fields. No money was charged, but we generated a token: token

Your card won't be charged View source on GitHub

Example 2

New Payment Card

Card Number

Enter your credit card number.

MM/YY

Enter your credit card expiration.

CVV

Enter your credit card CVV.

Cardholder Name

Enter your name exactly as it appears on your card.

Country

Select a country.

CPF / CNPJ

Enter your CPF / CNPJ.

Remember this card

By completing your purchase, you agree to these Terms of Service.

Secure Connection

Payment successful

Thanks for trying Smart Fields. No money was charged, but we generated a token: token

Your card won't be charged View source on GitHub

Example 3

Name

Address

City

State

Country

ZIP

Card Number

Expiration

CVV

Payment successful

Thanks for trying Smart Fields. No money was charged, but we generated a token: token

Your card won't be charged View source on GitHub

Example 4

Payment successful

Thanks for trying Smart Fields. No money was charged, but we generated a token: token

Your card won't be charged View source on GitHub

Example 5

Name

Phone

Address

City

State

Country

ZIP

Payment successful

Thanks for trying Smart Fields. No money was charged, but we generated a token: token

Your card won't be charged View source on GitHub

Example 6

Payment successful

Thanks for trying Smart Fields. No money was charged, but we generated a token: token

Your card won't be charged View source on GitHub