# Stablecoin checkout, pay button and API | Cosmos Pay

URL: https://payments.cosmospay.lat/integrations

> From a payment link with no code to your own payment screen with the API. Pick how you charge and how the payment looks on your site.

## Add stablecoin payments to your site

From a payment link with no code to your own payment screen with the API. Pick how you charge and how the payment looks on your site.

### Put the payment where it fits your site.

Send customers to our checkout, open it from a button, show it inside your page, or build your own with the API. Try each option below: every demo runs on this page, with sample data that can’t be paid.

#### Pay button (One line of HTML)

Our script draws a button that opens the checkout in a window over your page, and tells your page when the payment is confirmed.

```html
<script defer
  src="https://payments.cosmospay.lat/embed/cosmos-pay.js"></script>

<!-- link: your payment link's id, from the dashboard or the API -->
<cosmos-pay-button
  link="cmh9a1q7r0000l208x9k4d1pz">
</cosmos-pay-button>

<script>
  document.querySelector("cosmos-pay-button")
    .addEventListener("cosmospay:paid", showThanks);
</script>
```

[Read the embed guide](https://dev.cosmospay.lat/docs/embed/)

#### Embedded checkout (One line of HTML)

The checkout sits inside your page: amount, QR code and wallet button, with its status updating live and events your page can listen to.

```html
<script defer
  src="https://payments.cosmospay.lat/embed/cosmos-pay.js"></script>

<!-- link: your payment link's id, from the dashboard or the API -->
<cosmos-pay-checkout
  link="cmh9a1q7r0000l208x9k4d1pz"
  lang="en" theme="auto">
</cosmos-pay-checkout>

<script>
  document.querySelector("cosmos-pay-checkout")
    .addEventListener("cosmospay:status", (event) => {
      console.log(event.detail.status); // PENDING, SUBMITTED, SUCCEEDED
    });
</script>
```

[Read the embed guide](https://dev.cosmospay.lat/docs/embed/)

#### Hosted checkout (No code on your site)

Send your customer to a checkout page we host. Pick one of four designs per link; no other site can frame the page.

Checkout design:

- **Classic**: One clean column: amount, live status, QR code and the payment details.
- **Split**: Payment methods on a side rail with a countdown. The payer picks how to pay.
- **Receipt**: Payment fields with a receipt beside them: details, a tear line and the total.
- **Card**: A large countdown, labelled fields and a payment card that carries the QR code.

```html
<!-- Send your customer to the hosted checkout. Its design
     (classic, split, ticket or card) is set on the link,
     in the dashboard or with the API (checkoutTheme). -->
<a href="https://payments.cosmospay.lat/cmh9a1q7r0000l208x9k4d1pz">
  Pay with Cosmos Pay
</a>
```

[Create a payment link](https://dev.cosmospay.lat/login?next=%2Fdashboard%3Fview%3Dpayments)

#### Payment links and QR (No code)

Create a link in the dashboard and share it by chat, email or a printed QR code. Your customer opens it and pays from their wallet.

[Create a payment link](https://dev.cosmospay.lat/login?next=%2Fdashboard%3Fview%3Dpayments)

#### API and SDK (Your own interface)

Create payment intents from your server, draw your own payment screen and hear back through signed webhooks.

```ts
import { Client } from "@cosmosapp/pay_sdk";

const client = new Client({ apiKey: process.env.COSMOS_PAY_API_KEY });
const intent = await client.paymentIntents.createPay({
  destination: "G…YOUR_ACCOUNT",
  amount: "25",
});
// send your customer to the hosted checkout
const checkoutUrl = "https://payments.cosmospay.lat/" + intent.id;
```

[Read the API reference](https://dev.cosmospay.lat/docs/api/)

#### E-commerce plugins (Coming soon)

WooCommerce and Shopify plugins, to take payments in your store without writing code.

[Tell us which store you use](https://payments.cosmospay.lat/integrations#contact)

Whatever you choose, confirm the payment on your server through the webhook or the API.

### A few lines of code.

Create the payment on your server, share the checkout link, and let the webhook tell you when it is paid.

- A REST API documented with OpenAPI
- A TypeScript SDK: @cosmosapp/pay_sdk
- Webhooks signed with HMAC-SHA256
- Test keys (dv_) and live keys (prod_)

- [Read the docs](https://dev.cosmospay.lat/docs/)
- [API reference](https://dev.cosmospay.lat/docs/api/)

#### REST

```bash
curl https://api.cosmospay.lat/cosmos-api/v1/payment-intents/pay \
  -H "Authorization: Bearer $COSMOS_PAY_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "chain": "stellar",
    "destination": "G…YOUR_ACCOUNT",
    "amount": "25",
    "assetCode": "USDC",
    "assetIssuer": "GA5ZSEJYB37JRC5AVCIA5MOP4RHTM335X2KGX3IHOJAPP5RE34K4KZVN",
    "msg": "Order #1001",
    "checkoutTheme": "ticket"
  }'
```

#### TypeScript SDK

```ts
import { Client } from "@cosmosapp/pay_sdk";

const client = new Client({ apiKey: process.env.COSMOS_PAY_API_KEY });
const intent = await client.paymentIntents.createPay({
  destination: "G…YOUR_ACCOUNT",
  amount: "25",
});
// send your customer to the hosted checkout
const checkoutUrl = "https://payments.cosmospay.lat/" + intent.id;
```

#### Webhook

```json
{
  "id": "evt_01JB…",
  "type": "PAYMENT_INTENT_SUCCEEDED",
  "createdAt": "2026-10-24T22:36:56.000Z",
  "data": {
    "id": "cmh9a1…",
    "status": "SUCCEEDED",
    "amount": "25",
    "txHash": "6864…2e54"
  }
}
```

The response’s id is the link: https://payments.cosmospay.lat/<id>

### Three ways to start charging.

Start with a link today and move to the API when you need it. Every path uses the same checkout, dashboard and webhooks.

#### Payment links (No code)

Create a link in the dashboard and share it by chat, email or QR code.

- A fixed amount, or one the payer chooses
- A message the payer sees in their wallet
- Live status in the dashboard

[Create a payment link](https://dev.cosmospay.lat/login?next=%2Fdashboard%3Fview%3Dpayments)

#### Hosted checkout (Low code)

Send customers to a checkout we host, with the QR code, wallet buttons and live status.

- Four ready-made designs
- In English, Spanish, Portuguese, French, German, Hindi and Chinese
- Pages no other site can frame

[See the integration options](https://payments.cosmospay.lat/integrations)

#### Payments API (Full control)

Create payment intents from your server and hear back through signed webhooks.

- REST, documented with OpenAPI
- A TypeScript SDK
- Webhooks signed with HMAC-SHA256

[Read the docs](https://dev.cosmospay.lat/docs/)

### Related guides

[See every guide](https://payments.cosmospay.lat/learn)

#### [How to add a crypto pay button or checkout to your website](https://payments.cosmospay.lat/learn/crypto-payment-button)

Load one script, add a pay button or an embedded checkout for a payment link, and confirm the payment on your server.

#### [How to accept USDC payments online](https://payments.cosmospay.lat/learn/accept-usdc-payments)

Charge in USDC with a payment link, the hosted checkout or the API, and try it on a test network first.

#### [How to send a payment link on WhatsApp](https://payments.cosmospay.lat/learn/whatsapp-payment-links)

Create a link in the dashboard, send it in a chat or print its QR code, and see when it is paid.

### Start accepting stablecoins.

Create a free account, mint a test key and send your first payment link today.

[Create a payment link](https://dev.cosmospay.lat/login?next=%2Fdashboard%3Fview%3Dpayments)

#### Write to us

Questions about plans, integration or protected payments? Tell us and we will reply by email.

[organization@cosmospay.lat](mailto:organization@cosmospay.lat)