Skip to main content

Overview

Crossmint’s Embedded Checkout makes it easy to accept multiple payment methods. Users can pay:
  • With credit/debit cards
  • Using Apple Pay or Google Pay
  • Using ETH, SOL, USDC, EURC, or other supported tokens
  • Using cross-chain crypto on supported chains

Quick Integration

Enable all payment methods with just a few lines of code:
<CrossmintEmbeddedCheckout
    lineItems={{
        collectionLocator: `crossmint:${collectionId}`,
        callData: {
            totalPrice: "0.001",
            quantity: 1,
        },
    }}
    payment={{
        crypto: {
            enabled: true, // Enable crypto payments
        },
        fiat: {
            enabled: true, // Enable fiat payments
        },
    }}
/>

Fiat Payments

Credit Cards & Digital Wallets

Embedded Checkout provides a seamless fiat payment experience supporting:
  • All major credit and debit cards
  • Apple Pay for iOS/Safari users
  • Google Pay for Android/Chrome users
You can configure which fiat payment methods to enable:
payment={{
  fiat: {
    enabled: true,
    // By default, all payment methods are enabled if you don't specify any.
    allowedMethods: {
      card: true, // Enable/disable credit cards
      applePay: true, // Enable/disable Apple Pay
      googlePay: true, // Enable/disable Google Pay
    },
    defaultCurrency: "usd" // Set default currency
  }
}}

Crypto Payments

Native Wallet Support

Embedded Checkout works with any Web3 wallet, including:
  • MetaMask
  • Coinbase Wallet
  • WalletConnect
  • Phantom
Users can pay with ETH, SOL, stablecoins (USDC, EURC), or other supported tokens on their preferred chain. Enable crypto payments with:
payment={{
  crypto: {
    enabled: true,
    defaultChain: "ethereum", // Optional: Set default blockchain
    defaultCurrency: "usdc" // Optional: Set default currency (usdc, eurc, eth)
  }
}}

Cross-Chain Support

The checkout supports paying with funds from any supported blockchain, even if the digital asset is on a different chain. For example, a user could pay for a digital asset on Polygon using ETH from their Ethereum wallet. The checkout handles all necessary conversions automatically.

Customizing the Default Experience

Set a default payment method to guide users:
payment={{
  defaultMethod: "fiat", // or "crypto"
  crypto: {
    enabled: true
  },
  fiat: {
    enabled: true
  }
}}

Test Price Limits and Test Credit Cards

When building your applications using the staging environment, you can use various test credit cards numbers to see the entire process end-to-end, without actually having to transact using a real credit card. Check out the Testing Tips page for more info on price limits and test card numbers.

Best Practices

  • Enable Multiple Payment Methods: Offer both fiat and crypto options to maximize conversion
  • Set Default Currency: Choose a default that matches your target market
  • Test All Flows: Use test cards and test wallets to verify the complete payment experience
  • Handle Events: Use the useCrossmintCheckout hook to track payment status and handle completion