> For the complete documentation index, see [llms.txt](https://docs.swapper.finance/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.swapper.finance/deposit-methods/fiat-onramp.md).

# Pay with Card

**Key:** `depositWithCash` · **Deposit `method`:** `onramp`

The fiat on-ramp lets users fund with a **card, Apple Pay, or bank transfer** — no crypto required. Swapper's on-ramp partner converts cash to crypto, then that crypto is routed and swapped to your destination token.

## What the user experiences

1. Chooses **Pay with Card** (labeled "Buy with Fiat" by default, or "Deposit with Fiat" if you set [`actionLabel: "deposit"`](/widget-integration/configuration.md#actionlabel)).
2. Enters an amount and picks a currency and payment method available in their region.
3. Completes payment with the provider (hosted, PCI-compliant).
4. The purchased crypto is delivered and swapped to your `dstTokenAddr`, which arrives at `depositWalletAddress`.

Availability of currencies and payment methods is determined by the provider and the user's geolocation.

## Two settlement shapes

Where the purchased crypto lands determines how the deposit is reported:

* **Straight to an external wallet** — the on-ramp delivers directly. The deposit is fully done at `completed`.
* **Into a Swapper smart wallet, then swept onward** — when the destination needs a further swap/bridge, the on-ramp funds one of our smart wallets, and the onward swap is tracked as a **separate** `smart_wallet` deposit. Final delivery is marked by that second deposit's completion.

In the second case you receive **two** webhook events — one `onramp`, one `smart_wallet` — correlated on-chain. Don't double-count them. See [Webhooks → Linking](/tracking-deposits/webhooks.md#linking-onramp--wallet-deposit).

## What your app receives

A [`transaction.completed` webhook](/tracking-deposits/webhooks.md) whose `deposit.method` is `onramp`, with `providerData.type = "onramp"`:

```json
{
  "type": "onramp",
  "transactionId": "a1b2c3d4-…",
  "fiatCurrency": "USD",
  "fiatAmount": "11.50",
  "paymentMethod": "CARD"
}
```

The on-ramp deposit also carries `depositTxHash` — the on-chain tx that delivered the crypto — which is the key used to [link](/tracking-deposits/webhooks.md#linking-onramp--wallet-deposit) it to a follow-on smart-wallet swap.

In the browser you also get a [`transaction_success` widget event](/tracking-deposits/widget-events.md) with `depositOption: "depositWithCash"`.

## Mobile WebViews

If you embed the widget inside a native mobile WebView (e.g. Ionic/Capacitor), set [`webviewMode: true`](/widget-integration/configuration.md#widget-only-props). The on-ramp step then renders a plain user-clickable link (instead of calling `window.open(..., "_blank")`), so iOS/Android WebViews can hand the payment URL to the system browser.

## Enabling it

```typescript
openSwapperModal({
  integratorId: "your-id",
  dstChainId: "8453",
  dstTokenAddr: "0x833…913",
  depositWalletAddress: "0x…",
  supportedDepositOptions: ["depositWithCash"], // show only the on-ramp
  actionLabel: "buy",
});
```