Prerequisite You should have installed Node.js (version 18.10.0 or higher).

Step 1. Install NoRamp’s SDK in your favorite frontend framework:

yarn add norampkit

Step 2. Add the following code to your frontend:

import { NoRampCheckout } from "norampkit";

<NoRampCheckout
  priceId="price_id" // Create price in your dashboard or using our API
  testnet // optional param to use testnet, dont include for mainnet
/>;

You are now ready to start receiving payments!

​
Customizing the widget

You can customize the widget by changing the buttonTheme and theme props. Here’s an example of how to change the widget to a dark theme:

import { NoRampCheckout } from "norampkit";

<NoRampCheckout
  priceId="price_id"
  buttonTheme="light" // or use "dark"
  theme="light" // or use "dark"
/>;

​
Customizing the pay button

You can customize the pay button text by changing the type prop. Here’s an example of how to change the button text to “Donate”:

import { NoRampCheckout } from "norampkit";

<NoRampCheckout
  priceId="price_id"
  type="buy" // or "donate" or "book" or "checkout" or "subscribe" ...
/>;