Change jupyter lab css values from within?

I’d eventually like to develop some JL themes, but first I just want to experiment with changing colors or fonts of a few items.

Is there a way I can change, the background color of a code cell from within jupyterlab? Perhaps a way I can run a javascript snippet which let’s me get at css values in the window and change them?

I know this can be done via the browser console or the developer tools window, but I’d like to do this from within jupyter lab.

An %%html cell in a notebook (or console) will do the trick:

%%html
<style>
:root {
  --jp-layout-color1: red;
}
</style>

There’s also jupyterlab-fonts, which is abused extensively in jupyterlab-deck.

2 Likes