<ConnectButton />

Detailed guide on using ConnectButton component

0xpass inherits from Rainbowkit's <ConnectButton/> component and allows us to quickly create a embedded wallet aggregator popup.


a) Import the Connect Button into your component

import { ConnectButton } from "0xpass"

b) Place the component where it fits best

export const Component = () => {
  return <ConnectButton />

c) Let's add a bit of styling to the button

import "0xpass/style.css"


labelConnect Wallet<ConnectButton label="Sign in" />
accountStatusfull<ConnectButton accountStatus="avatar" />
chainStatus{ smallScreen: "icon", largeScreen: "full" }<ConnectButton chainStatus="name" />
showBalance{ smallScreen: false, largeScreen: true }<ConnectButton showBalance={false} />

Detailed guide