Introduction

Zatlas Card Capture is a JavaScript SDK that lets you collect credit card payments on your website without handling sensitive card data. It renders a secure card form inside an isolated iframe — your code never sees the card number, expiry, or CVV.

How it works

You install the SDK via npm and add a <div> to your page.
The SDK renders a card form inside an iframe hosted on fields.zatlas.com.
The guest types their card details into the iframe.
Depending on your integration, the SDK either:
- Charges now — processes the payment end-to-end and returns the result.
- Saves for later — tokenizes the card and returns a mth_* token that your server uses to charge later via the Payments API.

Your website stays at PCI DSS SAQ A — the simplest compliance level.

Two integration modes

	Charge now (`checkout`)	Charge later (`createToken`)
Use case	Guest pays during booking	Save card for check-in, scheduled, or recurring charges
What the SDK does	Captures card, creates payment, handles installments + 3DS	Captures card, returns a `mth_*` token
Server work	Provide an access token. That’s it.	Store the token, call the Payments API to charge when ready
Installments (MSI)	Built-in picker inside the iframe	Your server selects installments via the API
3D Secure	Automatic, handled inside the iframe	Your server handles 3DS via the API

Authentication

Your server obtains an access token via OAuth2 (client credentials) and passes it to the frontend. The SDK uses this token for all API calls. You receive one set of credentials — a single token works for both tokenization and payments.

The access token is short-lived (1 hour). Your client_id and client_secret never leave your server.

Next steps

Quick Start — Install the SDK and run a test payment in 5 minutes.
Sandbox Setup — Get your sandbox credentials and test cards.
Backend Setup — Set up the OAuth2 token endpoint on your server.