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

# Overview

> Use the Web SDK to build fiat-to-crypto ramps with headless payments.

The Web SDK targets first-party browser apps. It ships with TypeScript types for autocomplete and inference.

The SDK is tested against the latest versions of:

* Chrome (Desktop, iOS, Android)
* Safari (macOS)
* Safari (iOS)
* Firefox

<Callout icon="circle-info" iconType="regular">
  Building a React Native app? Use the [React Native
  SDK](/platform/sdk-reference/react-native/overview) instead. For iOS, Android,
  or Flutter, drive [frames](/platform/frames) directly — see the [manual
  integration overview](/platform/guides/manual-integration/overview).
</Callout>

## Install

Install the SDK package:

<CodeGroup>
  ```bash pnpm theme={null}
  pnpm i @moonpay/platform-sdk-web
  ```

  ```bash bun theme={null}
  bun add @moonpay/platform-sdk-web
  ```

  ```bash npm theme={null}
  npm i @moonpay/platform-sdk-web
  ```
</CodeGroup>

## Conventions

### `Result<T, E>`

Most SDK functions return a `Result<T, E>` instead of throwing.

| Field   | Type      | Required | Description                      |
| ------- | --------- | -------- | -------------------------------- |
| `ok`    | `boolean` | ✅        | Whether the operation succeeded. |
| `value` | `T`       |          | Present when `ok` is `true`.     |
| `error` | `E`       |          | Present when `ok` is `false`.    |

Use this pattern to branch on success vs failure:

```ts theme={null}
const result = await someSdkCall();

if (!result.ok) {
  // Handle error
  console.error(result.error);
  return;
}

console.log(result.value);
```

## Function reference

These pages document individual SDK functions, including parameters and return types:

<Card title="Create a reusable client" icon="brackets-curly" horizontal href="/platform/sdk-reference/web/create-client" arrow />

<Card title="Check the customer’s connection" icon="eyes" horizontal href="/platform/sdk-reference/web/get-connection" arrow />

<Card title="Connect a customer" icon="link" horizontal href="/platform/sdk-reference/web/connect" arrow />

<Card title="Authenticate with email and OTP" icon="envelope" horizontal href="/platform/sdk-reference/web/setup-auth" arrow />

<Card title="Reset the customer's connection" icon="rotate-left" horizontal href="/platform/sdk-reference/web/reset-connection" arrow />

<Card title="List payment methods" icon="credit-card" horizontal href="/platform/sdk-reference/web/get-payment-methods" arrow />

<Card title="Get a quote" icon="receipt" horizontal href="/platform/sdk-reference/web/get-quote" arrow />

<Card title="Set up Apple Pay" icon="apple" horizontal href="/platform/sdk-reference/web/setup-apple-pay" arrow />

<Card title="Set up Google Pay" icon="google" horizontal href="/platform/sdk-reference/web/setup-google-pay" arrow />

<Card title="Set up the widget" icon="window" horizontal href="/platform/sdk-reference/web/setup-widget" arrow />

<Card title="Set up the buy frame" icon="cart-shopping" horizontal href="/platform/sdk-reference/web/setup-buy" arrow />

<Card title="Set up the buy button" icon="hand-pointer" horizontal href="/platform/sdk-reference/web/setup-buy-button" arrow />

<Card title="Add a card" icon="credit-card" horizontal href="/platform/sdk-reference/web/setup-add-card" arrow />

<Card title="Set up the Challenge frame" icon="shield-check" horizontal href="/platform/sdk-reference/web/setup-challenge" arrow />

<Card title="Get a transaction" icon="magnifying-glass" horizontal href="/platform/sdk-reference/web/get-transaction" arrow />

<Card title="List transactions" icon="list" horizontal href="/platform/sdk-reference/web/list-transactions" arrow />

<Card title="Delete a payment method" icon="trash" horizontal href="/platform/sdk-reference/web/delete-payment-method" arrow />

<Card title="Verify a customer identity" icon="id-card" horizontal href="/platform/sdk-reference/web/identity" arrow />