Hi!
What are the RGB (or hex) colors used for code in Jupyter notebook? I mean of the red used for strings, the purple used for operators, etc.
Also, fonts are Arial for text and Menlo for code, is that right?
I have been browsing around for a while looking for these info, but I could not find them. So I thought about writing here - hope it’s fine!
Thanks a lot for helping!
Serena
CodeMirror helps provide what the notebook is using for the code highlighting that you experience, see here. I’m trying to locate more about where the color codes are detailed. So far this is closest I’ve found. (UPDATE: There is also some listed here in this later answer to a different question with indication on where to find them.)
Based on “The pygments theme in use mimics JupyterLab’s codemirror mode with the same CSS variables” in the post here another place to dig around to find the colors may be in nbconverts use of pygments to make HTML. In this regard, the preview generation code at the bottom of this section seems nice; however, on the test Binder instance I was looking at first listing of default didn’t quite match with the notebook cells if you paste those four lines in the test code block in a notebook. (print is green when pasting it in a cell results in print being red.) Plus, this suggests a place to look for the conversion css and templates nbconvert uses.
Hi! Thanks for replying so quickly! I honestly got a bit lost in all this code again, and I could not find what I was looking for… So I went easy: I used the Digital Color Meter (app on MacOS)!
Here are the RGB colors I got, in case anybody else needs them:
red (strings): 186,34,32
black (variables): 33,33,33
purple (operators): 170,35,255
green (keywords and python built-in functions): 0,128,0
green (comments): 64,128,128
blue (type built-in functions): 0,85,170
grey (cell background): 245,245,246
grey (cell border): 224, 224, 224
Thanks for posting what you found by your direct method. That may be plenty enough for many folks.
I had wondered if using your favorite browser’s web development tools where you can inspect elements may have let you get similar data by hand?
With my approach I was sort of hoping to find where the information was to get the exact defined values as they have to be in there somewhere. That way I’ll hopefully learn the inner workings of Jupyter a little better and make it possible to process to RGB and even hexcodes programmatically. I found more custom schemes css out there in GitHub that could be parsed the way I was hoping to for the standard settings.
Yes, I agree that finding the exact values from some css somewhere would be ideal, but I guess I am just in a rush! But, ye, I would love to actually see the correct values as well!