Playground

Sign in

Create a login experience tailor-made for your app. Add your wallets of choice, enable web2 sign-in options and create a modal that fits your brand.

Create custom UI using hooks

Build your own connect UI using react hooks.
Wallet state management is all handled for you.

// Using your own UI
import { useConnect } from "thirdweb/react";
import { createWallet } from "thirdweb/wallets";

function App() {
  const { connect } = useConnect();

  return (
    <>
      <button
        onClick={() =>
          connect(async () => {
            // 350+ wallets supported with id autocomplete
            const wallet = createWallet("io.metamask");
            await wallet.connect({ client });
            return wallet;
          })
        }
      >
        Connect with Metamask
      </button>
    </>
  );
}