# Checkout cripto, botón de pago y API | Cosmos Pay

URL: https://payments.cosmospay.lat/integrations?lang=es

> Desde un enlace de pago sin código hasta tu propia pantalla de pago con la API. Elige cómo cobras y cómo se ve el pago en tu sitio.

## Pagos en stablecoins para tu sitio

Desde un enlace de pago sin código hasta tu propia pantalla de pago con la API. Elige cómo cobras y cómo se ve el pago en tu sitio.

### Pon el pago donde encaje en tu sitio.

Envía a tus clientes a nuestro checkout, ábrelo desde un botón, muéstralo dentro de tu página o arma el tuyo con la API. Prueba cada opción aquí abajo: todas las demos funcionan en esta página, con datos de ejemplo que no se pueden pagar.

#### Botón de pago (Una línea de HTML)

Nuestro script dibuja un botón que abre el checkout en una ventana sobre tu página y le avisa a tu página cuando el pago se confirma.

```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>
```

[Leer la guía del embed](https://dev.cosmospay.lat/docs/embed/)

#### Checkout embebido (Una línea de HTML)

El checkout vive dentro de tu página: importe, código QR y botón de wallet, con el estado actualizándose en vivo y eventos que tu página puede escuchar.

```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="es" theme="auto">
</cosmos-pay-checkout>

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

[Leer la guía del embed](https://dev.cosmospay.lat/docs/embed/)

#### Checkout alojado (Sin código en tu sitio)

Envía a tu cliente a una página de pago que alojamos nosotros. Elige uno de cuatro diseños por enlace; ningún otro sitio puede incrustar la página.

Diseño del checkout:

- **Clásico**: Una columna limpia: importe, estado en vivo, código QR y los detalles del pago.
- **Dividido**: Métodos de pago en un panel lateral con cuenta regresiva. Quien paga elige cómo.
- **Recibo**: Datos del pago con un recibo al lado: detalles, línea de corte y el total.
- **Tarjeta**: Cuenta regresiva grande, campos con etiqueta y una tarjeta de pago con el código QR.

```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>
```

[Crear un enlace de pago](https://dev.cosmospay.lat/login?next=%2Fdashboard%3Fview%3Dpayments)

#### Enlaces de pago y QR (Sin código)

Crea un enlace en el dashboard y compártelo por chat, correo o un código QR impreso. Tu cliente lo abre y paga desde su wallet.

[Crear un enlace de pago](https://dev.cosmospay.lat/login?next=%2Fdashboard%3Fview%3Dpayments)

#### API y SDK (Tu propia interfaz)

Crea intents de pago desde tu servidor, diseña tu propia pantalla de pago y recibe el resultado por webhooks firmados.

```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;
```

[Leer la referencia de la API](https://dev.cosmospay.lat/docs/api/)

#### Plugins para e-commerce (Próximamente)

Plugins para WooCommerce y Shopify, para cobrar en tu tienda sin escribir código.

[Cuéntanos qué tienda usas](https://payments.cosmospay.lat/integrations?lang=es#contact)

Elijas lo que elijas, confirma el pago en tu servidor con el webhook o la API.

### Unas pocas líneas de código.

Crea el pago en tu servidor, comparte el enlace del checkout y deja que el webhook te avise cuando esté pagado.

- Una API REST documentada con OpenAPI
- Un SDK de TypeScript: @cosmosapp/pay_sdk
- Webhooks firmados con HMAC-SHA256
- Claves de prueba (dv_) y claves live (prod_)

- [Leer la documentación](https://dev.cosmospay.lat/docs/)
- [Referencia de la API](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"
  }'
```

#### SDK de TypeScript

```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"
  }
}
```

El id de la respuesta es el enlace: https://payments.cosmospay.lat/<id>

### Tres formas de empezar a cobrar.

Empieza hoy con un enlace y pasa a la API cuando la necesites. Todas usan el mismo checkout, el mismo dashboard y los mismos webhooks.

#### Enlaces de pago (Sin código)

Crea un enlace en el dashboard y compártelo por chat, correo o código QR.

- Un importe fijo, o uno que elige quien paga
- Un mensaje que quien paga ve en su wallet
- El estado en vivo en el dashboard

[Crear un enlace de pago](https://dev.cosmospay.lat/login?next=%2Fdashboard%3Fview%3Dpayments)

#### Checkout alojado (Poco código)

Envía a tus clientes a un checkout que alojamos nosotros, con el código QR, los botones de wallet y el estado en vivo.

- Cuatro diseños prediseñados
- En español, inglés, portugués, francés, alemán, hindi y chino
- Páginas que ningún otro sitio puede incrustar

[Ver las opciones de integración](https://payments.cosmospay.lat/integrations?lang=es)

#### API de pagos (Control total)

Crea intents de pago desde tu servidor y entérate del resultado por webhooks firmados.

- REST, documentada con OpenAPI
- Un SDK de TypeScript
- Webhooks firmados con HMAC-SHA256

[Leer la documentación](https://dev.cosmospay.lat/docs/)

### Guías relacionadas

[Ver todas las guías](https://payments.cosmospay.lat/learn?lang=es)

#### [Cómo agregar un botón de pago cripto o un checkout a tu sitio web](https://payments.cosmospay.lat/learn/crypto-payment-button?lang=es)

Carga un script, agrega un botón de pago o un checkout embebido para un enlace de pago y confirma el pago en tu servidor.

#### [Cómo aceptar pagos en USDC online](https://payments.cosmospay.lat/learn/accept-usdc-payments?lang=es)

Cobra en USDC con un enlace de pago, el checkout alojado o la API, y pruébalo antes en una red de pruebas.

#### [Cómo enviar un enlace de pago por WhatsApp](https://payments.cosmospay.lat/learn/whatsapp-payment-links?lang=es)

Crea un enlace en el dashboard, envíalo por chat o imprime su código QR, y mira cuándo se paga.

### Empieza a aceptar stablecoins.

Crea una cuenta gratis, genera una clave de prueba y envía hoy tu primer enlace de pago.

[Crear un enlace de pago](https://dev.cosmospay.lat/login?next=%2Fdashboard%3Fview%3Dpayments)

#### Escríbenos

Dudas sobre planes, integración o pagos protegidos: cuéntanos y te respondemos por email.

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