Skip to main content
Coding Theme

VS Code preview

Full workbench mockup using this variant's colors and tokenColors.

Loading...

colors

Workbench UI color keys from the theme JSON colors map.

  • activityBar.activeBackground#fffeff
  • activityBar.activeBorder#f37626
  • activityBar.activeFocusBorder#bdbdbd
  • activityBar.background#eeeeee
  • activityBar.foreground#606060
  • activityBar.inactiveForeground#606060
  • button.background#2096f3
  • editor.background#fffeff
  • editor.foreground#212121
  • editorBracketHighlight.foreground1#212121
  • editorBracketHighlight.foreground2#212121
  • editorBracketHighlight.foreground3#212121
  • editorBracketHighlight.foreground4#212121
  • editorBracketHighlight.foreground5#212121
  • editorBracketHighlight.foreground6#212121
  • editorBracketPairGuide.activeBackground1#212121
  • editorBracketPairGuide.activeBackground2#212121
  • editorBracketPairGuide.activeBackground3#212121
  • editorBracketPairGuide.activeBackground4#212121
  • editorBracketPairGuide.activeBackground5#212121
  • editorBracketPairGuide.activeBackground6#212121
  • editorBracketPairGuide.background1#212121
  • editorBracketPairGuide.background2#212121
  • editorBracketPairGuide.background3#212121
  • editorBracketPairGuide.background4#212121
  • editorBracketPairGuide.background5#212121
  • editorBracketPairGuide.background6#212121
  • editorLineNumber.foreground#999999
  • list.activeSelectionIconForeground#fff
  • notebook.selectedCellBackground#fffeff
  • statusBar.background#eeeeee
  • statusBar.debuggingBackground#f37626
  • statusBar.debuggingForeground#fffeff
  • statusBar.foreground#282929
  • statusBar.noFolderBackground#2096f3
  • statusBar.noFolderForeground#fffeff
  • statusBarItem.activeBackground#b3b3b3
  • statusBarItem.hoverBackground#b3b3b3

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
string.quoted.docstring.multi.python, string.quoted.docstring.single.python, string.quoted.multi.python, string.quoted.single.python, storage.type.string.python, string.regexp.quoted.single.python, string.regexp.quoted.multi.python#ba2223
constant.numeric.float.python, constant.numeric.dec.python, storage.type.imaginary.number.python#007f01
keyword.operator.arithmetic.python, keyword.operator.bitwise.python, keyword.operator.comparison.python, keyword.operator.assignment.python, keyword.operator.unpacking.parameter.python, keyword.operator.unpacking.arguments.python#a922ffbold
punctuation.definition.comment.python, comment.line.number-sign.python#407f7fitalic
support.type.python, support.function.builtin.python, meta.indexed-name.python#007f01
punctuation.separator.annotation.result.python, invalid.illegal.annotation.python#a922ffbold
constant.language.python, storage.type.function.python, storage.type.class.python, keyword.control.flow.python, keyword.control.import.python, keyword.operator.logical.python, storage.type.function.lambda.python#007f01bold
entity.name.type.class.python, entity.name.function.python, support.function.magic.python#1400ff
variable.parameter.function.language.special.self.python, variable.parameter.function.language.special.cls.python, variable.language.special.self.python, meta.attribute.python, meta.function-call.generic.python#0055a9
entity.name.function.decorator.python, meta.function.decorator.python#a922ff
markup.heading#1400ffbold
markup.inline.raw#498040
meta.link#4B83CD
markup.bold, markup.bold.markdown#212121bold
markup.italic, markup.italic.markdown#212121italic
markup.quote#009900
markup.list#4B83CD
markup.traceback#ba2223

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

JupyterLab Light Theme - Coding Theme