Connect Wallet
Connect Wallet is an out-of-the-box UI solution for connecting users' wallets to web3 applications and games. With its customizable UI and extensive wallet options, this component allows for flexibility in supporting various wallet types including non-custodial, custodial, smart wallets, and embedded wallets.
Customizations
The following customizations are available for the Connect Wallet component:
| Prop Name | Description |
|---|---|
| Modal Size | The size of the Connect Wallet modal. |
| Theme | The theme of the Connect Wallet component. The default is "light". |
| Button Title | The title of the Connect Wallet button. |
| Modal Title | The title of the Connect Wallet modal. |
| Custom CSS | Apply custom CSS styles to the Connect Wallet button. |
| Switch To Active Chain | Automatically switch to the active chain when connecting a wallet. |
| Terms Of Service URL | The URL to the terms of service page. |
| Privacy Policy URL | The URL to the privacy policy page. |
| Custom Welcome Screen | Customize the welcome screen on wide modal. |
| Custom Button | Customize the details button. |
| Authorization | Enforce that users must sign in with their wallet. |
| Modal Drop-Down Position | Specify where should the dropdown menu open. |
| Displayed Wallet Providers | Customize the wallets that are displayed. |
Custom Connect Wallet UI
If you want to use the SDK to connect wallets to your app but would like to create a completely custom UI with your own buttons and modals, you can use the available Hooks, Connectors Configurators and functions.
View the Custom Connect Wallet UI documentation..
Build your own wallet connector using the Wallet SDKK and add this wallet to Connect Wallet by following this guide.
Interacting with Contracts
Once you have connected to a wallet, you can interact with contracts using the useContract hook.
import { useContract } from "@thirdweb-dev/react";
const contract = useContract("<contract-address>");
References
By using the thirdweb SDKs, you can easily connect and execute wallet actions.
