Wallet login is a critical part of any app’s UX. As the starting point in a user’s journey, it sets the stage for your app’s experience and can determine whether users proceed — or churn.

At WalletConnect, we’re obsessed with user experiences and are constantly exploring ways to empower frictionless, delightful UX. As part of this mission, we talked to wallet and app partners and reached out to end users over the past few months, to uncover what the perfect wallet login experience means to them.

The feedback was clear: simplicity encourages user onboarding and exploration. To this end, we have decided to implement one of the biggest changes to Web3Modal yet — a complete UI/UX redesign in which every detail exists to serve the end-user experience.

Web3Modal v3.0: Simple, intuitive wallet login

Web3Modal is a drop-in UI SDK that enables any wallet’s users to seamlessly log in to your app. Web3Modal v3.0 has been redesigned with an even more precise goal in mind — to make logging in with your wallet as simple and intuitive as possible.

That’s why the revamp features a streamlined wallet selection interface, cloaked in a new minimalist design. Web3Modal v3.0 detects mobile, extension, desktop, and web app wallets, presenting available options together for better usability. Should a wallet have multiple options available, users are prompted to select the option they seek. This new interface guides users with clarity, while a stripped-down design keeps the focus on the essentials. To deliver seamless UX, you can customize the order of wallets on the wallet selection interface according to your app’s specific requirements and preferences.

Other features include:

• Enriched account view: Web3Modal v3.0 expands account view’s features for a more user-friendly experience. In addition to automatic ENS domain resolution, users can also view their token balance and click on links to block explorers like Etherscan have been added to both account view and individual transactions.
• Custom themes: Besides color themes, you can choose between soft, rounded, and minimalist versions of the modal — or even opt for a playful retro version!
• Terms of Service and Privacy Policy: With Web3Modal v3.0, you can present your own Terms of Service and Privacy Policies to your users.
• User onboarding interface: Web3Modal v3.0 retains Web3Modal v2.0’s step-by-step guidance to help users get started with a wallet.
• A unified experience across all platforms: Web3Modal v3.0’s UI components have been redesigned to make them more responsive and mobile-friendly. Whether on Android, iOS, or desktop, users are greeted by a consistent, seamless Web3Modal v3.0 experience.

We’ve also taken steps to optimize the developer experience. Builders can expect the following:

• Simplified, lightweight code: Web3Modal v3.0’s underlying logic has been rewired to reduce complexity, resulting in a bundle size that is ~40% smaller than that of Web3Modal v2.0.
• The WalletConnect Blockchain API: Web3Modal v3.0 leverages the WalletConnect Blockchain API’s built-in RPC, which enables apps to work with 25+ networks with zero configuration.
• CDN support: Following many requests from our developer community over the last few months, we’ve expanded the ways that you can use and host your Web3Modal v3.0 package, to help you improve your workflow.
• A Web3Modal UI library: We also created a UI library of Web3Modal v3.0’s various icons, themes, components, and more, for developers to easily access and use.
• Broad framework support: Web3Modal v3.0 supports React, Vue, and HTML, enabling developers to build with their framework of choice.
• Growing Ethereum library support: Web3Modal v3.0 launches with support for viem; ethers and web3.js is set to follow in the next few months.

Web3Modal v3.0: What’s next?

Web3Modal v3.0 beta is now available for web, and you can jump into it with our quick start guides for React, Vue, and HTML. Plus, Web3Modal v3.0 SDKs in React Native, Swift, Kotlin, and Flutter are currently in development for iOS and Android and launching in the next few months, so that you can start building the next wave of web3 mobile apps.

This is only the beginning for Web3Modal v3.0. As we move along on our roadmap, we’ll be launching many more features, including opt-in analytics that give you greater insight into how users are interacting with your app, support for ethers, viem, and EIP-6963, and… a brand-new way to log in!

Dive into Web3Modal v3.0 beta — and give us your feedback!

If you’re an app developer, you can explore Web3Modal v3.0 beta in greater detail today by visiting our docs. If you’re an app that has integrated Web3Modal v2.0, consider upgrading to Web3Modal v3.0 beta by following this upgrade guide. If you’re a wallet developer, check out what this brand-new design means for your users’ wallet login UX — and you can do so by playing with the sample app on Web3Modal Lab.

It’s a new era for Web3Modal, and we want to hear your thoughts! Let us know what you think and reach out to us on GitHub if you need technical support.