Microsoft Clarity

Learn how to set up Microsoft Clarity for session recordings and heatmaps.

Setup

Create a Clarity Project

Go to Microsoft Clarity and create a new project for your application.

Get the Project ID

In your Clarity project settings, find the Project ID.

Update the environment variables

Copy the Project ID and paste it beside NEXT_PUBLIC_MICROSOFT_CLARITY in the .env file:

.env
NEXT_PUBLIC_MICROSOFT_CLARITY=your-project-id

Test the integration

  1. Open the application and accept cookies in the consent banner.
  2. Open the browser's Network tab and filter for clarity.
    You should see requests to clarity.ms.
  3. Check your Clarity dashboard to confirm sessions are being recorded.