Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.layerswap.io/llms.txt

Use this file to discover all available pages before exploring further.

Layerswap Widget supports three flows that can be configured using the defaultTab parameter:
  • Swap: Cross-chain token transfers and swaps across blockchain networks
  • Deposit from CEX: Direct deposits from centralized exchange accounts to networks
  • Easy Deposit: A streamlined flow that gives the user a deposit address — no WalletConnect, browser extension, or popup needed on the source side. Funds can be sent from any wallet app, hardware wallet, or exchange account.

Default Tab Configuration

You can control which flow is displayed initially by setting the defaultTab parameter in your widget configuration:
<LayerswapProvider
  config={{
    apiKey: 'YOUR_API_KEY',
    version: 'mainnet',
    initialValues: {
      defaultTab: 'swap' // 'swap' | 'cex' | 'deposit'
    }
  }}
  walletProviders={[createEVMProvider()]}
>
  <Swap />
</LayerswapProvider>
defaultTab
string
Controls which flow is shown on first render. Accepted values:
  • 'swap' — Cross-chain Swap flow (default)
  • 'cex' — Deposit from CEX flow
  • 'deposit' — Easy Deposit flow

Switching Between Tabs

Users can switch between Swap, Deposit from CEX, and Easy Deposit flows directly in the widget UI, regardless of which tab is set as default. The defaultTab parameter only controls which flow is displayed when the widget first loads.

Hiding the Tab Switcher

If you want to lock users into a specific flow and prevent them from switching tabs, you can hide the tab switcher using theme configuration:
<LayerswapProvider
  config={{
    apiKey: 'YOUR_API_KEY',
    version: 'mainnet',
    initialValues: {
      defaultTab: 'swap'
    },
    theme: {
      ...theme,
      header: {
        hideTabs: true
      }
    }
  }}
  walletProviders={[createEVMProvider()]}
>
  <Swap />
</LayerswapProvider>
header.hideTabs
boolean
Set to true to hide the tab switcher UI. Users will only see the flow specified in defaultTab and won’t be able to switch between the Swap, Deposit from CEX, and Easy Deposit flows.
Hiding tabs is useful when you want to create a focused experience for a specific use case, such as a bridge-only interface or a CEX deposit-only flow.

Swap Flow

Configuration Example

import { LayerswapProvider, Swap } from '@layerswap/widget';
import { createEVMProvider } from '@layerswap/wallet-evm';

export default function App() {
  return (
    <LayerswapProvider
      config={{
        apiKey: 'YOUR_API_KEY',
        version: 'mainnet',
        initialValues: {
          defaultTab: 'swap',
          from: 'ETHEREUM_MAINNET',
          to: 'ARBITRUM_MAINNET',
          fromAsset: 'USDC',
          toAsset: 'USDC',
          destAddress: '0x1234567890abcdef1234567890abcdef12345678'
        }
      }}
      walletProviders={[createEVMProvider()]}
    >
      <Swap />
    </LayerswapProvider>
  );
}

Features

from
string
Source blockchain network (e.g., ‘ETHEREUM_MAINNET’, ‘POLYGON_MAINNET’)
to
string
Destination blockchain network (e.g., ‘ARBITRUM_MAINNET’, ‘OPTIMISM_MAINNET’)
fromAsset
string
Token to be transferred from the source network (e.g., ‘USDC’, ‘ETH’)
toAsset
string
Token to be received on the destination network (e.g., ‘USDC’, ‘ETH’)
destAddress
string
Destination wallet address where funds will be received

Deposit from CEX Flow

This flow allows users to deposit tokens directly from their exchange accounts to a blockchain wallet. Users select the exchange, then pick an intermediary network through which the transaction will be processed. Layerswap generates a deposit address on that network and waits for the user to do a manual withdrawal from their CEX account. After the deposit is detected, the transaction is being processed and funds arrive at the destination you or the user set. Users will get detailed instructions in the UI during the transaction process.

Configuration Example

import { LayerswapProvider, Swap } from '@layerswap/widget';
import { createEVMProvider } from '@layerswap/wallet-evm';

export default function App() {
  return (
    <LayerswapProvider
      config={{
        apiKey: 'YOUR_API_KEY',
        version: 'mainnet',
        initialValues: {
          defaultTab: 'cex',
          from: 'COINBASE',
          to: 'ARBITRUM_MAINNET',
          toAsset: 'USDC',
          destAddress: '0x1234567890abcdef1234567890abcdef12345678'
        }
      }}
      walletProviders={[createEVMProvider()]}
    >
      <Swap />
    </LayerswapProvider>
  );
}

Features

from
string
Source centralized exchange (e.g., ‘COINBASE’, ‘BINANCE’, ‘KRAKEN’)
to
string
Destination blockchain network
toAsset
string
Token to be received on the destination network
destAddress
string
Destination wallet address where funds will be received

Easy Deposit Flow

The Easy Deposit flow gives the user a deposit address they can send to from any wallet — no WalletConnect, no extension popup, no source-side wallet integration. Enable it with defaultTab: 'deposit'. See the dedicated Easy Deposit page for the full description, screenshot, and configuration reference.