> For the complete documentation index, see [llms.txt](/llms.txt).

# connect & connectTo

Functions to connect users to Embedded Wallets in the browser.

### Import[​](#import "Direct link to Import")

```
import { Web3Auth } from '@web3auth/modal'

```

### Choosing the right connection method[​](#choosing-the-right-connection-method "Direct link to Choosing the right connection method")

You can connect users to Embedded Wallets in two main ways, depending on your application's needs:

- **Use `connect()`** when you want to display the default Embedded Wallets/Web3Auth modal. This is ideal if you want to provide users with a pre-built, user-friendly interface where they can choose from all available login options (for example, social logins, wallets) with minimal setup.
- **Use `connectTo(connector, params)`** when you want to build a fully custom login experience. This method lets you bypass the Web3Auth modal and connect directly to a specific wallet connector (such as Google, Facebook, or a particular wallet). Choose this if you want to design your own UI for login options, or if you want to restrict users to a specific authentication method. This method also allows you to use JWT-based login configurations.

**Summary:**

- Use `connect()` for the standard modal experience.
- Use `connectTo()` for custom UIs or direct connection to a specific login method.

### Usage[​](#usage "Direct link to Usage")

- Basic Modal
- Custom UI

info

This is the most common way to connect to Embedded Wallets. It opens the Embedded Wallets/Web3Auth modal UI, allowing users to select from available login options.

```
// Initialize Web3Auth first
const web3auth = new Web3Auth({
  // Your configuration options
})

await web3auth.init()

// Show the modal and connect
await web3auth.connect()

const provider = web3auth.connection?.ethereumProvider ?? null

```

info

This method allows you to build your own custom connection UI. It bypasses the Embedded Wallets/Web3Auth modal UI, allowing you to create your own custom UI for login options. This can be useful if you want to hide Embedded Wallets from your end users.

```
import { WALLET_CONNECTORS, AUTH_CONNECTION } from '@web3auth/modal'

// Initialize Web3Auth first
const web3auth = new Web3Auth({
  // Your configuration options
})

await web3auth.init()

// Connect directly to Google
await web3auth.connectTo(WALLET_CONNECTORS.AUTH, {
  authConnection: AUTH_CONNECTION.GOOGLE,
})

const provider = web3auth.connection?.ethereumProvider ?? null

```

### Return types[​](#return-types "Direct link to Return types")

```
connect(): Promise<Connection | null>
connectTo<T extends WALLET_CONNECTOR_TYPE>(connector: T, params?: LoginParamMap[T]): Promise<Connection | null>

```

#### Return values[​](#return-values "Direct link to Return values")

- **`Connection | null`**: On successful sign-in, returns a `Connection` object with `ethereumProvider`, `solanaWallet`, and `connectorName`. On unsuccessful sign-in, returns `null`.
- For the EIP-1193 provider, use `web3auth.connection?.ethereumProvider` after `connect()` or `connectTo()`.

tip

Read more about connecting your users with the selected blockchain in the [JavaScript Ethereum integration](/embedded-wallets/sdk/js/ethereum-integration/) guide.