While NightDev works on adding the possibility to change your highlight color, here's a simple solution to do it yourself.
1. Download and install the Stylus extension to your browser: Chromium-based browser, or Firefox.
2. Click on the Stylus icon in your extensions and click on Manage.
3. Under Actions click on Write new style.
4. Paste the following code:
.chat-line__message.bttv-highlighted, .vod-message.bttv-highlighted {background-color: rgb(rrr, ggg, bbb, .3) !important;}#bttv-pinned-highlight {background-color: rgb(rrr, ggg, bbb, .5);color: #fff;}#bttv-pinned-highlight .close {fill: #fff;}
5. On Google, search for the hex code of the color you want your highlights to be and get the RGB values.
6. Replace the rrr /ggg /bbb by the respective values.
7. At the bottom of the code select Applies to URLs starting with and put in https://www.twitch.tv/
8. Give it a name and click Save, done!
Optional:
- Feel free to change the last value of the second
rgb()to your liking, it's the opacity of the pinned highlights, going from0to1.
- If the background color is too light and the text in the pinned highlights is unreadable, change the value of
colorandfillfrom#fffto#000.