Everything in the box
Wyllet covers the whole wallet experience of a dApp, from the first click on Connect to the last confirmed transaction. Each feature below links to its documentation.
Connect
Getting a wallet connected, on any device, with as few steps as possible.
The Island button
One control that is a call to action when disconnected and shows identity, network, balance and status once connected. Three sizes, three display modes.
Four presentations
Open the panel as a side drawer, an anchored popover or a modal. On phones it becomes a bottom sheet you can drag.
Installed wallets, found automatically
Any browser wallet that announces itself through EIP-6963 shows up under Detected with its own icon, even if you never listed it.
All wallets
With a WalletConnect project ID, a searchable directory of about 570 wallets with official logos. On phones, each one opens its own app.
Keyboard first
Turn on the ⌘K shortcut to open the panel from anywhere. Arrow keys and Enter move through wallets, number keys pick one, and the last wallet used is one tap away.
Install and onboarding screens
Wallets that are not installed get a page with official download links for the browser, iOS and Android.
After connect
The parts most dApps rebuild by hand once a wallet is linked.
Account panel
A compact account summary or an optional generative identity card, with copy, explorer, receive and disconnect.
Tokens
Balances for the token list you define, sorted by holdings or in your order, with pinned tokens and an Add to wallet button.
Activity timeline
Connects, network switches, sign-ins and the transactions you track, with live pending to confirmed status that survives a reload.
Networks
A chain grid with live gas price and a clear wrong-network state. Wallets that do not know your chain are asked to add it.
Toasts
Themed notifications with success, error, loading and promise helpers. Tracked transactions get them automatically.
Receive
A QR code of the connected address, drawn by Wyllet’s own encoder and scan-tested in CI.
Control
Decide who sees what, and keep the list of chains and tokens in your code.
Sign-In With Ethereum
Plug in an auth adapter and a verify step becomes part of the connect flow. Switching accounts or disconnecting signs the user out.
ConnectGate
Render content only for users who are connected, on a supported network, and signed in.
Chains in code
popularChains presets, anything from viem/chains, and customChain() for your own L2 or appchain. Arrange the Networks tab with chainOrder.
Tokens in code
Your token list, shown to every user in your order. Combine it with the built-in blue chips using withDefaultTokens().
Make it yours
Wyllet should look like part of your app, not a widget dropped on top of it.
Four themes
Obsidian, Porcelain, Aurora and Terminal, each with accent, radius, font and backdrop knobs, and light and dark pairs.
Every token is a CSS variable
Colors, radii, fonts, shadows and effects are all --wy-* variables you can override.
Your own class names
Attach classes, including Tailwind utilities, to the overlay, panel, button, wallet rows, primary button, identity card and toasts.
Headless mode
useWylletButton() gives you the state and actions. Draw any trigger you like and Wyllet handles the rest.
Translations
Every string can be renamed or translated through the messages prop.
Trust
A wallet connector sits next to your users’ funds, so it should be easy to audit.
Zero direct runtime dependencies
Only react, wagmi, viem and React Query as peers. A CI test fails if anything else is imported.
npm provenance
Every release is built and published by GitHub Actions through npm Trusted Publishing, with a signed provenance attestation.
No analytics
Wyllet has no servers and collects nothing. The only request it makes on its own is the optional wallet directory.
Built to fail safely
Wyllet’s UI runs behind error boundaries, stored state is validated on read, and hostile onchain strings cannot break rendering.