themes from jupyter-themes

[mzhng]

I've started using jupyter lab instead of regular jupyter notebooks and it's great! However, I really miss the Atom / one-dark / onedork color theme I could use in jupyter notebooks from this repo https://github.com/dunovank/jupyter-themes What would it take to add themes to jupyter lab? Would it be possible to make the themes from the jupyter-themes repo available in jupyter lab as well?

[jasongrout]

What would it take to add themes to jupyter lab?

It would take someone porting those themes over to be a JupyterLab theme extension. Since the notebook and lab have completely different HTML structures, this likely will be quite a bit of manual work?

The two existing theme extensions are at https://github.com/jupyterlab/jupyterlab/tree/master/packages/theme-light-extension and https://github.com/jupyterlab/jupyterlab/tree/master/packages/theme-dark-extension. I think the easiest route would be copying one of those extensions and modifying it to have the look of the theme you want.

[NilsRethmeier]

@mzhng @jasongrout

Another way of applying a theme -- without messing with the server -- is to use a "CSS changer" browser extension such as Stylus[:heavy_check_mark:] Stylish[:x:] with custom CSS scripts from https://userstyles.org. This allows you to theme any web notebook/lab.

:warning: Warning Edit: Do not use the Stylish browser plugin/extension. It collects you private data, as @timvink pointed out. See Ycombinator etc.

:heavy_check_mark: Use the Stylus extension for Chrome/Firefox instead -- it's an older build of Stylish before the adware/tracking added by the company that bought it.

I have uploaded a quiet light theme for jupyter lab that can be handily installed with the Stylus extension. Also there is a Jupyter Notebook theme version for those using libs like pixidust. Edit: you can also get the CSS code from https://userstyles.org to easily see which variables to change the colors with -- or just use a clean CSS-changer extension such as Stylus -- Within the extension you can simply edit the theme/CSS and optionally upload a new version to userstyles.org -- I recommend using a fake mail.

Theme is work in progress.

regarding the Stylish GDPR breach :heavy_exclamation_mark:

@timvink Thank you so much for pointing out this privacy issue.

1. If anyone has used the Stylish extension I recommend sending them A Subject Access Request under GDPR to their Data Protection officer at dpo@userstyles.org -- use the template in the link.
2. If you want to file an official GDPR complaint against the company behind the tracking code there is this list https://ec.europa.eu/commission/sites/beta-political/files/national-data-protection-authorities-jan_2018_en.pdf of official institutions in EU countries I took from ycombinator

[timvink]

Just a heads-up. I used the userstyles solution and was quite happy with it, but apparently they stole browsing history and cookies from users (news article, reddit post).

[jasongrout]

Ouch!

FYI, I made a notebook that makes it a bit easier to play around with theme colors: https://gist.github.com/jasongrout/753216b2d3320b0abec6143d36f5d640

[josesho]

Thanks to @jasongrout 's code to rapidly iterate through the theme colors, I've done up an edit of variables.css with the Solarized Dark theme. It's a work-in-progress (hacked up over half a day at work ;p), and could use some tweaks re:borders and code mirror colors. I hope to release this theme alongside a Solarized Light soon.... stay tuned!

I've attached the edited CSS (just change the file extension from .txt to .css) variables-solarized-dark-test.txt. You can quickly load it in Jupyter Lab as per Jason's code above.

Screen shot here:

EDIT: I use Work Sans for the main interface font, and IBM Plex Mono for the code font.

[SynapticSage]

FYI for those following this issue: the author of jupyter-themes is working on a lab-themes package, https://github.com/dunovank/jupyter-themes

[nicdelillo]

Hi @josesho , thank you! May I ask you a quick tip? In the variable.css, what is the variable name and colour for the running cell, and the variable name that deetrmines the darker blue of the notebook background ?

[dschaehi]

Check my gist for replacing jupyterlab dark theme with solarized dark theme. https://gist.github.com/dschaehi/ff6d30e6779a683053a1f078af178cdb#gistcomment-2980539

[dschaehi]

Here is an easy way to install my solarized dark theme:

1. Install the Stylus Extension
2. Install the solarized dark theme available here