Sei Global Wallet Integration Guide

By logging in with Sei Global Wallet, you agree to our Terms of Use.

Sei Global Wallet is a cross-application embedded crypto wallet powered by Dynamic Global Wallets. It gives users a persistent wallet experience across any integrated dApp in the Sei ecosystem. Users can authenticate and interact with familiar login methods, such as Google, Twitter, or Telegram. They do not need a browser extension or prior crypto knowledge.

Other authentication methods are possible through Dynamic, such as existing wallet apps (for example, MetaMask). However, these methods are not currently enabled.

What is Sei Global Wallet?

Unlike traditional browser extension wallets, Sei Global Wallet is built directly into web applications. Users can authenticate with familiar methods, such as Google, Twitter, Telegram, or email. They do not need to download anything or know about crypto.

Why use Sei Global Wallet?

For users:

The wallet works directly in the browser, without extensions.
Users log in with Google, Twitter, Telegram, or email.
The same wallet works across all Sei ecosystem dApps.
The wallet is self-custodial: users keep full control of their keys.

For developers:

Integration takes one line: a single EIP-6963 import works with RainbowKit, ConnectKit, Web3-React, and other compatible libraries.
@sei-js/sei-global-wallet@2 is ESM-only and has no require() entry. Add the required consumer overrides before you install it.

How to create a Sei Global Wallet account

Go to dashboard.sei.io or any Sei ecosystem dApp.
Click Connect Wallet. Then select Sei Global Wallet.
Choose your preferred login method (Google, X, Telegram, or Email).
Complete the authentication flow.
Your wallet is created automatically. You can use it across all integrated Sei dApps.

How to integrate Sei Global Wallet

Prerequisites

EIP-6963: A standard that lets multiple wallets coexist without conflicts. Instead of competing for window.ethereum, wallets announce themselves through events. Users can then choose which wallet to use. Dynamic: The infrastructure that powers Sei Global Wallet. It handles authentication, key management, and cross-app wallet persistence, and it keeps wallets non-custodial.

Installation

Add the required consumer overrides to your root manifest before you install. Dynamic Global Wallet Client pulls axios and uuid versions with known vulnerabilities. This package cannot push overrides into your app. The npm block pins axios to 1.18.0, uuid to 11.1.1, and ws to 8.21.0 under viem. The Bun block pins only axios and uuid. When Dynamic ships a release that fixes those pins, remove the overrides.

Install the Sei Global Wallet package:

npm install @sei-js/sei-global-wallet

yarn add @sei-js/sei-global-wallet

Import the package to register the wallet:

import '@sei-js/sei-global-wallet/eip6963';

@sei-js/sei-global-wallet@2 is ESM-only. The /eip6963 import still registers the provider. It also exports registerEIP6963Provider, unregisterEIP6963Provider, and eip6963ProviderInfo. Other entrypoints are /ethereum, /solana, and /zerodev.

Make sure that the provider stack of your dApp is configured correctly to interact with the wallet. Importing the package only registers the wallet for discovery. Most wallet connection libraries that support EIP-6963 detect the wallet automatically after the import.

Integration examples

These examples show how to integrate the preconfigured Sei Global Wallet package with different frameworks and wallet provider libraries.

RainbowKit integration

Create a new Vite app:

npm create vite@latest my-sei-dapp -- --template react-ts
cd my-sei-dapp

Install dependencies:

npm install @rainbow-me/rainbowkit wagmi viem @tanstack/react-query @sei-js/sei-global-wallet

Update App.tsx:

import '@rainbow-me/rainbowkit/styles.css';
import '@sei-js/sei-global-wallet/eip6963';

import { ConnectButton, getDefaultConfig, RainbowKitProvider } from '@rainbow-me/rainbowkit';
import { WagmiProvider } from 'wagmi';
import { sei, seiTestnet } from 'wagmi/chains';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { useAccount, useBalance } from 'wagmi';

const config = getDefaultConfig({
  appName: 'My Sei dApp',
  projectId: 'YOUR_WALLETCONNECT_PROJECT_ID',
  chains: [sei, seiTestnet],
  ssr: false
});

const queryClient = new QueryClient();

function AccountInfo() {
  const { address, isConnected, chain } = useAccount();
  const { data: balance } = useBalance({ address });

  if (!isConnected) {
    return <p>Connect your wallet to see account details</p>;
  }

  return (
    <div className="account-info">
      <h3>Account Information</h3>
      <p>
        <strong>Address:</strong> {address}
      </p>
      <p>
        <strong>Network:</strong> {chain?.name}
      </p>
      <p>
        <strong>Balance:</strong> {balance?.formatted} {balance?.symbol}
      </p>
    </div>
  );
}

export default function App() {
  return (
    <WagmiProvider config={config}>
      <QueryClientProvider client={queryClient}>
        <RainbowKitProvider>
          <div className="app-container">
            <h1>My Sei dApp</h1>
            <ConnectButton />
            <AccountInfo />
          </div>
        </RainbowKitProvider>
      </QueryClientProvider>
    </WagmiProvider>
  );
}

Run your app:

npm run dev

ConnectKit integration

Create a new Vite app:

npm create vite@latest my-sei-dapp -- --template react-ts
cd my-sei-dapp

Install dependencies:

npm install connectkit wagmi viem @tanstack/react-query @sei-js/sei-global-wallet

Update App.tsx:

import '@sei-js/sei-global-wallet/eip6963';

import { ConnectKitButton, ConnectKitProvider, getDefaultConfig } from 'connectkit';
import { WagmiProvider, createConfig, http } from 'wagmi';
import { sei, seiTestnet } from 'wagmi/chains';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { useAccount, useBalance } from 'wagmi';

const config = createConfig(
  getDefaultConfig({
    chains: [sei, seiTestnet],
    transports: {
      [sei.id]: http(),
      [seiTestnet.id]: http()
    },
    walletConnectProjectId: 'YOUR_WALLETCONNECT_PROJECT_ID',
    appName: 'My Sei dApp'
  })
);

const queryClient = new QueryClient();

function AccountInfo() {
  const { address, isConnected, chain } = useAccount();
  const { data: balance } = useBalance({ address });

  if (!isConnected) {
    return <p>Connect your wallet to see account details</p>;
  }

  return (
    <div className="account-info">
      <h3>Account Information</h3>
      <p>
        <strong>Address:</strong> {address}
      </p>
      <p>
        <strong>Network:</strong> {chain?.name}
      </p>
      <p>
        <strong>Balance:</strong> {balance?.formatted} {balance?.symbol}
      </p>
    </div>
  );
}

export default function App() {
  return (
    <WagmiProvider config={config}>
      <QueryClientProvider client={queryClient}>
        <ConnectKitProvider>
          <div className="app-container">
            <h1>My Sei dApp</h1>
            <ConnectKitButton />
            <AccountInfo />
          </div>
        </ConnectKitProvider>
      </QueryClientProvider>
    </WagmiProvider>
  );
}

Run your app:

npm run dev

Web3-React v8 integration

Create a new Vite app:

npm create vite@latest my-sei-dapp -- --template react-ts
cd my-sei-dapp

Install dependencies:

npm install @web3-react/core @web3-react/eip1193 @web3-react/types @sei-js/sei-global-wallet

Update App.tsx:

import '@sei-js/sei-global-wallet/eip6963';

import React, { useEffect, useState } from 'react';
import { Web3ReactProvider, initializeConnector } from '@web3-react/core';
import { EIP1193 } from '@web3-react/eip1193';

interface EIP6963ProviderInfo {
  uuid: string;
  name: string;
  icon: string;
  rdns: string;
}

interface EIP6963ProviderDetail {
  info: EIP6963ProviderInfo;
  provider: any;
}

function findSeiGlobalWallet(): any {
  if (typeof window === 'undefined') return null;

  const providers = new Map<string, EIP6963ProviderDetail>();

  const handleProviderAnnouncement = (event: Event) => {
    const customEvent = event as CustomEvent<EIP6963ProviderDetail>;
    providers.set(customEvent.detail.info.uuid, customEvent.detail);
  };

  window.addEventListener('eip6963:announceProvider', handleProviderAnnouncement as EventListener);

  window.dispatchEvent(new Event('eip6963:requestProvider'));
  window.removeEventListener('eip6963:announceProvider', handleProviderAnnouncement);

  for (const [uuid, provider] of providers) {
    if (provider.info.name.toLowerCase().includes('sei') || provider.info.rdns.includes('sei')) {
      return provider.provider;
    }
  }
}

export const [eip6963Connector, eip6963Hooks] = initializeConnector<EIP1193>((actions) => {
  const seiProvider = findSeiGlobalWallet();
  return new EIP1193({ actions, provider: seiProvider });
});

const connectors: [EIP1193, typeof eip6963Hooks][] = [[eip6963Connector, eip6963Hooks]];

function InnerApp() {
  const { useAccount, useChainId, useIsActive } = eip6963Hooks;
  const account = useAccount();
  const chainId = useChainId();
  const isActive = useIsActive();
  const [isConnecting, setIsConnecting] = useState(false);

  useEffect(() => {
    const autoConnect = async () => {
      try {
        setIsConnecting(true);
        await eip6963Connector.activate();
      } catch (err) {
        console.error('Failed to connect Sei Global Wallet', err);
      } finally {
        setIsConnecting(false);
      }
    };
    autoConnect();
  }, []);

  if (!isActive) {
    return (
      <div>
        <h3>{isConnecting ? 'Connecting to Sei Global Wallet…' : 'Not Connected'}</h3>
        {!isConnecting && (
          <button onClick={() => eip6963Connector.activate()} className="connect-button">
            Connect Sei Global Wallet
          </button>
        )}
      </div>
    );
  }

  return (
    <div className="connected-info">
      <h2>✅ Connected to Sei Global Wallet!</h2>
      <p>
        <strong>Account:</strong> <code>{account}</code>
      </p>
      <p>
        <strong>Chain ID:</strong> <code>{chainId}</code>
      </p>

      <button
        onClick={() => {
          if (eip6963Connector?.deactivate) {
            eip6963Connector.deactivate();
          } else {
            eip6963Connector.resetState();
          }
        }}
        className="disconnect-button">
        Disconnect
      </button>
    </div>
  );
}

export default function App() {
  return (
    <Web3ReactProvider connectors={connectors}>
      <div className="app-container">
        <h1>Sei Global Wallet via EIP-6963 Discovery</h1>
        <p>This app targets the Sei Global Wallet using EIP-6963 discovery</p>
        <InnerApp />
      </div>
    </Web3ReactProvider>
  );
}

Run your app:

npm run dev

wagmi + Dynamic integration

Create a new Vite app:

npm create vite@latest my-sei-dapp -- --template react-ts
cd my-sei-dapp

Install dependencies:

npm install @dynamic-labs/sdk-react-core \
  @dynamic-labs/wagmi-connector @dynamic-labs/ethereum \
  wagmi viem @tanstack/react-query @sei-js/sei-global-wallet

Update App.tsx:

import React from 'react';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { createConfig, WagmiProvider, useAccount } from 'wagmi';
import { http } from 'viem';
import { sei, seiTestnet } from 'viem/chains';

// Dynamic imports
import { DynamicContextProvider, DynamicWidget } from '@dynamic-labs/sdk-react-core';
import { DynamicWagmiConnector } from '@dynamic-labs/wagmi-connector';
import { EthereumWalletConnectors } from '@dynamic-labs/ethereum';

// Import Sei Global Wallet for EIP-6963 discovery
import '@sei-js/sei-global-wallet/eip6963';

const queryClient = new QueryClient();

const wagmiConfig = createConfig({
  chains: [sei, seiTestnet],
  transports: {
    [sei.id]: http('https://evm-rpc.sei-apis.com'),
    [seiTestnet.id]: http('https://evm-rpc-testnet.sei-apis.com')
  }
});

export default function App() {
  return (
    <DynamicContextProvider
      settings={{
        environmentId: 'REPLACE-WITH-YOUR-ENVIRONMENT-ID', // <- Replace
        walletConnectors: [EthereumWalletConnectors],
        overrides: {
          evmNetworks: (networks) => [
            ...networks,
            {
              blockExplorerUrls: ['https://seiscan.io'],
              chainId: 1329,
              chainName: 'Sei Network',
              iconUrls: ['https://app.dynamic.xyz/assets/networks/sei.svg'],
              name: 'Sei',
              nativeCurrency: {
                decimals: 18,
                name: 'Sei',
                symbol: 'SEI'
              },
              networkId: 1329,
              rpcUrls: ['https://evm-rpc.sei-apis.com'],
              vanityName: 'Sei Mainnet'
            },
            {
              blockExplorerUrls: ['https://testnet.seiscan.io'],
              chainId: 1328,
              chainName: 'Sei Testnet',
              iconUrls: ['https://app.dynamic.xyz/assets/networks/sei.svg'],
              name: 'Sei Testnet',
              nativeCurrency: {
                decimals: 18,
                name: 'Sei',
                symbol: 'SEI'
              },
              networkId: 1328,
              rpcUrls: ['https://evm-rpc-testnet.sei-apis.com'],
              vanityName: 'Sei Testnet'
            }
          ]
        }
      }}>
      <WagmiProvider config={wagmiConfig}>
        <QueryClientProvider client={queryClient}>
          <DynamicWagmiConnector>
            <div className="app-container">
              <h1>Dynamic + Wagmi + Sei Global Wallet</h1>
              <DynamicWidget />
              <AccountInfo />
            </div>
          </DynamicWagmiConnector>
        </QueryClientProvider>
      </WagmiProvider>
    </DynamicContextProvider>
  );
}

function AccountInfo() {
  const { address, isConnected, chain } = useAccount();

  if (!isConnected) {
    return <p>Connect your wallet to see account info</p>;
  }

  return (
    <div className="account-info">
      <h3>Account Information</h3>
      <p>
        <strong>Address:</strong> {address}
      </p>
      <p>
        <strong>Chain:</strong> {chain?.name} (ID: {chain?.id})
      </p>
      <p>
        <strong>Connected:</strong> {isConnected ? 'Yes' : 'No'}
      </p>
    </div>
  );
}

Run your app:

npm run dev

Note: Replace "REPLACE-WITH-YOUR-ENVIRONMENT-ID" with your Dynamic environment ID from your Dynamic dashboard.

Dynamic (Next.js) integration

Create a new Next.js app:

npx create-next-app@latest my-sei-dapp --typescript --tailwind --eslint
cd my-sei-dapp

Install dependencies:

npm install @dynamic-labs/sdk-react-core \
  @dynamic-labs/wagmi-connector wagmi viem \
  @tanstack/react-query @sei-js/sei-global-wallet \
  @dynamic-labs/ethereum

layout.tsx:

'use client';

import './globals.css';
import { Inter } from 'next/font/google';
import Providers from './lib/providers';
const inter = Inter({ subsets: ['latin'] });

// Import the global wallet implementation
import '@sei-js/sei-global-wallet/eip6963';

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <body className={inter.className}>
        <Providers>{children}</Providers>
      </body>
    </html>
  );
}

lib/providers.tsx:

'use client';

import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { createConfig, WagmiProvider } from 'wagmi';
import { http } from 'viem';
import { sei, seiTestnet } from 'viem/chains';

// Dynamic imports
import { DynamicContextProvider, DynamicWidget } from '@dynamic-labs/sdk-react-core';
import { DynamicWagmiConnector } from '@dynamic-labs/wagmi-connector';
import { EthereumWalletConnectors } from '@dynamic-labs/ethereum';

// Import Sei Global Wallet for EIP-6963 discovery
import '@sei-js/sei-global-wallet/eip6963';

const queryClient = new QueryClient();

const wagmiConfig = createConfig({
  chains: [sei, seiTestnet],
  transports: {
    [sei.id]: http('https://evm-rpc.sei-apis.com'),
    [seiTestnet.id]: http('https://evm-rpc-testnet.sei-apis.com')
  }
});

export default function Providers({ children }: { children: React.ReactNode }) {
  return (
    <DynamicContextProvider
      settings={{
        environmentId: 'REPLACE-WITH-YOUR-ENVIRONMENT-ID', // Replace with your environmentId
        walletConnectors: [EthereumWalletConnectors],
        overrides: {
          evmNetworks: (networks) => [
            ...networks,
            {
              blockExplorerUrls: ['https://seiscan.io'],
              chainId: 1329,
              chainName: 'Sei Network',
              iconUrls: ['https://app.dynamic.xyz/assets/networks/sei.svg'],
              name: 'Sei',
              nativeCurrency: {
                decimals: 18,
                name: 'Sei',
                symbol: 'SEI'
              },
              networkId: 1329,
              rpcUrls: ['https://evm-rpc.sei-apis.com'],
              vanityName: 'Sei Mainnet'
            },
            {
              blockExplorerUrls: ['https://testnet.seiscan.io'],
              chainId: 1328,
              chainName: 'Sei Testnet',
              iconUrls: ['https://app.dynamic.xyz/assets/networks/sei.svg'],
              name: 'Sei Testnet',
              nativeCurrency: {
                decimals: 18,
                name: 'Sei',
                symbol: 'SEI'
              },
              networkId: 1328,
              rpcUrls: ['https://evm-rpc-testnet.sei-apis.com'],
              vanityName: 'Sei Testnet'
            }
          ]
        }
      }}>
      <WagmiProvider config={wagmiConfig}>
        <QueryClientProvider client={queryClient}>
          <DynamicWagmiConnector>{children}</DynamicWagmiConnector>
        </QueryClientProvider>
      </WagmiProvider>
    </DynamicContextProvider>
  );
}

Note: Replace "REPLACE-WITH-YOUR-ENVIRONMENT-ID" with your Dynamic environment ID from your Dynamic dashboard.page.tsx:

'use client';

import { DynamicWidget } from '@dynamic-labs/sdk-react-core';
import { useAccount, useBalance } from 'wagmi';

export default function Home() {
  return (
    <main className="container mx-auto px-4 py-8">
      <div className="max-w-2xl mx-auto space-y-6">
        <h1 className="text-3xl font-bold text-center">Dynamic with Next.js</h1>

        <div className="flex justify-center">
          <DynamicWidget />
        </div>
      </div>
    </main>
  );
}

Run your app:

npm run dev

HTML bundle integration

If your project uses plain HTML and JavaScript without a build system, you can create a bundled version of Sei Global Wallet. You can then include it directly in your HTML pages.Create a bundle directory

mkdir sei-global-wallet-bundle
cd sei-global-wallet-bundle

Initialize an npm project

npm init -y

Install dependencies

npm install @sei-js/sei-global-wallet

npm install --save-dev esbuild

Create a bundle source file Create bundle.js:

// bundle.js
import '@sei-js/sei-global-wallet/eip6963';

Update package.json Add this build script to your package.json file:

{
  "scripts": {
    "build": "esbuild bundle.js --bundle --format=iife --outfile=sei-wallet-bundled.js"
  }
}

Build the bundle

npm run build

This command creates sei-wallet-bundled.js.Use the bundle in your HTML projectCopy sei-wallet-bundled.js to your web project. Then load it in your HTML, as in this example:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Sei Global Wallet HTML Integration</title>
  </head>
  <body>
    <h1>Sei Global Wallet HTML Integration</h1>
    <p>Connect your Sei Global Wallet using plain HTML and JavaScript.</p>

    <button onclick="scanForWallets()" id="scanBtn">🔍 Scan for Wallets</button>
    <button onclick="connectToSei()" id="connectBtn" disabled>🔗 Connect to Sei</button>

    <div id="walletList"></div>
    <div id="accountInfo"></div>

    <!-- Load the bundled Sei wallet file -->
    <script src="./sei-wallet-bundled.js"></script>

    <script>
      let detectedWallets = [];

      function scanForWallets() {
        console.log('Scanning for EIP-6963 wallets...');
        detectedWallets = [];

        document.getElementById('walletList').innerHTML = '<p>Scanning for wallets...</p>';

        const handleWalletAnnouncement = (event) => {
          const wallet = event.detail;
          if (!detectedWallets.find((w) => w.info.uuid === wallet.info.uuid)) {
            detectedWallets.push(wallet);
            updateWalletList();
          }
        };

        window.addEventListener('eip6963:announceProvider', handleWalletAnnouncement);
        window.dispatchEvent(new Event('eip6963:requestProvider'));

        setTimeout(() => {
          window.removeEventListener('eip6963:announceProvider', handleWalletAnnouncement);
          if (detectedWallets.length === 0) {
            document.getElementById('walletList').innerHTML = '<p>No wallets detected</p>';
          }
        }, 2000);
      }

      function updateWalletList() {
        const walletListDiv = document.getElementById('walletList');
        walletListDiv.innerHTML =
          `<h3>Detected Wallets:</h3>` +
          detectedWallets
            .map((wallet) => {
              const isSeiWallet = wallet.info.name.toLowerCase().includes('sei');
              return `<div>
                        <strong>${wallet.info.name}</strong> ${isSeiWallet ? '🎯' : ''}
                        <br><small>${wallet.info.rdns}</small>
                    </div>`;
            })
            .join('');

        const seiWallet = detectedWallets.find((w) => w.info.name.toLowerCase().includes('sei'));
        if (seiWallet) {
          document.getElementById('connectBtn').disabled = false;
        }
      }

      async function connectToSei() {
        const seiWallet = detectedWallets.find((w) => w.info.name.toLowerCase().includes('sei'));

        if (!seiWallet) {
          console.error('No Sei wallet found');
          return;
        }

        try {
          const accounts = await seiWallet.provider.request({
            method: 'eth_requestAccounts'
          });

          if (accounts && accounts.length > 0) {
            document.getElementById('accountInfo').innerHTML = `
                        <div>
                            <h3>👤 Connected Account</h3>
                            <p><strong>Wallet:</strong> ${seiWallet.info.name}</p>
                            <p><strong>Address:</strong> ${accounts[0]}</p>
                            <p><strong>Status:</strong> ✅ Connected successfully!</p>
                        </div>`;
          }
        } catch (error) {
          alert(`Connection failed: ${error.message}`);
        }
      }

      window.addEventListener('load', () => {
        setTimeout(scanForWallets, 500);
      });
    </script>
  </body>
</html>

Web3Auth integration

Create a new Vite app:

npm create vite@latest my-sei-dapp -- --template react-ts
cd my-sei-dapp

Install dependencies:

npm install @web3auth/modal \
  wagmi viem @tanstack/react-query \
  @sei-js/sei-global-wallet

Create a Web3Auth context (src/web3authContext.ts):

import '@sei-js/sei-global-wallet/eip6963';
import { WEB3AUTH_NETWORK } from '@web3auth/modal';
import { type Web3AuthContextConfig } from '@web3auth/modal/react';

const clientId = 'YOUR_CLIENT_ID'; // get from https://dashboard.web3auth.io

const web3AuthContextConfig: Web3AuthContextConfig = {
  web3AuthOptions: {
    clientId,
    web3AuthNetwork: WEB3AUTH_NETWORK.SAPPHIRE_DEVNET
  }
};

export default web3AuthContextConfig;

Update App.tsx:

import './App.css';
import '@sei-js/sei-global-wallet/eip6963';
import { useWeb3AuthConnect, useWeb3AuthUser } from '@web3auth/modal/react';
import { useWeb3AuthDisconnect } from '@web3auth/modal/react';
import { useAccount } from 'wagmi';

function App() {
  const { connect, isConnected, connectorName } = useWeb3AuthConnect();

  const { loading: connectLoading, error: connectError } = useWeb3AuthConnect();

  const { disconnect, loading: disconnectLoading } = useWeb3AuthDisconnect();

  const { error: disconnectError } = useWeb3AuthDisconnect();

  const { userInfo } = useWeb3AuthUser();
  const { address } = useAccount();

  function uiConsole(...args: any[]): void {
    const el = document.querySelector('#console>p');
    if (el) {
      el.innerHTML = JSON.stringify(args || {}, null, 2);
      console.log(...args);
    }
  }
  const loggedInView = (
    <div className="grid">
      <h2>Connected to {connectorName}</h2>
      <div className="account-info">
        <p>
          <strong>Address:</strong> {address}
        </p>
      </div>

      <div className="flex-container">
        <button onClick={() => uiConsole(userInfo)} className="card">
          Get User Info
        </button>

        <button onClick={() => disconnect()} className="card">
          Log Out
        </button>
      </div>

      {disconnectLoading && <div className="loading">Disconnecting...</div>}
      {disconnectError && <div className="error">{disconnectError.message}</div>}
    </div>
  );

  const unloggedInView = (
    <div className="grid">
      <button onClick={() => connect()} className="card">
        Connect with Web3Auth
      </button>
      {connectLoading && <div className="loading">Connecting...</div>}
      {connectError && <div className="error">{connectError.message}</div>}
    </div>
  );

  return (
    <div className="container">
      <h1 className="title">
        <a target="_blank" href="https://web3auth.io/docs/sdk/pnp/web/modal" rel="noreferrer">
          Web3Auth
        </a>{' '}
        + Sei Global Wallet Integration
      </h1>

      {isConnected ? loggedInView : unloggedInView}

      <div id="console" style={{ whiteSpace: 'pre-line' }}>
        <p style={{ whiteSpace: 'pre-line' }}></p>
      </div>
    </div>
  );
}

export default App;

Set up main.tsx with the Web3Auth provider:

import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
import { Web3AuthProvider } from '@web3auth/modal/react';
import { WagmiProvider } from 'wagmi';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { createConfig, http } from 'wagmi';
import { sei, seiTestnet } from 'wagmi/chains';
import web3AuthContextConfig from './web3authContext';
import App from './App';

const queryClient = new QueryClient();

const wagmiConfig = createConfig({
  chains: [sei, seiTestnet],
  transports: {
    [sei.id]: http('https://evm-rpc.sei-apis.com'),
    [seiTestnet.id]: http('https://evm-rpc-testnet.sei-apis.com')
  }
});

createRoot(document.getElementById('root')!).render(
  <StrictMode>
    <Web3AuthProvider config={web3AuthContextConfig}>
      <WagmiProvider config={wagmiConfig}>
        <QueryClientProvider client={queryClient}>
          <App />
        </QueryClientProvider>
      </WagmiProvider>
    </Web3AuthProvider>
  </StrictMode>
);

Run your app:

npm run dev

Note: Replace the clientId in web3authContext.ts with your Web3Auth client ID from your Web3Auth dashboard.

Troubleshooting & FAQ

Troubleshooting
FAQ

Troubleshooting & debugging tips

Common issues

Issue: Sei Global Wallet does not appear in the wallet list

# Ensure the import is at the top of your App.tsx
import '@sei-js/sei-global-wallet/eip6963';

Issue: TypeScript errors about window.ethereum

// Add this to your App.tsx or create types/global.d.ts
declare global {
  interface Window {
    ethereum?: any;
  }
}

Issue: WalletConnect connection fails

# Get a proper project ID from cloud.walletconnect.com
# Replace 'YOUR_WALLETCONNECT_PROJECT_ID' with your actual ID

Issue: Network not found in MetaMask

// Use the exact chainId in hex format
chainId: '0x531'; // for Sei Mainnet (1329)
chainId: '0x530'; // for Sei Testnet (1328)

Debugging commands

window.addEventListener('eip6963:announceProvider', (event) => {
  console.log('Wallet announced:', event.detail);
});

window.dispatchEvent(new Event('eip6963:requestProvider'));

Testing tips

Test with multiple browsers to check cross-browser compatibility.
If wallets do not appear, clear the browser cache.
Check the browser console for EIP-6963 events and errors.
Test connections to both Sei Testnet and Sei Mainnet.
Verify that social login methods work across different authentication providers.

Security considerations

Sei Global Wallet is self-custodial: users control their private keys.
All communications between the dApp and the wallet are encrypted.
Multi-factor authentication is available for extra security.
Users can export their keys to other wallets, such as MetaMask.
Cure53 has audited the platform for security compliance.

FAQ

Q: What is Sei Global Wallet?

Sei Global Wallet is an embedded wallet for the Sei network. Users create a wallet and authenticate through social logins. Unlike traditional embedded wallets, Sei Global Wallet gives users more flexibility: they can carry their wallets across different dApps in the Sei ecosystem.

Q: What are the key benefits of Sei Global Wallet for developers and users?

For developers:

You can add Sei as a login method to your dApp (“Log in with Sei”).
Integration is simple. The wallet is compatible with tools such as RainbowKit, ConnectKit, and Web3-React.
Multi-factor authentication (MFA) and secure key management improve security.

For users:

Users create wallets with familiar social logins, which simplifies onboarding.
Users can move between Sei ecosystem dApps with the same wallet.
Transaction simulation helps users understand the effects of a transaction before they confirm it.

Sei Global Wallet supports email, Google, X (Twitter), and Telegram authentication.

Q: How do the security considerations differ from traditional wallets?

Security differences include:

Secure encrypted communication: All communication between the dApp and the wallet popup is encrypted.
Protection against replay attacks: Encrypted messaging prevents malicious reuse of data.
Trusted Execution Environments (TEEs): Operations occur in secure environments.
Verified origins: Only verified origins can interact with Sei Global Wallet.

Q: Is Sei Global Wallet self-custodial or custodial?

Sei Global Wallet is self-custodial, so users have full control. Users can export their keys at any time and import them into other wallets, such as MetaMask.

Q: Do Sei Global Wallet require browser extensions?

No. They are embedded wallets that work directly in the browser, without extensions.

Q: Can I link my existing external wallet to my Sei Global Wallet?

No, not currently. In the future, you will be able to link external wallets to a Sei global account.

Q: What extra protections can I add to my Sei Global Wallet?

Although Global Wallets are non-custodial, good security practices include:

Enable multi-factor authentication (MFA) for sensitive actions.
Be careful of phishing attempts. Verify sources before you share information.
Always have backup methods. Link more email or social login methods.
Never store authentication keys digitally. Keep private keys secure and offline.

Q: Have Sei Global Wallet been audited?

Yes. Cure53 has audited the Dynamic Global Wallets product.

Q: How should bugs be reported?

Include this information:

Device details
Browser information
A clear description of the issue
If possible, a Loom video or screen recording

Overview

Essentials

seid CLI

Frontend Development

Smart Contracts

sei-js Library

Videos

Ecosystem Tutorials

Reference

Hardware Wallets

Sei Global Wallet Integration Guide

What is Sei Global Wallet?

Why use Sei Global Wallet?

How to create a Sei Global Wallet account

How to integrate Sei Global Wallet

Prerequisites

Installation

Integration examples

Troubleshooting & FAQ

Troubleshooting & debugging tips

Common issues

Debugging commands

Testing tips

Security considerations

FAQ

Q: What is Sei Global Wallet?

Q: What are the key benefits of Sei Global Wallet for developers and users?

Q: How do the security considerations differ from traditional wallets?

Q: Is Sei Global Wallet self-custodial or custodial?

Q: Do Sei Global Wallet require browser extensions?

Q: Can I link my existing external wallet to my Sei Global Wallet?

Q: What extra protections can I add to my Sei Global Wallet?

Q: Have Sei Global Wallet been audited?

Q: How should bugs be reported?

References and links

​What is Sei Global Wallet?

​Why use Sei Global Wallet?

​How to create a Sei Global Wallet account

​How to integrate Sei Global Wallet

​Prerequisites

​Installation

​Integration examples

​Troubleshooting & FAQ

​Troubleshooting & debugging tips

​Common issues

​Debugging commands

​Testing tips

​Security considerations

​FAQ

​Q: What is Sei Global Wallet?

​Q: What are the key benefits of Sei Global Wallet for developers and users?

​Q: What login methods are currently supported?

​Q: How do the security considerations differ from traditional wallets?

​Q: Is Sei Global Wallet self-custodial or custodial?

​Q: Do Sei Global Wallet require browser extensions?

​Q: Can I link my existing external wallet to my Sei Global Wallet?

​Q: What extra protections can I add to my Sei Global Wallet?

​Q: Have Sei Global Wallet been audited?

​Q: How should bugs be reported?

​References and links

What is Sei Global Wallet?

Why use Sei Global Wallet?

How to create a Sei Global Wallet account

How to integrate Sei Global Wallet

Prerequisites

Installation

Integration examples

Troubleshooting & FAQ

Troubleshooting & debugging tips

Common issues

Debugging commands

Testing tips

Security considerations

FAQ

Q: What is Sei Global Wallet?

Q: What are the key benefits of Sei Global Wallet for developers and users?

Q: What login methods are currently supported?

Q: How do the security considerations differ from traditional wallets?

Q: Is Sei Global Wallet self-custodial or custodial?

Q: Do Sei Global Wallet require browser extensions?

Q: Can I link my existing external wallet to my Sei Global Wallet?

Q: What extra protections can I add to my Sei Global Wallet?

Q: Have Sei Global Wallet been audited?

Q: How should bugs be reported?

References and links