Overview use-wallet supports a wide range of Algorand wallet providers. Each wallet can be configured with specific options and custom metadata.
Wallet IDs All supported wallets are identified by the WalletId enum:
enum WalletId { BIATEC = 'biatec' , DEFLY = 'defly' , DEFLY_WEB = 'defly-web' , CUSTOM = 'custom' , EXODUS = 'exodus' , KIBISIS = 'kibisis' , KMD = 'kmd' , LUTE = 'lute' , MAGIC = 'magic' , MNEMONIC = 'mnemonic' , PERA = 'pera' , WALLETCONNECT = 'walletconnect' , WEB3AUTH = 'web3auth' , W3_WALLET = 'w3-wallet' }
Configuration Wallets can be configured in two ways:
Pass just the wallet ID: import { WalletManager , WalletId } from '@txnlab/use-wallet' const manager = new WalletManager ({ wallets: [ WalletId . PERA , WalletId . DEFLY , WalletId . EXODUS ] })
Pass a configuration object with options and custom metadata: const manager = new WalletManager ({ wallets: [ { id: WalletId . WALLETCONNECT , options: { projectId: 'your-project-id' , themeMode: 'dark' }, metadata: { name: 'WalletConnect v2' , icon: 'data:image/svg+xml;base64,...' } } ] })
Mobile wallets (WalletConnect) Pera Official Pera mobile wallet with WalletConnect support. Options: interface PeraWalletConnectOptions { bridge ?: string shouldShowSignTxnToast ?: boolean chainId ?: 416001 | 416002 | 416003 | 4160 compactMode ?: boolean }
Peer dependency: npm install @perawallet/connect
Example: { id : WalletId . PERA , options : { shouldShowSignTxnToast : true , compactMode : false } }
Defly Official Defly mobile wallet with WalletConnect support. Options: interface DeflyWalletConnectOptions { bridge ?: string shouldShowSignTxnToast ?: boolean chainId ?: 416001 | 416002 | 416003 | 4160 }
Peer dependency: npm install @blockshake/defly-connect
Example: Lute Lute mobile wallet with WalletConnect support. Options: interface LuteConnectOptions { siteName ?: string }
Peer dependency: Example: { id : WalletId . LUTE , options : { siteName : 'My dApp' } }
WalletConnect (generic) Generic WalletConnect v2 integration. Works with any WalletConnect-compatible Algorand wallet. Options: interface WalletConnectOptions { projectId : string // Required from WalletConnect Cloud relayUrl ?: string metadata ?: { name ?: string description ?: string url ?: string icons ?: string [] } // Optional skin for branding skin ?: string | WalletConnectSkin // Modal customization enableExplorer ?: boolean explorerRecommendedWalletIds ?: string [] privacyPolicyUrl ?: string termsOfServiceUrl ?: string themeMode ?: 'dark' | 'light' themeVariables ?: Record < string , string > }
Peer dependencies: npm install @walletconnect/modal @walletconnect/sign-client
Example: { id : WalletId . WALLETCONNECT , options : { projectId : 'abc123' , themeMode : 'dark' } }
WalletConnect skins The generic WalletConnect provider supports “skins” to brand the integration for specific wallets:
// Built-in skins { id : WalletId . WALLETCONNECT , options : { projectId : 'abc123' , skin : 'biatec' // or 'voiwallet' } } // Custom skin import { registerSkin } from '@txnlab/use-wallet' registerSkin ({ id: 'mywallet' , name: 'My Custom Wallet' , icon: 'data:image/svg+xml;base64,...' }) // Then use it { id : WalletId . WALLETCONNECT , options : { projectId : 'abc123' , skin : 'mywallet' } }
Built-in skins:
biatec - Biatec Walletvoiwallet - Voi Wallet
Biatec Deprecated : BiatecWallet is deprecated and will be removed in v5. Use WalletConnect with the 'biatec' skin instead.
Convenience wrapper for WalletConnect with Biatec branding. Equivalent to using WalletId.WALLETCONNECT with skin: 'biatec'. Migration: // Use this instead: { id : WalletId . WALLETCONNECT , options : { projectId : 'YOUR_PROJECT_ID' , skin : 'biatec' } }
Options: Same as WalletConnectOptions (projectId required)Peer dependencies: npm install @walletconnect/modal @walletconnect/sign-client
W3 Wallet W3 Wallet browser extension integration. Options: NoneNote: No additional dependencies required. Users must have the W3 Wallet browser extension installed.
Browser extension wallets Exodus Exodus browser extension wallet. Options: interface ExodusOptions { // No options currently }
Peer dependency: npm install @exodus/algorand-connector
Example: Kibisis Kibisis browser extension wallet. Options: NonePeer dependency: npm install @agoralabs-sh/avm-web-provider
Example: Web wallets Defly Web Defly web wallet integration using ARC-0027 (AVM Web Provider) standard. Options: NonePeer dependency: npm install @agoralabs-sh/avm-web-provider
Example: Authentication wallets Magic Magic Link authentication (email-based wallet). Options: interface MagicAuthOptions { apiKey : string // Required }
Peer dependencies: npm install magic-sdk @magic-ext/algorand
Example: { id : WalletId . MAGIC , options : { apiKey : 'pk_live_...' } }
Special connect requirements: // Magic requires passing an email to connect() await magicWallet . connect ({ email: 'user@example.com' })
Web3Auth Web3Auth social login integration. Options: interface Web3AuthOptions { clientId : string // Required // Additional Web3Auth configuration }
Peer dependency: npm install @web3auth/modal @web3auth/base
Example: { id : WalletId . WEB3AUTH , options : { clientId : 'your-client-id' } }
Development wallets KMD Algorand Key Management Daemon for local development. Options: interface KmdOptions { token ?: string | algosdk . KMDTokenHeader | algosdk . CustomTokenHeader baseServer ?: string port ?: string | number headers ?: Record < string , string > wallet ?: string promptForPassword ?: () => Promise < string > }
Example: { id : WalletId . KMD , options : { wallet : 'unencrypted-default-wallet' , baseServer : 'http://localhost' , port : 4002 , token : 'a' . repeat ( 64 ) } }
Mnemonic Development-only wallet using a 25-word mnemonic. Options: interface MnemonicOptions { // No options - mnemonic is provided at connect time }
Example: Special connect requirements: await mnemonicWallet . connect ({ mnemonic: 'word1 word2 word3 ...' })
Never use in production! For development and testing only.
Custom wallets Custom Create your own wallet integration by extending the BaseWallet class. Options: interface CustomWalletOptions { wallet : typeof BaseWallet }
Example: import { BaseWallet } from '@txnlab/use-wallet' class MyCustomWallet extends BaseWallet { // Implement required methods async connect () { /* ... */ } async disconnect () { /* ... */ } async resumeSession () { /* ... */ } async signTransactions () { /* ... */ } } // Use it { id : WalletId . CUSTOM , options : { wallet : MyCustomWallet }, metadata : { name : 'My Custom Wallet' , icon : 'data:image/svg+xml;base64,...' } }
All wallets support custom metadata overrides:
{ id : WalletId . PERA , metadata : { name : 'Pera Wallet (Custom Name)' , icon : 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCI+PC9zdmc+' } }
Display name for the wallet. Defaults to the wallet’s built-in name.
Icon as a data URI or URL. Defaults to the wallet’s built-in icon.
Peer dependencies use-wallet uses peer dependencies to keep bundle sizes small. Only install the SDKs for wallets you intend to support:
Mobile wallets
WalletConnect
Browser extensions
Web wallets
Auth wallets
npm install @perawallet/connect @blockshake/defly-connect lute-connect
Wallet manager Learn about the WalletManager class
Network configuration Configure networks and algod clients