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,
}}
/>
);
}