Live widget demo

Crypto deposit widget demo playground for embedded funding flows.

Use the depositOS playground to evaluate wallet, exchange, and private deposit experiences in one place. Configure destination settings, preview the live widget, and export code your team can move into production without guessing at the integration surface.

Read integration docsExplore deposit conversion use casesSee multi-chain deposit flows

What teams can validate here

  • Compare wallet, exchange, and private deposit paths in one embedded flow.
  • Preview destination-token, chain, and theming changes before implementation starts.
  • Export code snippets for React, iframe, or script-tag handoff to engineering.

Evaluating stablecoin funding flows? Read the Stablecoin Deposit API guide for product and implementation context, then test the UX here.

Your deposit widget opens as a modal

Trigger it with the prebuilt button or the useDepositOS() hook.

Live Preview
Generated Config
const config: DepositOSConfig = {
  "userId": "playground-user",
  "destChain": 42161,
  "destToken": "0xaf88d065e77c8cC2239327C5EDb3A432268e5831",
  "destTokenSymbol": "USDC",
  "destAddress": "0x552008c0f6870c2f77e5cC1d2eb9bdff03e30Ea0",
  "defaultSourceChain": 1151111081099710,
  "gizmoFeeBps": 30,
  "enableWallet": true,
  "enableDepositAnywhere": true,
  "enablePrivateMode": true,
  "depositOSTheme": {
    "mode": "dark",
    "colors": {
      "background": "#0B0B0F",
      "backgroundSecondary": "#111116",
      "card": "#111116",
      "surface": "#15151B",
      "textPrimary": "#FFFFFF",
      "textSecondary": "rgba(255,255,255,0.6)",
      "border": "rgba(255,255,255,0.06)",
      "accent": "#FFFFFF",
      "accentText": "#000000",
      "backdrop": "rgba(0,0,0,0.6)",
      "alertBackground": "#1A1A20",
      "alertAccent": "#E5E7EB",
      "warningBackground": "#1A1A20",
      "warningAccent": "#E5E7EB",
      "errorBackground": "#1A1A20",
      "errorAccent": "#E5E7EB",
      "successBackground": "#1A1A20",
      "successAccent": "#E5E7EB"
    },
    "fontFamily": "Inter, system-ui, sans-serif",
    "borderRadius": "1.25rem",
    "borderWidth": "1px",
    "logoHeight": "2rem",
    "primaryButton": {
      "background": "#FFFFFF",
      "textColor": "#000000",
      "borderColor": "transparent",
      "borderRadius": "0.75rem",
      "padding": "0.625rem 1.25rem"
    },
    "secondaryButton": {
      "background": "#15151B",
      "textColor": "#FFFFFF",
      "borderColor": "rgba(255,255,255,0.12)",
      "borderRadius": "0.75rem",
      "padding": "0.625rem 1.25rem"
    }
  }
};

<DepositOSWidget config={config} onClose={...} onSuccess={...} />