Overlay resolution: 1920×1080

Most overlay issues that look like “CSS bugs” are actually browser-source scaling problems. If you set one thing correctly, set the browser source to 1920×1080.

Why 1920×1080 matters

  • It matches standard 16:9 stream output and avoids fractional scaling.
  • Text stays sharp because the overlay renders at the same pixel grid you broadcast.
  • Layout stays predictable across scenes and devices.

Quick checklist

  • Browser source: Width 1920, Height 1080.
  • Don’t “fit to screen” and then apply extra transforms unless you know why.
  • If you must resize the source, do it in whole-number increments to avoid soft text (e.g. 100%, 50%).
  • Check that the scene/base canvas matches your output resolution (often 1920×1080).

Need the full OBS setup steps?

This walks through adding the browser source and verifying interaction.

Read the browser source guide