Help & FAQ

IRL Widget Configurator — setup guide and common questions

How to set up your IRL widget

  1. Open irl.hyperate.io and enter your HypeRate Device ID in the preview panel on the right.
  2. Choose Single Widget to display one data source, or Summary View to show multiple widgets together (Activities or Weather).
  3. Customize layout, colors, fonts, icon style, gaps, and border radius. Background color supports 8-digit hex (e.g. #00000080 for 50 % opacity black).
  4. Optionally enable Auto-Switching to rotate through data sources every N seconds — a single URL handles the rotation automatically.
  5. Click Copy URL and add it as a Browser Source in OBS Studio or your mobile streaming app.

Available widgets

Frequently asked questions

How do I add the widget URL to OBS?

OBS → Sources → click + → select Browser → paste the generated URL. Set width/height to your canvas or overlay area. Enable hardware acceleration in the browser source properties if animated icons appear choppy.

Do I need a HypeRate account?

No account is needed to configure and preview widgets with dummy data. To see live telemetry in the preview and to stream real data, you need a HypeRate Device ID from the HypeRate app running on your phone.

Is the configurator free?

Yes — the IRL Widget Configurator is completely free. No subscription or payment required.

What equipment do I need?

A GPS-enabled smartphone running the HypeRate app provides location, speed, distance, and elevation data. A Bluetooth heart rate monitor is optional — it adds heart rate and calorie tracking. Weather data is automatically fetched from Apple Weather using your GPS position.

Which unit systems are supported?

Metric and Imperial. Speed, distance, elevation, temperature, and wind speed all respect your unit system selection. Calories can be displayed as kilocalories (kcal) or calories (cal) independently of the main unit toggle.

Can I use a custom font?

Yes. Paste a public CSS URL (e.g. a Google Fonts @import URL) into the Custom Font URL field, then type the exact font-family name in the Font Family field. The widget browser source loads the font at runtime.

Why is my widget background transparent?

Background color uses 8-digit hex (#RRGGBBAA). The last two digits (AA) set opacity — 00 is fully transparent, FF is fully opaque. Use the opacity slider in the configurator or edit the hex value directly. Example: #00000066 = 40 % opaque black.

What is the difference between Summary View and Auto-Switching?

Summary View (without auto-switch) displays all widgets in a group simultaneously side by side — useful for a wide overlay bar. Auto-Switching shows one widget at a time and rotates through the group every N seconds via a single URL — useful when vertical space is limited.

Can I display the weather widget without a heart rate monitor?

Yes. Temperature, precipitation probability, wind speed, UV index, and elevation are all fetched from Apple Weather using your GPS coordinates. A heart rate monitor is not required for any weather widget.

How is weather data sourced?

Weather data is powered by Apple Weather. It is fetched automatically based on the GPS coordinates provided by your HypeRate device.

Is the location widget privacy-safe?

Be mindful when sharing live GPS data. Use Country Only or Flag Only display modes to reduce location precision if you are concerned about sharing your exact city with viewers.

Ready to build your IRL overlay? Open the configurator and generate your widget URL in under 2 minutes.

Open IRL Widget Configurator