Skip to main content

Overview

This guide shows how to use Magic’s Embedded Wallet with the Li.Fi API to swap tokens on Base. Li.Fi aggregates DEXs and bridges, finding the best rate across multiple protocols. Your app fetches a quote, handles token approval, and executes the swap — all client-side through the user’s Embedded Wallet.

Prerequisites

Before starting, ensure you have:
  1. A Magic Publishable API Key from your Magic Dashboard
  2. A Base RPC endpoint (e.g., from Alchemy or QuickNode)
  3. Tokens on Base in the user’s wallet (ETH for gas + the token to swap)

How It Works

  1. User authenticates with Magic
  2. Your app fetches a swap quote from Li.Fi’s /v1/quote endpoint
  3. If swapping an ERC-20 token, the user approves Li.Fi’s contract to spend their tokens
  4. Your app sends the swap transaction using the transactionRequest from the quote
  5. Li.Fi routes the swap through the best available DEX

Setting Up the Client

Initialize Magic and create viem clients connected to Base.
TypeScript

Getting a Swap Quote

Fetch a quote from Li.Fi to find the best swap route. No API key is required.
TypeScript
The slippage parameter is a decimal — 0.005 means 0.5%. Li.Fi returns toAmountMin which accounts for slippage, so users know the minimum they’ll receive.

Token Approval

When swapping an ERC-20 token (not native ETH), the user must approve Li.Fi’s contract to spend their tokens. The approval address comes from the quote response.
TypeScript

Executing the Swap

Combine the quote, approval, and transaction execution into a single flow.
TypeScript

Example: Swap ETH for USDC

TypeScript

Example: Swap USDC for ETH

TypeScript
When swapping USDC for ETH, the approval step runs automatically. When swapping ETH for USDC, no approval is needed since ETH is the native token.

Token Addresses

Common tokens on Base (chain ID 8453):
TypeScript
Li.Fi also accepts token symbols (e.g., "ETH", "USDC") instead of addresses, but using addresses is more reliable to avoid ambiguity.

Key Dependencies

No additional SDK is needed — Li.Fi’s REST API is called directly via fetch.

Troubleshooting

Symptoms: The /quote endpoint returns an error or empty result.Solutions:
  • Verify the token addresses are correct for Base (chain ID 8453)
  • Check that fromAmount is in the smallest unit (e.g., wei for ETH, 6 decimals for USDC)
  • Ensure the amount is large enough — very small swaps may not have viable routes
  • Try increasing slippage if the market is volatile
Symptoms: The transaction is sent but reverts on-chain.Solutions:
  • Check that the token approval was confirmed before sending the swap
  • The quote may have expired — quotes are only valid for a short time, so fetch a new one and retry
  • Ensure the user has enough ETH for gas fees on Base
Symptoms: The ERC-20 approval transaction fails.Solutions:
  • Verify the user holds the token they’re trying to swap
  • Check that the approvalAddress from the quote is being used (not the swap contract)
  • Ensure the user has ETH for the approval gas fee
Symptoms: The output amount is lower than the quoted estimate.Solutions:
  • This is normal within the slippage tolerance — check toAmountMin for the guaranteed minimum
  • Reduce slippage in the quote request for tighter control (but too low may cause failures)
  • For large swaps, consider splitting into smaller transactions

Resources

Magic Embedded Wallets

Learn about Magic’s Embedded Wallet product

Li.Fi Documentation

Official Li.Fi API and SDK documentation

EVM Transaction Signing

Guide for signing transactions with Magic wallets

Base Documentation

Official Base network documentation