# Vertical overlays for Twitch dual format

Give your overlay its own layout for Twitch's vertical video.

Updated 13 October 2026

## What dual format is

Twitch's dual format streams a wide 16:9 video and a tall 9:16 one for phones at once.

In OBS the tall picture comes from a second canvas next to your usual one, and your overlay can draw on both. Each overlay has two layouts that share everything except where things sit: a horizontal layout on the 1920 × 1080 canvas you already use, and a vertical layout on a 1080 × 1920 canvas. Settings, theme, layer names and layer order are the same on both, so you only arrange the vertical picture once.

You need an overlay already on screen in OBS ([Add an overlay to OBS](https://bloopbot.com/docs/widgets-in-obs)) and OBS Studio 32 or newer. Dual format is available to all streamers on Twitch; [Twitch's dual format help article](https://help.twitch.tv/s/article/dual-format-vertical-video) has the latest steps.

## 1. Turn on OBS's vertical canvas

1. Install the **Aitum Vertical** plugin for OBS (the setup Twitch walks through; Twitch also lists StreamElements' vertical plugin), and restart OBS.
2. In OBS, open **Settings → Stream**. Under **Multitrack Video**, tick **Enhanced Broadcasting**.
3. Set the **Additional Canvas** dropdown to **Aitum Vertical**. If it is not listed, close and reopen OBS.
4. In OBS's top menu, open **Docks** and enable **Vertical Scenes** and **Vertical Sources**.
5. Apply. OBS now has a vertical canvas. You switch scenes from your main (horizontal) scene list.

You should see a vertical canvas, with **Vertical Scenes** and **Vertical Sources** panels, in OBS. Press **Start Streaming** once to go live in both formats; there is no separate Go Live for the vertical canvas.

## 2. Add the vertical link as a Browser Source

1. In Studio, open your overlay and choose **OBS URL** in the top bar.
2. Find the second row, **Vertical canvas (Twitch dual format) — 1080 × 1920**, and select its copy icon. The key in the link is never shown, only copied.
3. In OBS, press the **+** in the **Vertical Sources** panel and add a **Browser Source**.
4. Paste the link into **URL**, then set **Width** to **1080** and **Height** to **1920**.

You should see the overlay drawn tall on the vertical canvas.

![The OBS URL popover with two links: the overlay's usual link, and a second row for the Vertical canvas (Twitch dual format), 1080 by 1920, each with a copy icon.](https://bloopbot.com/docs/screenshots/vertical-obs-link.jpg)

_OBS URL: the usual link, and under it the Vertical canvas (Twitch dual format) link for a 1080 × 1920 Browser Source._

The vertical link is your overlay's usual link with `?layout=vertical` on the end. Keep the first link on your horizontal canvas as it is. Treat both links like passwords.

## 3. Arrange the vertical layout in Studio

1. Open your overlay in Studio. Above the canvas, press the **Vertical layout** icon (the tall rectangle, next to the wide **Horizontal layout** icon).
2. Look at the canvas: it is now tall. What you change from here belongs to the vertical layout only.
3. Drag or resize a layer, or press its eye, and see the vertical layout take that change while the horizontal one stays as it was.
4. Press the **Horizontal layout** icon whenever you want the wide layout back.

Pebble can walk you through this on the real pages: open [Tutorials](https://bloopbot.com/docs/tutorials) and start **Make your overlay vertical**. It has you press **Vertical layout**, drag one layer on the tall canvas, and copy the vertical link from **OBS URL**.

You should see a 1080 × 1920 canvas on Vertical and your usual canvas on Horizontal. Here is what happens to layers:

- Layers you have not touched on Vertical are **Auto-placed**: they follow your horizontal layout, keeping their anchor and how far they sit from the edge, scaling their position across and capping their width to fit. Alerts are centred.
- Move or resize a layer on Vertical and it stops being Auto-placed. It keeps the place you gave it, and the horizontal layout is not touched.
- The eye on a layer, while on Vertical, hides it on the vertical picture only.
- To hand a layer back, select it and press **Reset to auto**.
- The background can differ too. Open **Overlay style**, with no layer selected, and use the **Background** tab: a change on Vertical is the vertical backdrop; **Same as horizontal** puts it back.

![Studio with the Vertical layout icon pressed above the canvas: a tall 1080 by 1920 canvas where the Headline layer has been placed by hand and the Badge layer above it is still Auto-placed.](https://bloopbot.com/docs/screenshots/vertical-studio.jpg)

_Studio on Vertical: a tall canvas with Headline placed by hand and Badge still Auto-placed._

Ready-made overlays from **Add** already come with a vertical layout worked out, so they are ready to open on Vertical and adjust.

**Example:** your Gameplay overlay has a poll in the top right. On Vertical, drag it to the top centre and resize it. The wide picture still shows the poll in the corner.

## 4. Chat starts hidden

On phones, Twitch adds its own chat to the vertical view automatically, so there is no need for a chat overlay. So a **Chat box** layer starts hidden on Vertical. If you want your own chat on the vertical picture anyway, select the layer with the **Vertical layout** icon pressed and turn its eye on.

## 5. Keep the bottom clear

About the bottom 560 px of the vertical video can be covered by Twitch's chat and player controls on phones. Anything you place there may be hidden. Keep goals, names and cameras above that band, in the top three quarters of the 1920 px height.

## 6. Show or hide a layer on one layout from a flow

The flow steps **Show a layer** and **Hide a layer** have an **Only on** choice: **Both layouts** (the default), **Horizontal** or **Vertical**. Use it to show a banner on the vertical picture only, or to take your webcam frame off the wide picture while it stays on the tall one. Leave it on **Both layouts** and the step works as before. [Show or hide layers from a flow](https://bloopbot.com/docs/arrange-your-overlay#flow-show-hide) walks through the steps.

## If it does not look right

- **The vertical Browser Source is blank:** check you pasted the link from the vertical row, with `?layout=vertical`, and that the source is 1080 × 1920 and was added in the **Vertical Sources** panel.
- **A layer is missing on Vertical:** its eye may be off on the vertical layout only, or it is the Chat box, which starts hidden.
- **A layer moved on one picture but not the other:** that is the point of two layouts. Press **Reset to auto** to make it follow the wide layout again.
- **Twitch does not show the vertical video:** that setting is in OBS and Twitch, not Bloopbot; see Twitch's help article above.
