---
Source: https://docs.microblink.com/blinkcard/quickstart
Title: Quickstart
Description: Integrate BlinkCard and get your first successful payment card scan on web, Android, or iOS in about five minutes
---

# Quickstart

This guide takes you from zero to a working payment card scan in about five minutes.
It uses the built-in scanning UI, which opens the camera, guides the user, handles the front-to-back transition, and returns the card data with the least code.

The steps are the same on every platform:

1. Get a license key.
2. Add the SDK to your project.
3. Launch the scanner and read the result.

## Get a license key

1. Go to the [Microblink Developer Hub](https://developer.microblink.com/license/new).
2. Select **BlinkCard** as the product.
3. Select your platform.
4. For web, set the domain to `localhost` while testing, or the domain where your app is hosted.

Keep the key somewhere your app can read it, such as an environment variable.
Never commit a production key to source control.

## Add the SDK

Install the SDK and complete the platform-specific setup.
The READMEs cover everything beyond the snippet below: required versions, repository configuration, and camera permissions.

<Tabs queryString="platform">
  <TabItem value="web" label="Web (TS)" default>

  Install the package:

  ```bash
  npm install @microblink/blinkcard
  ```

  The scanning engine runs as a WASM module that must be served from your app, by default under `/resources`.
  See the [web README](https://github.com/microblink/web-sdks/tree/main/packages/blinkcard) for the resource-hosting step and the full integration.

  </TabItem>
  <TabItem value="android" label="Android (Kotlin)">

  The SDK is published on Maven Central.
  Add the dependency to your module's `build.gradle.kts`:

  ```kotlin
  dependencies {
      implementation("com.microblink:blinkcard-ux:3000.0.1")
  }
  ```

  See the [Android README](https://github.com/microblink/blinkcard-android) for repository configuration and the camera permission.

  </TabItem>
  <TabItem value="ios" label="iOS (Swift)">

  Add the SDK with Swift Package Manager, either through Xcode or in your `Package.swift`:

  ```swift
  dependencies: [
      .package(
          url: "https://github.com/microblink/blinkcard-ios.git",
          .upToNextMajor(from: "3000.0.0")
      )
  ]
  ```

  See the [iOS README](https://github.com/microblink/blinkcard-ios) for the camera usage description requirement.

  </TabItem>
</Tabs>

## Scan a card

Initialize the SDK with your license key and launch the scanner.
When scanning finishes, you receive the extracted card data in a callback.

<Tabs queryString="platform">
  <TabItem value="web" label="Web (TS)" default>

  ```typescript
  import { createBlinkCard } from "@microblink/blinkcard";

  const blinkCard = await createBlinkCard({
    licenseKey: import.meta.env.VITE_LICENSE_KEY,
  });

  blinkCard.addOnResultCallback((result) => {
    console.log("Card number:", result.cardAccounts[0].cardNumber);
    void blinkCard.destroy();
  });
  ```

  `createBlinkCard` loads the engine, opens the camera, and mounts the scanning UI in one call.
  Call `destroy` when you're done to release the camera and engine.

  </TabItem>
  <TabItem value="android" label="Android (Kotlin)">

  ```kotlin
  val sdk = BlinkCardSdk.initializeSdk(
      context,
      BlinkCardSdkSettings(licenseKey = "your-license-key")
  ).getOrThrow()

  BlinkCardCameraScanningScreen(
      blinkCardSdk = sdk,
      onScanningSuccess = { result ->
          println("Card number: ${result.cardAccounts[0].cardNumber}")
      },
      onScanningCanceled = { }
  )
  ```

  `BlinkCardCameraScanningScreen` is a composable that owns its own camera lifecycle, so no explicit cleanup is needed.

  </TabItem>
  <TabItem value="ios" label="iOS (Swift)">

  ```swift
  let sdk = try await BlinkCardSdk.createBlinkCardSdk(
      withSettings: BlinkCardSdkSettings(licenseKey: "your-license-key")
  )
  let analyzer = try await BlinkCardAnalyzer(sdk: sdk)
  let uxModel = BlinkCardUXModel(analyzer: analyzer)

  uxModel.$result
      .sink { resultState in
          if let result = resultState?.scanningResult {
              print("Card number:", result.cardAccounts[0].cardNumber ?? "")
          }
      }
      .store(in: &cancellables)

  // Present the scanning UI:
  BlinkCardUXView(viewModel: uxModel)
  ```

  `BlinkCardUXView` releases camera resources when it's dismissed, so no explicit cleanup is needed.

  </TabItem>
</Tabs>

That's a complete, runnable integration.
Point the camera at a payment card and the card number prints to your console.

## Read the result

The result is a structured object with the card data BlinkCard extracts: card number, expiry date, cardholder name, IBAN, and more.
Card accounts are returned in `cardAccounts`, so a typical single-card scan reads from `cardAccounts[0]`.

For the full list of fields and their types, see the [result reference](result-reference.md).

## Next steps

- [Scan a card from a static image](scan-image.md): scan an uploaded image instead of the live camera.
- [Extract specific fields](extract-fields.md): read the card number, expiry, CVV, IBAN, or cardholder name.
- [Customize the UI](customize-ui.md): branding, instructions, and overlay.
- [Anonymization](anonymization.md): mask sensitive card data in results and images.


Last updated on Aug 11, 2026