P/Paybytoken Playground

Test environmentView code

Sandbox/01

Every way to pay.One checkout.

Bring stablecoins and future payment methods into one consistent checkout, hosted by Paybytoken or embedded in your product.

Explore checkout View integration

Compare checkout modes

One order. Two ways to checkout.

One server-created payment session powers either experience. Compare the customer journey before choosing how to integrate.

Live test flow

No real funds

Prepared order

Collector starter bundle

Starter collector pack$20.00

Protective sleeves × 2$10.00

Fulfilment and service$22.00

Order total

$52.00USD

Customer experience

Choose how checkout opens.

Embedded

Checkout stays inside the merchant experience.

Hosted

Redirect to a Paybytoken-hosted payment page.

Interactive sandbox

Choose what to pay for.

Set a top-up amount or use a prepared cart. You’ll choose hosted or embedded checkout next.

01Select payment02Open checkout

Flexible top-up

Set a custom top-up.

Enter any supported amount. The playground validates it server-side before creating checkout.

Minimum $10Maximum $5,000USDC or USDT

Top-up amount

$USD

The amount is locked into the server-created checkout session.

03Prepared orders

Put a real cart through checkout.

Start with the multi-item bundle or choose a fixed-price product. Names, quantities, and prices carry into checkout exactly as prepared.

Multi-item example

Collector starter bundle

Three products become three immutable checkout line items, with quantities and prices preserved for the customer.

Future Sight

Qty 1 · $12.00

Violet EX

Qty 1 · $16.00

Battle Partners Pack

Qty 1 · $24.00

Order total

$52.00

Starter pick

$12.00

A glimpse of what comes next

Future Sight

A bright, entry-level collector pack with five surprise cards.

Collector

$24.00

Iconic duos, one sealed pack

Battle Partners Pack

A partner-focused set for collectors who like character cards.

Premium

$42.00

Premium foil-heavy selection

Shiny Treasure EX

A premium pack with shiny variants and elevated hit rates.

Checkout events

One checkout, a clear sequence.

Embedded checkout reports each lifecycle change to the merchant page. Hosted checkout returns through the configured success or cancel URL.

event: "complete"

sessionId: "chk_test_••••4f2a"

order: "Collector starter bundle"

ready

The secure payment UI is ready for the customer.

change

The selected currency, network, or checkout state changed.

complete

The merchant can confirm the order and begin fulfilment.

cancel

The cart stays available and the customer can try again.

Implementation flow

From payment session to payment result.

Create the payment securely on your server, open the chosen checkout experience, and keep the merchant page synchronized with every lifecycle event.

View the integration example

Create on your server

Your secret API key stays server-side while you create a session for the exact cart and merchant origin.

Choose the customer experience

Redirect to the hosted checkout URL, or use the browser SDK to mount checkout inside the merchant page.

React to lifecycle events

Update your order UI from ready, change, complete, return, cancel, and error events—without a redirect.

Reference integration

A small API surface, with the sensitive parts in the right place.

This playground uses the same session endpoint for both modes. Inspect the hosted redirect, then compare it with the browser SDK and iframe bridge.

Secret API key is used only in the server route

Hosted mode redirects only to the returned session URL

Embedded client secret never enters the iframe URL

Embedded origin must exactly match this merchant page

Read the Paybytoken documentation

const session = await paybytoken.checkoutSessions.create({
  currency: "usd",
  line_items: cart,
  supported_tokens: [
    { currency: "USDC", chain: "base" },
    { currency: "USDT", chain: "ethereum" },
  ],
  ui_mode: "hosted",
  success_url: "https://shop.example.com/order/success",
  cancel_url: "https://shop.example.com/cart",
});

// Send the customer to Paybytoken-hosted checkout.
window.location.assign(session.url);

Your turn

Test the flow your customers will use.

Set a top-up amount, choose a prepared product, or send a multi-item cart through hosted and embedded checkout.

Choose an order