> ## Documentation Index
> Fetch the complete documentation index at: https://docs.dynamic.xyz/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# createCryptoDotComPayment

# createCryptoDotComPayment

Creates a Crypto.com payment for purchasing cryptocurrency with fiat. This returns a payment URL that you can display in an iframe within your app or open in a new window.

## Usage

```javascript theme={"system"}
import { createCryptoDotComPayment } from "@dynamic-labs-sdk/client";

const payment = await createCryptoDotComPayment({
  walletAddress: "0x1234...",
  chain: "EVM",
  networkId: "1", // Ethereum mainnet
  currency: "USD",
  amount: 100,
  merchantName: "My App",
});

// Display in an iframe
if (payment.paymentUrl) {
  const iframe = document.createElement("iframe");
  iframe.src = payment.paymentUrl;
  document.body.appendChild(iframe);
}
```

## Parameters

| Parameter       | Type                       | Description                                                             |
| --------------- | -------------------------- | ----------------------------------------------------------------------- |
| `walletAddress` | `string`                   | The wallet address to receive the purchased crypto.                     |
| `chain`         | `string`                   | The blockchain (e.g., `EVM`).                                           |
| `networkId`     | `string`                   | The network ID (e.g., `1` for Ethereum mainnet, `137` for Polygon).     |
| `currency`      | `string`                   | The fiat currency for payment (e.g., `USD`, `EUR`).                     |
| `amount`        | `number`                   | The amount in fiat currency to spend.                                   |
| `merchantName`  | `string`                   | Your app or merchant name shown to the user.                            |
| `client`        | `DynamicClient` (optional) | The Dynamic client instance. Only required when using multiple clients. |

## Returns

`Promise<CryptoDotComPaymentResponse>` - A promise that resolves to the payment details:

```typescript theme={"system"}
type CryptoDotComPaymentResponse = {
  paymentUrl?: string; // URL to display in iframe or redirect to
  // ... additional payment details
};
```

## Examples

### Embedded iframe experience

```javascript theme={"system"}
import { useState } from "react";
import { createCryptoDotComPayment } from "@dynamic-labs-sdk/client";

const CryptoComPayment = ({ walletAddress }) => {
  const [paymentUrl, setPaymentUrl] = useState(null);

  const handleBuy = async () => {
    const payment = await createCryptoDotComPayment({
      walletAddress,
      chain: "EVM",
      networkId: "137", // Polygon
      currency: "USD",
      amount: 50,
      merchantName: "My DApp",
    });

    if (payment.paymentUrl) {
      setPaymentUrl(payment.paymentUrl);
    }
  };

  if (paymentUrl) {
    return (
      <div>
        <iframe
          src={paymentUrl}
          width="100%"
          height="600px"
          allow="payment"
          title="Crypto.com Payment"
        />
        <button onClick={() => setPaymentUrl(null)}>Cancel</button>
      </div>
    );
  }

  return <button onClick={handleBuy}>Buy with Crypto.com</button>;
};
```

### Open in new window

```javascript theme={"system"}
import { createCryptoDotComPayment } from "@dynamic-labs-sdk/client";

const openCryptoComPayment = async (walletAddress) => {
  const payment = await createCryptoDotComPayment({
    walletAddress,
    chain: "EVM",
    networkId: "1",
    currency: "USD",
    amount: 100,
    merchantName: "My App",
  });

  if (payment.paymentUrl) {
    window.open(payment.paymentUrl, "_blank", "width=500,height=700");
  }
};
```

### With network selection

```javascript theme={"system"}
import { createCryptoDotComPayment } from "@dynamic-labs-sdk/client";

const SUPPORTED_NETWORKS = [
  { id: "1", name: "Ethereum" },
  { id: "137", name: "Polygon" },
  { id: "42161", name: "Arbitrum" },
];

const NetworkSelector = ({ walletAddress, onPaymentCreated }) => {
  const handleSelect = async (networkId) => {
    const payment = await createCryptoDotComPayment({
      walletAddress,
      chain: "EVM",
      networkId,
      currency: "USD",
      amount: 50,
      merchantName: "My App",
    });

    onPaymentCreated(payment);
  };

  return (
    <div>
      <p>Select a network:</p>
      {SUPPORTED_NETWORKS.map((network) => (
        <button key={network.id} onClick={() => handleSelect(network.id)}>
          {network.name}
        </button>
      ))}
    </div>
  );
};
```

## Related functions

* [getCoinbaseBuyUrl](/javascript/reference/client/get-coinbase-buy-url) - Get Coinbase buy URL (redirect flow)
* [createCoinbaseOnrampOrder](/javascript/reference/client/create-coinbase-onramp-order) - Create Coinbase order (embedded flow)
