Discussion on: Learn About CSS Custom Properties Through Clever Uses of Them

[Andrew Bone]

We're actually in the process of rolling out CSS variables on this site for the purpose of theming

[WIP] Theme-able CSS Variables #1377

Link2Twenty commented on Dec 20, 2018

I thought we ought to have a place where we keep a note of the current CSS Variables and also propose different variables that should be included.

Currently included:

Variable	Description	Default
--theme-background	Background color of the main body	#f9f9fa
--theme-top-bar-background	Background color of the top bar	#fdf9f3

Pull request pending:

Variable	Description	Default
--theme-top-bar-color	Text and icon color for the top bar	#0a0a0a
--theme-top-bar-search-background	Background color of the search box in the top bar	#e8e7e7
--theme-top-bar-search-color	Text color for the search box, and its placeholder, in the top bar	#0a0a0a

Proposed:

Variable	Description	Default
--theme-color	Text color for the main body	#0a0a0a
--theme-container-background	Background color of the articles and nav-elements	#ffffff
--theme-container-color	Text color for the articles and nav-elements	#0a0a0a

I think the best thing to do is leave a comment below of further proposals and I will update the main post.

Also feel free to do pull requests to help roll these out.

View on GitHub

If you'd like to contribute that would be greatly appreciated 🙂

[Ryan Smith]

Nice, I'm sure a lot of us would love a dark theme. I've been using the extension DarkReader at night, but it does not play nicely with dev.to so I've been waiting for a built-in option.