Connect dApp

Please start with this section when your application needs to interact with the UKey Wallet through the wallet provider instead of calling the hardware SDK directly. The Provider layer covers EVM requests to dApps and provides connection and signing capabilities for multiple non-EVM chains.

Pick a Path

Option	Best for	Stack
RainbowKit	React apps that want the fastest path to a mature wallet picker	React
Web3Modal	Front-end projects that need a wallet modal usable across stacks	React / Vue / JS
Web3-Onboard	Teams that want deeper control over the wallet connection flow	React / Vue / JS
Wagmi	Custom wallet UIs built around React hooks	React
Provider API	Direct Provider access without a UI kit dependency	Any stack

💡

Quick tip

If you want to write less UI for React projects, you can choose RainbowKit first; Vue or native JS projects are usually more suitable for Web3Modal or Web3-Onboard.

---

Get Going

RainbowKit (React)

npm install @rainbow-me/rainbowkit wagmi viem @tanstack/react-query

import "@rainbow-me/rainbowkit/styles.css";
import {
  getDefaultConfig,
  RainbowKitProvider,
  ConnectButton,
} from "@rainbow-me/rainbowkit";
import { WagmiProvider } from "wagmi";
import { mainnet } from "wagmi/chains";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";

const config = getDefaultConfig({
  appName: "UKey Wallet Sample",
  projectId: "YOUR_WALLETCONNECT_PROJECT_ID", // request this from cloud.walletconnect.com
  chains: [mainnet],
});

export default function RainbowKitDemoApp() {
  return (
    <WagmiProvider config={config}>
      <QueryClientProvider client={new QueryClient()}>
        <RainbowKitProvider>
          <ConnectButton />
        </RainbowKitProvider>
      </QueryClientProvider>
    </WagmiProvider>
  );
}

Complete Guide

Provider API (no dependencies)

// Ask installed wallets via EIP-6963 to announce their providers proactively.
const providers = [];
window.addEventListener("eip6963:announceProvider", (e) =>
  providers.push(e.detail),
);
window.dispatchEvent(new Event("eip6963:requestProvider"));

// Pick the UKey Wallet provider, then request an account.
const ukey = providers.find((p) => p.info.rdns === "so.ukey.app.wallet");
const accounts = await ukey.provider.request({
  method: "eth_requestAccounts",
});

Complete Guide

---

Find UKey Wallet

Field	Setting
EIP-6963 rdns	so.ukey.app.wallet
Provider	window.$ukey.ethereum

---

Chain List

EVM: Ethereum, Polygon, BSC, Arbitrum, Optimism, Base, and other EVM compatible networks.

Non-EVM: Bitcoin, Solana, Cosmos, Aptos, Sui, TON, TRON, Polkadot, Cardano, NEAR etc.

View all Provider APIs

---

Links