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

# Web SDK For Audio Dictation Overview

> Add Dictation to JavaScript or React apps with `SukiAuthManager`, `DictationClient`, and Web SDK Dictation components in Web SDK

<div className="quick-summary-wrapper">
  <div className="quick-summary-header">
    <span className="quick-summary-icon" aria-hidden="true" />

    <span className="quick-summary-title">Quick summary</span>
  </div>

  <div className="quick-summary-content">
    Add Dictation capabilities to a browser-based JavaScript or React app with the Suki Web SDK. If you already use the Web SDK, import the Dictation client and components from the Web SDK package. You do not need a standalone Dictation SDK install.
  </div>

  <div className="quick-summary-footer">
    <span className="quick-summary-footer-icon" aria-hidden="true" />

    <span className="quick-summary-footer-text">Last updated:</span>
    <span className="quick-summary-footer-date">August 2026</span>
  </div>
</div>

This section walks you through the process of integrating Dictation capabilities using the Suki Web SDK in a browser-based JavaScript or React application. You will use the packages provided by Suki to complete the integration.

To implement Dictation, you must create a `SukiAuthManager` and a `DictationClient`.

In a **React application**, you wrap your component tree with the `DictationProvider`. You then render the `Dictation` component when you want the user to dictate. In a **JavaScript application**, you call `await dictationClient.show({ ... })` when the user is ready to begin Dictation.

## Prerequisites

Before you begin, meet the necessary requirements in [Web SDK prerequisites](/web-sdk/prerequisites) and obtain `partnerId` and `partnerToken` after [Partner onboarding](/documentation/get-started/partner-onboarding).

## Integration guides

Choose the integration guide for your stack:

<CardGroup cols={2}>
  <Card title="JavaScript" icon="js" href="/web-sdk/guides/dictation-javascript" arrow="true">
    Use the JavaScript package provided by Suki Web SDK to integrate audio Dictation in a JavaScript application (browser-based).
  </Card>

  <Card title="React" icon="react" href="/web-sdk/guides/dictation-react" arrow="true">
    Use the React package provided by Suki Web SDK to integrate audio Dictation in a React application (browser-based).
  </Card>
</CardGroup>

For options such as **`mode`**, **`fieldId`**, and callbacks, refer to [Configuration](/dictation-sdk/guides/configuration) guide in the Dictation SDK section.
