userstyles.org - Twitch.tv - Dark / Black / Customisable Theme

A customisable dark / black / white / gray interface for twitch.tv. Contains font options, icon hiding, etc.

Please note that due to this style having settings it will not in fact automatically update. Check back in if Twitch breaks or if it's been a while since you updated.

To use this style, install Firefox and Stylish. If you already have Stylish, make sure this site is allowed to run JavaScript.

(Though installing Stylish is recommended, if your browser supports user scripts, you can also install this style as a user script.)

Twitch.tv - Dark / Black / Customisable Theme
145638
78830
twitch
Author SirFist
License CC BY-SA
Created Nov 21, 2012
Updated May 17, 2015
Installs (this week) 829
Installs (total) 159,243
Average rating OK
Show CSS

Notes

I've not been using twitch that much lately and haven't put any time into this. Everything required to actually watch streams should be fully functional but other things might be broken. I intend to properly overhaul this in the future as it's kind of all over the place right now.

Use FrankerFacez or BetterTTV if you want something that's actively maintained but somewhat more bloated than a userstyle.



Current Issues:
I'm playing chinese monster hunter frontier. Everything else can get fucked, tbh.


• Chat status icons are messing with text.
• Hidden sidebar has problems on pages that aren't a normal channel.
• Pop out styles outside of small controls may be broken.
• Some heights are not as they should be, nothing that is immediately eye destroying though.



Please note that due to this style having settings it will not in fact automatically update. Check back in if Twitch breaks or if it's been a while since you updated. Userstyles should remember your settings for when you update.

Change Log (ddmmyyyy)
26/01/2015 @ 13:51 - Button hiding updated, probably still breaks as there's nothing standard about it.
26/12/2014 @ 12:49 - Fixed mentioning colours
16/12/2014 @ 13:22 - Fixed /me other issues still present. Blame Monster Hunter.
24/09/2014 @ 09:15 - Moved divide option to its own drop down. I had been too lazy to set this up and it probably meant more work overall. God bless america.
24/09/2014 @ 05:30 - Updated styles for new twitch stuff. Updated line height. Updated chat buttons. etc.
21/09/2014 @ 06:45 - A FFZ thing.
08/08/2014 @ 06:45 - A thing.
15/05/2014 @ 09:26 - Name highlighting for black etc.
07/08/2014 @ 01:19 - Jesus christ twitch the fuck are you doing.
06/08/2014 @ 12:40 - Archives. Icons. V i d e o g a m e s.
02/08/2014 @ 05:45 - Chat text entry box fixed.
01/08/2014 @ 09:33 - Fixed undivided modes. I am bad at copy pasting.
26/07/2014 @ 11:44 - Host mode support. Fixed widen chat. Removed outlines around icons and buttons on black.
23/07/2014 @ 11:47 - Updated true black to not have divided message backgrounds.


Older Changes

Support
If you need or want to contact me to report problems or for any other reason you can do so on the SpeedRunsLive IRC (as sirfist), on Twitch or via Twitter.

The code being a complete mess is not actually a problem and is in fact a feature.

Faces problem info
For Twitch face fixes go here here. This fix is no longer updated, read the style's description for a guide on fixing them yourself, it's probably not worth the effort due to the frequency of twitch's changes. A greasemonkey script or similar would be needed to properly fix faces.

Options Rundown
Master Style
Overall theme for twitch. Makes it black, gray etc. as selected.

Colour Fixes
Colour fixes forces certain colours in chat to be replaced outright. There is also a 'Force **** Colour' option that will let you manually select what colour is being used to replace the various text colours. Turbo colour changes are further down the options.

Twitch Faces
Some basic twitch face options. Simply removes or replaces all faces with FrankerZ.

Broadcast Title
Adjusts the text information above the stream. Options are default behaviour or to have it hidden at the top the video player itself at the top and to only appear on hovering.

Font Options, Left Sidebar, Button Options, Old Moderator Icon, Icon sets
Should be obvious. Hiding mod icons is built into twitch if you have mod no so those options are gone.

Disable Turbo Colours
This option forces all 'turbo' colours to be white/black/custom colour in place of whatever a turbo subscriber has set it to. This prevents obnoxious colours appearing or invisible text.

Icon Colours
Should be obvious.

Chat Room Selector
Customises the chat room selection options that now appear at the top of a twitch stream's chat. Options are pretty obvious - Off / On / No visual cues for invites.

Help
Please note that due to this style having settings it will not in fact automatically update. Check back in if Twitch breaks or if it's been a while since you updated.

BetterTTV support is minimal as the author has not provided an option to disable his own CSS changes. Hassle him for that if you want flawless support, I will not be doing so as I do not actually use the extension myself.

For font choice see CSS Font Stack for a better idea of what you want to use. Please note that although Helvetica is the default font on Twitch, Windows does not in fact ship with it and thus on the majority of Windows based PCs will revert to Arial.

The Twitch default turbo icon colour is "#6441A5"

The divided chat styles divide the chat by adding a different background colour to every other line of text in chat (dark/light/dark/light/etc.).

Hiding the left sidebar hides the sidebar based on preference but only within actual stream pages.

Chat size simply resizes the chat a set percent up to 125% of original size.

Known Bugs
Some font settings will result in wasted space after usernames if the user types an overly long word or has an exceptionally long username.

There's almost certainly issues involved with any partner only functions, I can't fix these as I do not have a twitch partnership and don't have access to any pages associated with these functions.

Notes:
[ ** ] Highlight the top of the stream to see the description.
[ *** ] Turbo colours are not included in lightening due to how many potential colour values there are. Use this option in conjunction with block turbo colours if you are having issues with unreadable names.

Miscellaneous
Should you feel so inclined feel, free to follow my Twitch here.
Advertisement

Feedback

Discussions

Ask a new question or add a review for this style.