`<OnchainKitProvider />`

Provides the OnchainKit React Context to the app.

Usage

import { base } from 'viem/chains';
import { OnchainKitProvider } from '@coinbase/onchainkit';
 
const App = () => {
  return (
    <OnchainKitProvider
      config={{
        appearance: {
          name: 'OnchainKit Playground',
          logo: 'https://onchainkit.xyz/favicon/48x48.png?v4-19-24',
          mode: 'auto',
          theme: 'default',
        },
      }}
      chain={base}
    >
      <MyComponent />
    </OnchainKitProvider>
  );
};

Props

OnchainKitProviderReact

Prop	Description	Required
`chain`	The chain that your OnchainKit project supports.	Yes
`apiKey`	Client API Key from Coinbase Developer Platform.	No
`rpcUrl`	RPC URL for onchain requests.	No
`projectId`	Your Coinbase Developer Platform Project ID.	No
`config`	- `config.appearance` — customized your OnchainKit project's appearance - `config.paymaster` — Paymaster URL for gas sponsorship	No
`schemaId`	[Deprecation Pending] The schema ID for attestations from the Ethereum Attestation Service (EAS).	No
`address`	[Deprecation Pending] This prop is no longer used.	No

Chain

chain specifies the chain on which your OnchainKit project will operate.

This prop is required for all OnchainKit components.

We recommend importing chain data from viem.

`apiKey`

apiKey is your Coinbase Developer Platform Client API Key.

This prop is required for most OnchainKit components, including:

You can get a Client API Key from Coinbase Developer Platform.

RPC URL

rpcUrl is required for any onchain requests. If you provide your own RPC URL, OnchainKit will use it.

If you do not provide your own RPC URL, you must provide an apiKey, which enables OnchainKit to use the Coinbase Developer Platform Node.

Project ID

projectId is your Coinbase Developer Platform Project ID.

This prop is required for the <FundButton /> component.

You can obtain a Project ID from the Coinbase Developer Platform.

Config

config is an object that can be used to customize the appearance and behavior of the OnchainKit components.

This prop has two keys: appearance and paymaster.

Appearance

appearance manages the appearance of the OnchainKit components and has the following properties:

name — The name of your OnchainKit project
logo — The URL of the logo for your OnchainKit project
mode — The mode of the OnchainKit components. Can be auto, dark, or light.
theme — The theme of the OnchainKit components. Can be base, cyberpunk, default, hacker, or a custom theme.

Explore appearance options in the OnchainKit Playground.

Paymaster

paymaster represents the Paymaster URL that enables you to sponsor gas for your users.

You can configure your Paymaster and obtain your Paymaster URL from the Coinbase Developer Platform.

Address [Deprecation Pending]

address is no longer used and will be removed in a future version of OnchainKit.

Schema ID [Deprecation Pending]

schemaId is no longer used as OnchainKit now defaults to using Coinbase attestations for the <Badge /> component.

This prop will be removed in a future version of OnchainKit.