> ## Documentation Index
> Fetch the complete documentation index at: https://docs.base.org/llms.txt
> Use this file to discover all available pages before exploring further.

# wallet_connect

> Connect wallet and request account access

export const Button = ({children, disabled, variant = "primary", size = "medium", iconName, roundedFull = false, className = '', fullWidth = false, onClick = undefined}) => {
  const variantStyles = {
    primary: 'bg-blue text-black border border-blue hover:bg-blue-80 active:bg-[#06318E] dark:text-white',
    secondary: 'bg-white border border-white text-palette-foreground hover:bg-zinc-15 active:bg-zinc-30',
    outlined: 'bg-transparent text-white border border-white hover:bg-white hover:text-black active:bg-[#E3E7E9]'
  };
  const sizeStyles = {
    medium: 'text-md px-4 py-2 gap-3',
    large: 'text-lg px-6 py-4 gap-5'
  };
  const sizeIconRatio = {
    medium: '0.75rem',
    large: '1rem'
  };
  const classes = ['text-md px-4 py-2 whitespace-nowrap', 'flex items-center justify-center', 'disabled:opacity-40 disabled:pointer-events-none', 'transition-all', variantStyles[variant], sizeStyles[size], roundedFull ? 'rounded-full' : 'rounded-lg', fullWidth ? 'w-full' : 'w-auto', className];
  const buttonClasses = classes.filter(Boolean).join(' ');
  const iconSize = sizeIconRatio[size];
  return <button type="button" disabled={disabled} className={buttonClasses} onClick={onClick}>
      <span>{children}</span>
      {iconName && <Icon name={iconName} width={iconSize} height={iconSize} color="currentColor" />}
    </button>;
};

export const BaseBanner = ({content = null, id, dismissable = true}) => {
  const LOCAL_STORAGE_KEY_PREFIX = 'cb-docs-banner';
  const [isVisible, setIsVisible] = useState(false);
  const onDismiss = () => {
    localStorage.setItem(`${LOCAL_STORAGE_KEY_PREFIX}-${id}`, 'false');
    setIsVisible(false);
  };
  useEffect(() => {
    const storedValue = localStorage.getItem(`${LOCAL_STORAGE_KEY_PREFIX}-${id}`);
    setIsVisible(storedValue !== 'false');
  }, []);
  if (!isVisible) {
    return null;
  }
  return <div className="fixed bottom-0 left-0 right-0 bg-white py-8 px-4 lg:px-12 z-50 text-black dark:bg-black dark:text-white border-t dark:border-gray-95">
      <div className="flex items-center max-w-8xl mx-auto">
        {typeof content === 'function' ? content({
    onDismiss
  }) : content}
        {dismissable && <button onClick={onDismiss} className="flex-shrink-0 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 transition-colors" aria-label="Dismiss banner">
          ✕
        </button>}
      </div>
    </div>;
};

Custom Coinbase Wallet method for establishing connection

<Info>
  Requests that the wallet connects to the dApp and provides account access. This is similar to `eth_requestAccounts` but provides additional connection features.
</Info>

## Parameters

<ParamField body="options" type="object">
  Optional configuration object for the connection.

  <Expandable title="Options properties">
    <ParamField body="version" type="string">
      The wallet connect version to use.
    </ParamField>

    <ParamField body="jsonrpc" type="string">
      The JSON-RPC version (typically "2.0").
    </ParamField>

    <ParamField body="capabilities" type="object">
      Optional capabilities to request during connection, such as signInWithEthereum for authentication.

      <Expandable title="Available capabilities">
        <ParamField body="signInWithEthereum" type="object">
          Request SIWE (Sign-In With Ethereum) authentication during connection.

          <Expandable title="signInWithEthereum properties">
            <ParamField body="nonce" type="string" required>
              A unique random string to prevent replay attacks.
            </ParamField>

            <ParamField body="chainId" type="string" required>
              The chain ID as a hexadecimal string (e.g., "0x2105" for Base Mainnet).
            </ParamField>
          </Expandable>
        </ParamField>
      </Expandable>
    </ParamField>
  </Expandable>
</ParamField>

## Returns

<ResponseField name="result" type="object">
  Connection result object containing account information and capabilities results.

  <Expandable title="Result properties">
    <ResponseField name="accounts" type="array">
      Array of connected account objects.

      <Expandable title="Account object properties">
        <ResponseField name="address" type="string">
          The account address.
        </ResponseField>

        <ResponseField name="capabilities" type="object">
          Capabilities results if requested during connection.

          <Expandable title="Capabilities results">
            <ResponseField name="signInWithEthereum" type="object">
              SIWE authentication result if requested.

              <Expandable title="signInWithEthereum result">
                <ResponseField name="message" type="string">
                  The SIWE-formatted message that was signed.
                </ResponseField>

                <ResponseField name="signature" type="string">
                  The cryptographic signature of the message.
                </ResponseField>
              </Expandable>
            </ResponseField>
          </Expandable>
        </ResponseField>
      </Expandable>
    </ResponseField>

    <ResponseField name="chainId" type="string">
      The current chain ID as a hexadecimal string.
    </ResponseField>

    <ResponseField name="isConnected" type="boolean">
      Whether the wallet is connected.
    </ResponseField>
  </Expandable>
</ResponseField>

<RequestExample>
  ```json Basic Connection theme={null}
  {
    "id": 1,
    "jsonrpc": "2.0",
    "method": "wallet_connect",
    "params": [{}]
  }
  ```

  ```json With Options theme={null}
  {
    "id": 1,
    "jsonrpc": "2.0",
    "method": "wallet_connect",
    "params": [{
      "version": "1.0",
      "jsonrpc": "2.0"
    }]
  }
  ```

  ```json With signInWithEthereum Capability theme={null}
  {
    "id": 1,
    "jsonrpc": "2.0",
    "method": "wallet_connect",
    "params": [{
      "version": "1",
      "capabilities": {
        "signInWithEthereum": {
          "nonce": "abc123def456",
          "chainId": "0x2105"
        }
      }
    }]
  }
  ```
</RequestExample>

<ResponseExample>
  ```json Basic Connection Response theme={null}
  {
    "id": 1,
    "jsonrpc": "2.0",
    "result": {
      "accounts": [{
        "address": "0x407d73d8a49eeb85d32cf465507dd71d507100c1"
      }],
      "chainId": "0x2105",
      "isConnected": true
    }
  }
  ```

  ```json signInWithEthereum Response theme={null}
  {
    "id": 1,
    "jsonrpc": "2.0",
    "result": {
      "accounts": [{
        "address": "0x407d73d8a49eeb85d32cf465507dd71d507100c1",
        "capabilities": {
          "signInWithEthereum": {
            "message": "localhost:3000 wants you to sign in with your Ethereum account:\n0x407d73d8a49eeb85d32cf465507dd71d507100c1\n\nSign in with Ethereum to the app.\n\nURI: http://localhost:3000\nVersion: 1\nChain ID: 8453\nNonce: abc123def456\nIssued At: 2024-01-15T10:30:00Z",
            "signature": "0x1234567890abcdef..."
          }
        }
      }],
      "chainId": "0x2105",
      "isConnected": true
    }
  }
  ```
</ResponseExample>

## Error Handling

| Code   | Message                        | Description                                               |
| ------ | ------------------------------ | --------------------------------------------------------- |
| 4001   | User rejected the request      | User denied the connection request                        |
| 4100   | Requested method not supported | The method is not supported by the wallet                 |
| 4200   | Wallet not available           | The wallet is not installed or available                  |
| -32602 | Invalid params                 | Invalid nonce or chainId in signInWithEthereum capability |

<Warning>
  This is a Coinbase Wallet-specific method and may not be available in other wallets.
</Warning>

<Info>
  After successful connection, the wallet will emit connection events and provide access to account information.
</Info>

<Tip>
  When using the `signInWithEthereum` capability, always generate a fresh, unique nonce for each authentication attempt to prevent replay attacks. The signature can be verified on your backend using libraries like viem.
</Tip>

## Usage with Capabilities

You can use the `wallet_connect` with the [`signInWithEthereum`](/base-account/reference/core/capabilities/signInWithEthereum.mdx) capability to authenticate the user.

<BaseBanner
  id="privacy-policy"
  dismissable={false}
  content={({ onDismiss }) => (
<div className="flex items-center">
  <div className="mr-2">
    We're updating the Base Privacy Policy, effective July 25, 2025, to reflect an expansion of Base services. Please review the updated policy here:{" "}
    <a
      href="https://docs.base.org/privacy-policy-2025"
      target="_blank"
      className="whitespace-nowrap"
    >
      Base Privacy Policy
    </a>. By continuing to use Base services, you confirm that you have read and understand the updated policy.
  </div>
  <Button onClick={onDismiss}>I Acknowledge</Button>
</div>
)}
/>
