How to set color of cell output of jupyter notebook (.ipynb) in VS Code editor?

Question

Sometimes it is convenient to deal with jupyter notebooks from the VS Code editor (faster load, less latency and easier debugging).
Nonetheless, there is a problem that default theme colors are not contrast enough to distinguish between input and output cells.

I'm having a hard time to figure out which setting I should change, to, let us say, make the output cell background just "dark-grey" (I'm using default VS 2019 Dark theme but other options are also not contrast with .ipynb files). Any help will be welcome.

(I've also come across other similar questions but did not find the turn key solution.)

Example:

I have the same problem myself, switching different colour themes and when I found the one I like them the colour contrast for the cells is not correct, so I figure out a way you can change that to your linking please see my post here hope that helps — Ricardo Sanchez
– Ricardo Sanchez, Commented Apr 15, 2021 at 13:27

hongkail · Accepted Answer · 2021-11-03 01:41:16Z

4

In the settings.json -- can be found at File(Windows)/Code(Mac)>Preferences>Settings -- click on any link stated "Edit in settings.json"

Adding this into the json will work -- notebook's setting has to be put under the workbench.colorCustomizations.

"workbench.colorCustomizations": {
"notebook.outputContainerBackgroundColor": "#FFFFFF",
  },

edited Nov 3, 2021 at 1:41

answered Oct 29, 2021 at 9:05

hongkail

7891 gold badge11 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Guillermo Brachetta · Accepted Answer · 2021-01-24 14:49:10Z

1

I'm not sure if this helps you, but you can try overriding VSCode's theme by adding this to your settings.json file:

{
  "jupyter.ignoreVscodeTheme": true
}

If you prefer to use VSCode's gui to edit settings, you can go to your Jupyter extension (assuming you have it installed) => Extension settings => and check "Ignore Vscode Theme".

You need to restart or reload VSCode for this to take effect.

answered Jan 24, 2021 at 14:49

Guillermo Brachetta

4,9635 gold badges29 silver badges45 bronze badges

4 Comments

garej Over a year ago

that seems to work. But do you know where can I change the color of input or output separately?

Guillermo Brachetta Over a year ago

Glad to hear! Please mark it as accepted answer if that works for you :)

Guillermo Brachetta Over a year ago

I'm afraid that's not possible at the moment, after reading some of the issues on github... :(

datalifenyc Over a year ago

This setting slightly improves the contrast between input cell and output. However, there is a warning that "this setting is deprecated and will be removed in the next release." I am currently using VSC 1.61.2.

Collectives™ on Stack Overflow

How to set color of cell output of jupyter notebook (.ipynb) in VS Code editor?

2 Answers 2

Comments

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related