Adding a Twitch Chat Overlay to your Stream

Purpose

This guide will help you add your stream chat to your overlay so viewers can watch in fullscreen without missing any messages.

Step-by-Step Instructions

Step 1: Create a New Overlay

• Open your StreamElements Overlays page.

• Click "Add New Overlay".

• Select your preferred resolution (1080p recommended).

Select your desired resolution (we recommend sticking to 1080p)

Step 2: Add the Chat Widget

1. Click the blue plus sign to add a new widget.

2. Navigate to Stream Tools > Your Stream’s Chat.

Step 3: Customize the Chat Widget

To improve visibility and aesthetics, consider making the following adjustments:

• Resize the chat box to fit your layout.

• Change the theme to Custom.

• Modify text settings:

  • Pick a font that matches your stream’s style.

  • Adjust text color, size, and other settings.

  • Add a text shadow for better readability on bright backgrounds.
    
    
    

Step 4: Save and Copy the Overlay URL

1. Click the Save button at the top.

2. Name your overlay for easy reference.

3. Click the link icon at the top to copy the overlay URL.

Emote Support

• The chat widget supports Twitch emotes, including animated emotes.

• It also supports third-party emotes from BTTV, FFZ, and 7TV.

• Unlisted 7TV emotes are NOT supported and will not appear.

If you need to know how to add the overlay into OBS, head over to our dedicated article.