Playground

The easiest way for users to transact in your app

Onramp users with credit card & cross-chain crypto payments — and generate revenue for each user transaction.

Top Up

Inline component that allows users to buy any currency.
Customize theme, currency, amounts, payment methods and more.

import { PayEmbed } from "thirdweb/react";

function App() {
  return <PayEmbed client={client} />;
}

Commerce

Take paymets from Fiat or Crypto directly to your seller wallet.
Get notified for every sale through webhooks, which lets you trigger any action you want like shipping physical goods, activating services or doing onchain actions.

import { PayEmbed, getDefaultToken } from "thirdweb/react";
import { base } from "thirdweb/chains";

function App() {
  return (
    <PayEmbed
      client={client}
      theme={"light"}
      payOptions={{
        mode: "direct_payment",
        paymentInfo: {
          amount: "35",
          chain: base,
          token: getDefaultToken(base, "USDC"),
          sellerAddress:
            "0xEb0effdFB4dC5b3d5d3aC6ce29F3ED213E95d675",
        },
        metadata: {
          name: "Black Hoodie (Size L)",
          image: "/drip-hoodie.png",
        },
      }}
    />
  );
}

Transactions

Let your users pay for onchain transactions with fiat or crypto on any chain.
Amounts are calculated automatically from the transaction, and will get executed after the user has obtained the necessary funds via onramp or swap.

import { claimTo } from "thirdweb/extensions/erc1155";
import { PayEmbed, useActiveAccount } from "thirdweb/react";

function App() {
  const account = useActiveAccount();
  const { data: nft } = useReadContract(getNFT, {
    contract: nftContract,
    tokenId: 0n,
  });

  return (
    <PayEmbed
      client={client}
      payOptions={{
        mode: "transaction",
        transaction: claimTo({
          contract: nftContract,
          quantity: 1n,
          tokenId: 0n,
          to: account?.address,
        }),
        metadata: nft?.metadata,
      }}
    />
  );
}