1. Visit your channel and click on 'Popout Chat'.

2. After the chat opens in a new window you have to copy the link in the taskbar.

3. Now open OBS Studio and add a new browser source.

4. Insert the link from the popout chat into the 'URL' section.

5. In 'width' you can set the width of the overlay. We recommend a width of 350.

 6. In 'Custom CSS' you have to insert the following CSS code and close the window with 'OK'

/* Username color and stroke */
.mr-1{
color: #fff !important;
-webkit-text-stroke: 0,5px black;
}

/* Icons color and stroke */
.mr-2 {
color: #fff !important;
    -webkit-text-stroke: 0,5px black;
}

/* Avatar disable */
.chat_usr_ava {
display:none !important;
}

/* Message color */
.panel_popoutchat .theMsg {
font-weight: bold !important;
color: #fff !important;
-webkit-text-stroke: 0,5px red
}

/* Cookie message disable */
.cookieMSG, #chatBottom, #chatHeader{
display:none !important;
}

/* Background color */
body{
background-color: #000 !important;
}

/* Chat mode message disable */
.update{
display:none !important;
}

/* Scrollbar disable */
.ps__scrollbar-y {
display:none !important;
}

7. Now you can see that the chat is displayed. If you want to remove the black background, follow the next steps.

8. To remove the black background, right-click on the browser source and click on 'Filters'.

9. Now add a 'Color Key' filter.

10. Select the Color Key type 'custom'.

11. Now click on 'Select color' and enter 000000 in 'html' and close both windows.

12. That's it your chat is now available without background in your livestream.