Documentation
Everything you need to add Wyllet to a React dApp, from the first install to theming, wallets, tokens and Sign-In With Ethereum. New here? Start with the quick start.
Getting started
- IntroductionWhat Wyllet is, what it includes, and how it fits into a wagmi + viem dApp.
- InstallationInstall Wyllet and its peer dependencies, and enable WalletConnect.
- Quick startAdd a working connect button to a React dApp in a few minutes.
- Next.jsUse Wyllet with the Next.js App Router, server components and SSR.
- Build with AI assistantsGive Cursor, Claude Code, Copilot or ChatGPT the Wyllet docs and the rules for a correct integration.
Core concepts
- ConfigurationCreate a wagmi config with getDefaultConfig: app info, chains, transports and wallets.
- WylletProviderEvery WylletProvider prop: theme, appearance, tokens, auth, messages and callbacks.
- WylletButtonThe Island button, its display options, and building your own trigger with useWylletButton.
- PresentationsOpen the panel as a drawer, an anchored popover, a modal or a mobile bottom sheet.
Customization
Wallets
Chains and tokens
Features
- Account panelAccount summary, identity card, tokens, activity, networks and receive.
- Activity and transactionsTrack transactions and log custom events in the activity timeline.
- ToastsThemed, promise-aware notifications with useWylletToast.
- Sign-In With EthereumAdd a SIWE verification step to the connect flow with an auth adapter.
- ConnectGateRender content only when users are connected, on a supported network and signed in.
Reference
- HooksAPI reference for every Wyllet hook: useWyllet, useWylletButton, useWylletToast, useWylletActivity, useWylletAuth and more.
- ComponentsAPI reference for every Wyllet component: WylletButton, ConnectGate, Avatar, ChainIcon, TokenIcon, QRCode and more.
- Utilities and typesHelper functions and the TypeScript types Wyllet exports.
Guides
- SecurityZero direct runtime dependencies, provenance, CSP and what Wyllet does and does not do.
- Migrate from RainbowKitMap RainbowKit concepts to Wyllet and switch a dApp over step by step.
- FAQAnswers to common questions about Wyllet: pricing, wallets, chains, Next.js, styling, security and data collection.