> ## Documentation Index
> Fetch the complete documentation index at: https://docs.rampnow.io/llms.txt
> Use this file to discover all available pages before exploring further.

# User Flow

> Step-by-step view of the buy (fiat to crypto) and sell (crypto to fiat) journeys your users go through

<Info>
  This page walks through what your users see, from the quote to the moment they receive their crypto or fiat. The flow depends on `orderType`: `buy` for onramp, `sell` for offramp. Pick a direction below. Rampnow runs every step for you.
</Info>

<Tabs>
  <Tab title="Onramp (buy)">
    <Frame>
      <img src="https://mintcdn.com/rampnow/WiraXsZDY9bcUT7J/images/onramp/onramp-flow.png?fit=max&auto=format&n=WiraXsZDY9bcUT7J&q=85&s=bc4248a79d1eadaa61553e89e427ca5d" alt="Onramp flow overview" width="3316" height="720" data-path="images/onramp/onramp-flow.png" />
    </Frame>

    <Steps>
      <Step title="Quote generation" icon="calculator">
        The client requests a quote with purchase parameters.

        <Frame>
          <img src="https://mintcdn.com/rampnow/WiraXsZDY9bcUT7J/images/onramp/quote-page.png?fit=max&auto=format&n=WiraXsZDY9bcUT7J&q=85&s=d9aec2b58361b659ef474d7bcfeee3fd" alt="Quote generation interface" width="350" data-path="images/onramp/quote-page.png" />
        </Frame>

        **Request includes:**

        * Fiat currency
        * Payment method
        * Token & blockchain
        * Purchase amount

        **Rampnow returns:**

        * Total cost breakdown
        * Network fees
        * Payment processing fees
        * Token amount to receive

        <Tip>Quotes are deterministic and guaranteed upon checkout</Tip>
      </Step>

      <Step title="Wallet address input" icon="wallet">
        User provides the destination wallet address.

        <Frame>
          <img src="https://mintcdn.com/rampnow/WiraXsZDY9bcUT7J/images/onramp/wallet-address.png?fit=max&auto=format&n=WiraXsZDY9bcUT7J&q=85&s=5bd690aa14be01c3ce21e3e8af55f350" alt="Wallet address input" width="350" data-path="images/onramp/wallet-address.png" />
        </Frame>

        **Address validation checks:**

        * ✓ Correct blockchain network
        * ✓ Account Abstraction
        * ✓ Valid checksum format
        * ✓ Contract restrictions
        * ✓ Valid address format

        <Note>Users can manually enter an address or connect their wallet directly</Note>
      </Step>

      <Step title="Email & OTP verification" icon="envelope">
        Security verification to prevent fraud and ensure account validity.

        <Frame>
          <img src="https://mintcdn.com/rampnow/0Qw-KuDEH6QKpJCe/images/onramp/email.png?fit=max&auto=format&n=0Qw-KuDEH6QKpJCe&q=85&s=003956ee8b77ad5843c6f88fa6e5a2cf" alt="Email and OTP verification" width="350" data-path="images/onramp/email.png" />
        </Frame>

        **Verification process:**

        1. User enters email address
        2. OTP code sent to email
        3. User submits OTP
        4. Session validated and secured
      </Step>

      <Step title="Payment processing" icon="credit-card">
        User completes payment using their preferred method.

        <Frame>
          <img src="https://mintcdn.com/rampnow/WiraXsZDY9bcUT7J/images/onramp/payment-processing.png?fit=max&auto=format&n=WiraXsZDY9bcUT7J&q=85&s=de2eebcf12072228a95cac6d9abdb49e" alt="Payment method selection" width="350" data-path="images/onramp/payment-processing.png" />
        </Frame>

        **Supported payment methods:**

        * **Cards**: Visa, Mastercard (instant processing)
        * **Bank transfers**: SEPA (EU), ACH (US), PIX (Brazil), UPI (India), SPEI (Mexico), Khipu (Chile)
        * **Digital wallets**: Apple Pay, Google Pay, Cash App (US), local APMs

        See [Payment Methods & Limits](/quickstart/resources/payment-methods) for the full, live list of active payment rails by country.

        **Status updates via:**

        * Real-time webhooks
        * API polling
      </Step>

      <Step title="Settlement" icon="building-columns">
        Funds are settled and crypto is prepared for delivery.

        <Frame>
          <img src="https://mintcdn.com/rampnow/0Qw-KuDEH6QKpJCe/images/onramp/exchange.png?fit=max&auto=format&n=0Qw-KuDEH6QKpJCe&q=85&s=5444f80ef0537393b8b792700d7200ec" alt="Settlement and crypto delivery" width="350" data-path="images/onramp/exchange.png" />
        </Frame>

        **Settlement process:**

        1. Payment confirmation received
        2. Funds settle to banking partners
        3. Routing engine triggers liquidity movement
        4. Crypto assets prepared for blockchain delivery

        <Info>Settlement times vary by payment method (instant to 1-3 business days)</Info>
      </Step>

      <Step title="Token delivery" icon="paper-plane">
        Tokens are delivered to the user's wallet address.

        <Frame>
          <img src="https://mintcdn.com/rampnow/0Qw-KuDEH6QKpJCe/images/onramp/success.png?fit=max&auto=format&n=0Qw-KuDEH6QKpJCe&q=85&s=6ad1491aa0dcac8b00ab3ea4b21a74c0" alt="Token delivery to wallet" width="350" data-path="images/onramp/success.png" />
        </Frame>

        **Delivery process:**

        1. Transaction broadcast to blockchain
        2. Network confirmation
        3. Transaction hash generated
        4. Final delivery confirmation

        <Check>Transaction complete! Users can track their tokens on the blockchain explorer.</Check>
      </Step>
    </Steps>
  </Tab>

  <Tab title="Offramp (sell)">
    <Frame>
      <img src="https://mintcdn.com/rampnow/0Qw-KuDEH6QKpJCe/images/offramp/flow.png?fit=max&auto=format&n=0Qw-KuDEH6QKpJCe&q=85&s=06efdabb951b5473eb9941ac0e63075f" alt="Offramp flow overview" width="2810" height="720" data-path="images/offramp/flow.png" />
    </Frame>

    <Steps>
      <Step title="Sell quote generation" icon="calculator">
        The client requests a **sell quote** specifying the digital asset being sold and the target fiat currency.

        <Frame>
          <img src="https://mintcdn.com/rampnow/0Qw-KuDEH6QKpJCe/images/offramp/quote.png?fit=max&auto=format&n=0Qw-KuDEH6QKpJCe&q=85&s=02ad3a7baecb5dc7a31fbd0dcae372fb" alt="Sell quote page" width="350" data-path="images/offramp/quote.png" />
        </Frame>

        **Request parameters:**

        * Token & blockchain
        * Crypto amount
        * Desired payout currency
        * User region (auto-detected or provided)

        **Rampnow returns:**

        * Estimated fiat amount
        * FX and payout fees
        * Network fee
        * Estimated payout arrival time
        * Available payout methods

        <Tip>Quotes are deterministic and guarantee the payout amount after asset confirmation.</Tip>
      </Step>

      <Step title="User sends crypto" icon="wallet">
        The user initiates a blockchain transfer to the **deposit address** generated for the order.

        <Frame>
          <img src="https://mintcdn.com/rampnow/0Qw-KuDEH6QKpJCe/images/offramp/qr.png?fit=max&auto=format&n=0Qw-KuDEH6QKpJCe&q=85&s=7ae6a0129d77b2355561c360248f9582" alt="Deposit address QR code" width="350" data-path="images/offramp/qr.png" />
        </Frame>

        **Rampnow monitors:**

        * Incoming transaction
        * Confirmations on the blockchain
        * Token matching & amount validation
        * Expiration handling if no funds are received

        **Status transitions:**

        * `created` → order created, awaiting the user's crypto deposit
        * `processing` → funds received and confirmed; conversion + payout in progress

        <Note>Each order has to be updated with transaction hash for accurate reconciliation.</Note>
      </Step>

      <Step title="Fiat payout execution" icon="building-columns">
        Rampnow sends fiat to the user's bank account.

        <Frame>
          <img src="https://mintcdn.com/rampnow/0Qw-KuDEH6QKpJCe/images/offramp/payout.png?fit=max&auto=format&n=0Qw-KuDEH6QKpJCe&q=85&s=66d0487332ff8d662ff75f604d03a8a4" alt="Payout screen" width="350" data-path="images/offramp/payout.png" />
        </Frame>

        **Supported payout rails:**

        * **Bank transfers**: SEPA (EU)
        * **Coming soon**: Visa Direct, mobile wallets, regional payout partners

        See [Payment Methods & Limits](/quickstart/resources/payment-methods#offramp-payout-timing) for payout currencies, rails and timings.

        <Tip>Payout timing depends on the selected rail (instant → 1–2 business days).</Tip>
      </Step>

      <Step title="Order completion" icon="check-circle">
        Once fiat is delivered, the order is completed and final confirmations are issued.

        **Final outputs:**

        * Transaction hash (crypto side)
        * Banking reference / trace ID (fiat side)
        * Final webhook: `ramp_order.status_change` with `payload.orderStatus = completed`

        <Check>Users can track blockchain delivery and payout references for transparency.</Check>
      </Step>
    </Steps>
  </Tab>
</Tabs>

***

## Order statuses

Buy and sell orders share one set of statuses, delivered on every change by [webhook](/api-reference/webhook) or by polling the order. A successful order goes `created` → `processing` → `completed`.

See [Order Status](/api-reference/order-status) for every status, which ones are final, and what to do in each.

## Integration options

<div style={{display: 'grid', gridTemplateColumns: '1fr 1fr 1fr', gap: '1rem'}}>
  <Card title="Onramp & Offramp SDK" icon="cube" href="/quickstart/ramp-sdk/overview">
    Open the widget from JavaScript, with events and a React hook
  </Card>

  <Card title="Onramp & Offramp Widget" icon="window" href="/quickstart/ramp-widget/overview">
    Embed the complete buy and sell flow with a URL or an iframe
  </Card>

  <Card title="Onramp & Offramp Intent" icon="code" href="/quickstart/ramp-intent/overview">
    Create orders from your backend and redirect to the hosted checkout
  </Card>
</div>

***

## Next steps

<Steps>
  <Step title="Pick your integration">
    Open Rampnow through the [SDK](/quickstart/ramp-sdk/overview) or the [Widget](/quickstart/ramp-widget/overview), or create orders with [Intent](/quickstart/ramp-intent/overview). Set `orderType` to `buy` or `sell`. See [Integrations Overview](/quickstart/integrations/overview) to choose.
  </Step>

  <Step title="Test in sandbox">
    Simulate successful, failed and expired orders with testnet tokens. See [Sandbox Testing](/api-reference/sandbox-testing).
  </Step>

  <Step title="Handle webhooks">
    Receive real-time order status updates. See the [Webhook Guide](/api-reference/webhook).
  </Step>

  <Step title="Go live">
    Check your integration against the [Go-Live Checklist](/api-reference/go-live-checklist).
  </Step>
</Steps>

<Card title="Ready to integrate?" icon="rocket" href="/get-started/widget">
  Follow the Widget quickstart, or the SDK quickstart in the same tab
</Card>


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.