OBS Overlay Builder

Teslemetry now includes a full OBS overlay builder in Console. Instead of creating one URL per signal, you can design a complete 1920x1080 overlay with multiple widgets, drag-and-drop placement, and saved styling.

Open the Builder

1. Go to Teslemetry Console.
2. Open Utilities -> Streaming Overlay.
3. Or navigate directly to /console/utilities/overlay.

The feature is currently marked alpha in Console.

Requirements

• Active Teslemetry subscription for the vehicle you want to stream.
• At least one access token (Settings -> Access Tokens).
• A running telemetry connection for live values.

Quick Start

1. Select your vehicle in Vehicle.
2. Add one or more widgets in Widgets.
3. Drag widgets on the Overlay Canvas to position them.
4. Fine-tune selected widget position and scale in Widget Settings.
5. Set global style options (accent color, opacity, units) in Style.
6. Select an access token in OBS URL and copy the generated link.
7. In OBS, add a Browser Source with:
   • URL: copied link
   • Width: 1920
   • Height: 1080

Generated URL

The builder generates a session URL in this format:

https://teslemetry.com/api/session?token=[ACCESS_TOKEN]&redirect=/overlay

On non-production environments, the same format is generated on that environment's host (for example https://dev.teslemetry.com/...).

The URL opens /overlay, which renders your saved builder configuration in real time.

Builder Features

Drag and Drop Canvas

• Live 16:9 canvas preview.
• Drag widgets to place them.
• Toggle Edit/Preview mode.
• Click a widget to select it for detailed settings.

Widget Controls

• Add widgets from the built-in widget library.
• Adjust each widget:
  • X position
  • Y position
  • Scale
• Remove widgets individually.

Global Overlay Options

• Stream delay (0 to 30,000ms) to sync with video latency.
• Accent color presets or a custom color picker.
• Background opacity.
• Unit system:
  • Imperial (mph, mi, F)
  • Metric (km/h, km, C)
• Teslemetry branding on or off and branding corner position.

Auto-Save

Builder settings are saved automatically to your account. The /overlay page reads that saved config, so updates appear without manual export or import steps.

Available Widgets

Current widget set includes:

• G-Force
• Compass
• Pedals
• Battery Power
• Battery
• Temperature
• Speed
• Speed (Hero)
• Media
• Media (Large)
• Navigation
• Location
• Odometer
• Tire Pressure
• Climate
• Comfort
• Charging
• Turn Signals
• Power Flow
• Cell Voltage
• Cruise Control
• Seatbelts

How Data Is Configured

When your overlay has selected widgets and a VIN, Teslemetry automatically configures the required telemetry fields for those widgets. You do not need to manually patch field config for standard builder usage.

OBS Tips

• Enable OBS source option Shutdown source when not visible to reduce load.
• Keep one browser source per completed overlay layout.
• Use stream delay in the builder for cleaner telemetry and video sync.

Security

• Treat overlay URLs as secrets because they include an access token.
• Use a dedicated token for streaming overlays.
• Rotate tokens periodically.
• If a token is exposed on stream or in screenshots, revoke and replace it immediately.

Legacy Single-Signal URLs

Older docs referenced single-signal URLs like /obs/[VIN]/[SIGNAL]. The recommended workflow is now the Overlay Builder at /console/utilities/overlay.