Comment on page
Customization
Apply various customizations to the Wallet Kit UI
Custom configuration can be applied using the Wallet Kit Provider:
...
<ArweaveWalletKit
config={{
permissions: ["ACCESS_ADDRESS"],
ensurePermissions: true,
...
}}
theme={{
accent: { r: 255, g: 0, b: 0 },
...
}}
>
<YourApp />
</ArweaveWalletKit>
...
Using the
config
field of the <ArweaveWalletKit>
provider component, you can define a name, a logo or the required permissions for your app. The following options are available:Prop | Type | Default | Description |
---|---|---|---|
permissions | [] | Permissions to connect with. | |
ensurePermissions | boolean | false | Ensure that all required permissions are present. If false, it only checks if the app has any permissions. |
appInfo | {} | Information about your app (name/logo). | |
gatewayConfig | arweave.net gateway | Configuration for the Arweave gateway to use. |
With the
theme
field, you can define a custom theme configuration for the Arweave Wallet Kit modals and buttons. The following options are available:Prop | Type | Description |
---|---|---|
displayTheme | "dark" , "light" | UI display theme to use |
accent | RGBObject | RGB accent color for the UI |
titleHighlight | RGBObject | RGB accent color for the subscreen titles (like the connection screen) |
radius | "default" , "minimal" , "none" | Border radius level used throughout the Kit UI |
Last modified 5mo ago