Skip to main content
External wallets allow users to sign up and log in using their own wallet (MetaMask, Phantom, Coinbase Wallet, etc.).

Setup

1

Create and Initialize the Dynamic Client

First, install the client package and create a Dynamic Client with your environment ID.
npm install @dynamic-labs-sdk/client
import { createDynamicClient } from '@dynamic-labs-sdk/client';

const dynamicClient = createDynamicClient({
  environmentId: 'YOUR_ENVIRONMENT_ID',
  metadata: {
    name: 'YOUR_APP_NAME',
    url: 'YOUR_APP_URL',
    iconUrl: 'YOUR_APP_ICON_URL',
  },
});
See Creating a Dynamic Client for more details.
2

Add Chain Extensions

Install and add the extensions for the chains you want to support. Each extension enables support for wallets on that chain.For EVM wallets (Ethereum, Polygon, etc.):
npm install @dynamic-labs-sdk/evm
import { addEvmExtension } from '@dynamic-labs-sdk/evm';

addEvmExtension();
See Adding EVM Extensions for more options.For Solana wallets:
npm install @dynamic-labs-sdk/solana
import { addSolanaExtension } from '@dynamic-labs-sdk/solana';

addSolanaExtension();
See Adding Solana Extensions for more options.
3

Enable Chains in the Dashboard

Enable the chains you want to support in the Dynamic dashboard:

Fetch Available Wallets

Use getAvailableWalletProvidersData to get a list of wallet providers the user can connect to. Each chain and wallet combination is treated as a separate provider (e.g., metamaskevm, metamasksol, phantomevm, phantomsol).
import { getAvailableWalletProvidersData } from '@dynamic-labs-sdk/client';

const walletProvidersData = getAvailableWalletProvidersData();

walletProvidersData.forEach((provider) => {
  console.log(provider.key);                    // e.g., 'metamaskevm'
  console.log(provider.metadata.displayName);   // e.g., 'MetaMask'
  console.log(provider.groupKey);               // e.g., 'metamask' (for grouping)
  console.log(provider.chain);                  // e.g., 'evm' or 'sol'
});
See Getting Available Wallets to Connect for more details.

Display a Wallet Icon

Each wallet provider includes metadata with its display name and icon. Use this to build your wallet selection UI.
const walletProvidersData = getAvailableWalletProvidersData();

// Example: render wallet buttons
walletProvidersData.map((provider) => (
  <button key={provider.key} onClick={() => handleConnect(provider.key)}>
    <img src={provider.metadata.iconUrl} alt={provider.metadata.displayName} />
    {provider.metadata.displayName}
  </button>
));

Connect to a Wallet

The JS SDK provides three connection methods depending on when you want verification to occur.

1. Connect and verify in one step

The wallet account is only added after a successful verification signature. Use this for login/signup flows.
import { connectAndVerifyWithWalletProvider } from '@dynamic-labs-sdk/client';

const walletAccount = await connectAndVerifyWithWalletProvider({
  walletProviderKey: 'metamaskevm',
});

// walletAccount is now verified and associated to a Dynamic user
console.log(walletAccount.accountAddress);

2. Connect without verifying

The wallet account is added to the session but not yet associated to a Dynamic user. Use this to defer verification.
import { connectWithWalletProvider } from '@dynamic-labs-sdk/client';

const walletAccount = await connectWithWalletProvider({
  walletProviderKey: 'metamaskevm',
});

// walletAccount is connected but not verified (session-only)

3. Verify a previously connected account

Verify a wallet that was connected but not yet verified. This associates it with a Dynamic user.
import { verifyWalletAccount } from '@dynamic-labs-sdk/client';

const verifiedWalletAccount = await verifyWalletAccount({
  walletAccount,
});

// walletAccount now has a verifiedCredentialId and is associated to a Dynamic user
See Connecting and Verifying a Wallet for more details.

Get Connected Wallet Accounts

Retrieve all connected wallet accounts using getWalletAccounts.
import { getWalletAccounts } from '@dynamic-labs-sdk/client';

const walletAccounts = getWalletAccounts();

walletAccounts.forEach((account) => {
  console.log(account.accountAddress);
  console.log(account.verifiedCredentialId); // null if not verified
});
See Getting Wallet Accounts for more details.