Racelink

// OVERLAY API

Build overlays for Racelink

An overlay is a small web page. Racelink gives it normalized live data from every supported sim, a settings panel generated from its manifest and a way to the Steam Workshop.

  1. 01

    Create

    npm create @racelink/overlay@latest

    Pick plain TypeScript or React. The project runs right away.

  2. 02

    Develop

    npm run dev

    npm run dev: the overlay appears in Racelink and reloads on every change. Without the app, the SDK generates demo data.

  3. 03

    Publish

    npm run build

    Racelink Studio checks the overlay, captures its preview and publishes it to the Steam Workshop. Subscribers get updates automatically.

// TYPESCRIPT

Read telemetry

  • One data model

    Speeds in km/h, pedals 0–1, times in seconds — the same fields in every sim.

  • Settings from the manifest

    Declare settings in racelink.overlay.json and Racelink draws the panel.

  • Typed from end to end

    Telemetry and settings are typed; the field reference documents every value.

  • Made for AI assistants

    Projects include AGENTS.md and a complete guide for coding assistants.

src/main.ts
import { createOverlay } from '@racelink/overlay';
import { defaultSettings, type Settings } from './racelink-settings';

const overlay = createOverlay<Settings>({ defaults: defaultSettings });

overlay.on('telemetry', ({ car, session }) => {
  // Normalized for every sim: km/h, pedals 0..1, seconds.
  draw(car.speedKph, car.throttle, session.lap);
});