Desktop Only

This application is optimized for desktop browsers. Please open it on a device with a screen width of at least 1024px.

USDC gasless x402 payments on Mantle Network

Build monetized APIs using standard HTTP 402 responses. Our SDK handles blockchain micropayments seamlessly while your users enjoy a gasless experience. Self-hosted facilitator processes payments automatically.

*API keys are needed only for additional analytics
and connections to NOT self-hosted facilitators.

npm install @puga-labs/x402-mantle-sdkCopied!

npx create-mantle-facilitatorCopied!

System Status

IDLE / WAITING

User Client

Initiates request to premium API endpoint via HTTP.

GET /dataSending

API Gateway

Server validates payment headers. Returns a 402 error if the header is missing or invalid.

402 Payment Required

200 OK Authorized

Waiting for response...

Mantle Facilitator

After user approval, it transfers USDC, automatically pays the gas fee through the Mantle network, and generates a payment header.

Auto-PaymentIdle

What is a facilitator and why is it needed?

A facilitator is a crucial component of the x402-mantle-sdk that handles blockchain micropayments automatically. It processes USDC transfers, pays gas fees through the Mantle network, and generates payment headers seamlessly—so your users never worry about transaction complexity. Choose the deployment option that fits your needs.

Types of facilitators

Self-hosted

FREE

Completely free and available to everyone. Launch your own facilitator instance with a single command and maintain full control over your payment infrastructure.

npx create-mantle-facilitatorCopied!

Hosted by @puga-labs

MANAGED

Perfect solution for developers who prefer a managed service. Simply top up your MNT balance in your personal dashboard and use our route with your API key—no infrastructure management required.

SDK - what it does
and how to set it up

Our SDK provides a seamless way to integrate HTTP 402 payment-required responses into your applications. It handles the complexity of blockchain micropayments, allowing you to focus on building your API.

The SDK is built with a modular architecture, supporting both frontend and backend implementations. It automatically manages payment headers, facilitator connections, and transaction states.

Key Features:

Automatic payment header generation
Built-in retry logic and error handling
Support for multiple frameworks
Type-safe TypeScript implementation

Frontend Integration

Primarily designed for React and Next.js applications. Shows how your code transforms when using our SDK.

Before:

// Your code placeholder
// Manual payment handling
// Complex state management
fetch('/api/data', {
  headers: { /* manual headers */ }
})

After (with SDK):

// With x402-mantle-sdk
import { useMantleX402 } from '@puga-labs/x402-mantle-sdk/react'

const { postWithPayment } = useMantleX402()
const { response, txHash } = await postWithPayment('/api/data')
// Automatic payment handling ✓

Backend Integration

Adapters for Express, Next.js, Hono, Cloudflare Workers, Deno, and Bun.

Before:

// Your backend code
// Manual 402 response handling
// Payment verification logic

After (with SDK):

// With x402-mantle-sdk
import { mantlePaywall } from '@puga-labs/x402-mantle-sdk/server/nextjs'

const pay = mantlePaywall({
  priceUsd: 0.01,
  payTo: '0xYourWallet',
  facilitatorUrl: process.env.FACILITATOR_URL,
  facilitatorSecret: process.env.FACILITATOR_SECRET
})

export const POST = pay(async (req) => {
  return NextResponse.json({ result: 'success' })
})

Analytics - track all transactions in one place

By default, your data stays completely private—nothing leaves your infrastructure. But if you want detailed analytics, enable it with just a few lines of code. Analytics is completely free for both self-hosted and hosted facilitators.

1. Get your API key

Obtain an API key from your personal dashboard

2. Add API key to your code

2.1 Backend (add projectKey)

const pay = mantlePaywall({
  ...
  projectKey: 'pk_xxx' 
})

2.2 Facilitator .env (optional)

# Add to facilitator .env file
TELEMETRY_PROJECT_KEY=pk_xxx

3. Access your dashboard and track all transactions

Try the Live Demo

See x402-mantle-sdk in action. Generate AI images with Google Gemini and pay with USDC on Mantle — all in real-time.

Network Monitor

Watch HTTP 402 flow in real-time. See how payment-required responses work and how the SDK handles them automatically.

Settings Panel

Configure Hosted (Project Key) or Self-hosted (Facilitator URL + Secret) mode. Test both integration options.

Gasless Payments

Pay only in USDC — no MNT needed for gas. The facilitator handles all transaction fees for you.

How to use

Connect your wallet

Use MetaMask on Mantle Network. You only need USDC — no MNT required for gas fees!

Configure Settings

Choose Hosted (enter Project Key from dashboard) or Self-hosted (enter your Facilitator URL and Secret).

Generate an image

Enter a prompt and click Generate ($0.05 USDC). Watch the Network tab to see the 402 flow.