Skip to main content
Start with the job your user needs to complete. Every option uses the same routes, fees, and swap lifecycle underneath.

​
Compare the options

​
Swap Widget or Deposit Widget?

Both follow the Widget integration model, share theming and callbacks, and use the same verified CDN delivery path in the React loader. They start from different user intent: The Deposit Widget is not the Deposit tab inside the Swap Widget. The component is a dedicated fixed-destination experience. The tab—formerly called “Easy Deposit”—generates an address or QR code inside the Swap Widget and can take its destination from the user’s connected wallet. See Initial values & flows for the behavioral distinction.

​
Widget package choices

  • @layerswap/widget-react — React hosts. Recommended for both Widget experiences.
  • @layerswap/widget-js — Vue, Angular, Svelte, and plain DOM hosts. The Swap Widget mount is documented; verify the Deposit Widget mount at release.
  • Self-bundled Widget (@layerswap/widget) — for teams that need complete control over the Widget bundle and its dependencies. You manage wallet packages, dependencies, and updates yourself. See Self-bundled Widget.

​
Decide by scenario

  • “Users should fund an address in my app” → Deposit Widget.
  • “Users should choose both sides of a cross-chain transfer” → Swap Widget quickstart.
  • “I need a branded swap flow that adopts my existing wallet connection” → Swap Widget, then Wallets and Theming.
  • “Ship without installing a package” → Hosted Page setup.
  • “I’m an aggregator or own the entire UX” → Build your first API swap.
  • “My users cannot connect a wallet” → Use the Deposit Widget with the deposit_address method.

​
Requirements

Create an API key in the Partner Dashboard before starting a Widget or API integration. Mainnet and testnet keys select their respective environments.