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.background#2C3E50
  • activityBar.foreground#FFFFFF
  • activityBarBadge.background#0077CC
  • activityBarBadge.foreground#FFFFFF
  • badge.background#006DAF
  • badge.foreground#FFFFFF
  • breadcrumb.background#FFFFFF
  • breadcrumb.focusForeground#333333
  • breadcrumb.foreground#666666
  • breadcrumbPicker.background#F5F5F5
  • button.background#006DAF
  • button.foreground#FFFFFF
  • button.hoverBackground#005A8C
  • dropdown.background#FFFFFF
  • dropdown.border#CCCCCC
  • dropdown.foreground#333333
  • editor.background#FFFFFF
  • editor.findMatchBackground#FFFF00
  • editor.findMatchHighlightBackground#FFFF0066
  • editor.foreground#333333
  • editor.lineHighlightBackground#FFFFD7
  • editor.selectionBackground#ADD6FF
  • editor.selectionHighlightBackground#ADD6FF80
  • editor.wordHighlightBackground#D0D0D0
  • editor.wordHighlightStrongBackground#CAD8FA
  • editorBracketMatch.background#C9E8FF
  • editorBracketMatch.border#5896D6
  • editorCursor.foreground#000000
  • editorError.foreground#D0372D
  • editorGutter.background#F7F7F7
  • editorIndentGuide.activeBackground1#939393
  • editorIndentGuide.background1#D3D3D3
  • editorInfo.foreground#006DAF
  • editorLineNumber.activeForeground#333333
  • editorLineNumber.foreground#999999
  • editorRuler.foreground#D3D3D3
  • editorSuggestWidget.background#F3F3F3
  • editorSuggestWidget.border#C8C8C8
  • editorSuggestWidget.selectedBackground#D0E8FF
  • editorWarning.foreground#EA6300
  • editorWidget.background#F3F3F3
  • editorWidget.border#C8C8C8
  • gitDecoration.conflictingResourceForeground#EA6300
  • gitDecoration.deletedResourceForeground#D0372D
  • gitDecoration.ignoredResourceForeground#A0A1A7
  • gitDecoration.modifiedResourceForeground#006DAF
  • gitDecoration.untrackedResourceForeground#2EAE2C
  • input.background#FFFFFF
  • input.border#CCCCCC
  • input.foreground#333333
  • input.placeholderForeground#999999
  • inputOption.activeBorder#0077CC
  • list.activeSelectionBackground#006DAF
  • list.activeSelectionForeground#FFFFFF
  • list.focusBackground#D0E8FF
  • list.highlightForeground#000000
  • list.hoverBackground#E8E8E8
  • list.inactiveSelectionBackground#D0D0D0
  • minimap.background#F5F5F5
  • minimapSlider.background#CCCCCC40
  • minimapSlider.hoverBackground#AAAAAA40
  • notebook.cellBorderColor#E0E0E0
  • notebook.cellEditorBackground#FFFFE0
  • panel.background#F5F5F5
  • panel.border#E0E0E0
  • panelTitle.activeBorder#0077CC
  • panelTitle.activeForeground#333333
  • panelTitle.inactiveForeground#666666
  • peekView.border#006DAF
  • peekViewEditor.background#F5F5F5
  • peekViewResult.background#F3F3F3
  • peekViewTitle.background#FFFFFF
  • quickInput.background#FFFFFF
  • quickInput.foreground#333333
  • quickInputList.focusBackground#cce5ff
  • quickInputList.focusForeground#000000
  • quickInputTitle.background#F5F5F5
  • scimax.exampleBlockBackground#E0F0FFB0
  • scimax.quoteBlockBackground#FFFFD7B0
  • scimax.resultsBackground#F0F0F0B0
  • scimax.srcBlock.bashBackground#FFFFDFB0
  • scimax.srcBlock.bashHeaderBackground#E8E8C8B0
  • scimax.srcBlock.cBackground#E8E8FFB0
  • scimax.srcBlock.cHeaderBackground#D0D0E8B0
  • scimax.srcBlock.cppBackground#E8E8FFB0
  • scimax.srcBlock.cppHeaderBackground#D0D0E8B0
  • scimax.srcBlock.elispBackground#FFDFFFB0
  • scimax.srcBlock.elispHeaderBackground#E8C8E8B0
  • scimax.srcBlock.emacsLispBackground#FFDFFFB0
  • scimax.srcBlock.emacsLispHeaderBackground#E8C8E8B0
  • scimax.srcBlock.goBackground#DFFFE8B0
  • scimax.srcBlock.goHeaderBackground#C8E8D0B0
  • scimax.srcBlock.javaBackground#FFE8E8B0
  • scimax.srcBlock.javaHeaderBackground#E8D0D0B0
  • scimax.srcBlock.javascriptBackground#FFFFD0B0
  • scimax.srcBlock.javascriptHeaderBackground#E8E8B8B0
  • scimax.srcBlock.jsBackground#FFFFD0B0
  • scimax.srcBlock.jsHeaderBackground#E8E8B8B0
  • scimax.srcBlock.juliaBackground#E8DFFFB0
  • scimax.srcBlock.juliaHeaderBackground#D0C8E8B0
  • scimax.srcBlock.jupyterJuliaBackground#E8DFFFB0
  • scimax.srcBlock.jupyterJuliaHeaderBackground#D0C8E8B0
  • scimax.srcBlock.jupyterPythonBackground#DFFFFFB0
  • scimax.srcBlock.jupyterPythonHeaderBackground#B8E8E8B0
  • scimax.srcBlock.jupyterRBackground#FFDFEFB0
  • scimax.srcBlock.jupyterRHeaderBackground#E8C8D8B0
  • scimax.srcBlock.pythonBackground#DFFFDFB0
  • scimax.srcBlock.pythonHeaderBackground#C8E8C8B0
  • scimax.srcBlock.rBackground#FFDFE8B0
  • scimax.srcBlock.rHeaderBackground#E8C8D0B0
  • scimax.srcBlock.rustBackground#FFE8DFB0
  • scimax.srcBlock.rustHeaderBackground#E8D0C8B0
  • scimax.srcBlock.shBackground#FFFFDFB0
  • scimax.srcBlock.shellBackground#FFFFDFB0
  • scimax.srcBlock.shellHeaderBackground#E8E8C8B0
  • scimax.srcBlock.shHeaderBackground#E8E8C8B0
  • scimax.srcBlock.sqlBackground#FFEFDFB0
  • scimax.srcBlock.sqlHeaderBackground#E8D8C8B0
  • scimax.srcBlock.tsBackground#DFEEFFB0
  • scimax.srcBlock.tsHeaderBackground#C8D8E8B0
  • scimax.srcBlock.typescriptBackground#DFEEFFB0
  • scimax.srcBlock.typescriptHeaderBackground#C8D8E8B0
  • scimax.srcBlockBackground#DFFFDFB0
  • scimax.srcBlockHeaderBackground#C8E8C8B0
  • scimax.tableBackground#DFFFDFB0
  • scrollbar.shadow#00000020
  • scrollbarSlider.activeBackground#99999980
  • scrollbarSlider.background#CCCCCC80
  • scrollbarSlider.hoverBackground#AAAAAA80
  • sideBar.background#F5F5F5
  • sideBar.foreground#333333
  • sideBarSectionHeader.background#E8E8E8
  • sideBarSectionHeader.foreground#333333
  • sideBarTitle.foreground#333333
  • statusBar.background#333333
  • statusBar.debuggingBackground#D0372D
  • statusBar.foreground#FFFFFF
  • statusBar.noFolderBackground#555555
  • tab.activeBackground#FFFFFF
  • tab.activeBorderTop#0077CC
  • tab.activeForeground#333333
  • tab.border#E0E0E0
  • tab.inactiveBackground#ECECEC
  • tab.inactiveForeground#666666
  • terminal.background#FFFFFF
  • terminal.foreground#333333
  • titleBar.activeBackground#DDDDDD
  • titleBar.activeForeground#333333
  • titleBar.inactiveBackground#EEEEEE
  • titleBar.inactiveForeground#666666

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#A0A1A7italic
string, string.quoted#008000
constant.numeric#7F7F7F
constant, constant.language#D0372D
keyword, storage.type, storage.modifier#0000FF
keyword.control#0000FF
keyword.operator#333333
entity.name.function, support.function#006699
entity.name.class, entity.name.type.class, support.class#6434A3bold
entity.name.type, support.type#6434A3
variable, variable.other#BA36A5
variable.parameter#BA36A5
variable.other.property, support.variable.property#333333
entity.name.tag#0000FF
entity.other.attribute-name#6434A3
punctuation#333333
string.regexp#D0372D
constant.character.escape#D0372D
invalid, invalid.illegal#FF0000bold underline
invalid.deprecated#333333strikethrough
heading.1, markup.heading.1, entity.name.section.heading1, entity.name.section.level1, markup.heading.1.org, entity.name.section.org#3C3C3Cbold
heading.2, markup.heading.2, entity.name.section.heading2, entity.name.section.level2, markup.heading.2.org#123555bold
heading.3, markup.heading.3, entity.name.section.heading3, entity.name.section.level3, markup.heading.3.org#005522bold
heading.4, markup.heading.4, entity.name.section.heading4, entity.name.section.level4, markup.heading.4.org#EA6300bold
heading.5, markup.heading.5, entity.name.section.heading5, entity.name.section.level5#E3258Dbold
heading.6, markup.heading.6, entity.name.section.heading6, entity.name.section.level6#0077CCbold
markup.bold, punctuation.definition.boldbold
markup.italic, punctuation.definition.italicitalic
markup.underlineunderline
markup.strikethroughstrikethrough
markup.command.content.org#8B0000
markup.command.delimiter.begin.org, markup.command.delimiter.end.org#CD5C5C
punctuation.definition.bold.begin.org, punctuation.definition.bold.end.org, punctuation.definition.italic.begin.org, punctuation.definition.italic.end.org, punctuation.definition.underline.begin.org, punctuation.definition.underline.end.org, punctuation.definition.verbatim.begin.org, punctuation.definition.verbatim.end.org, punctuation.definition.raw.begin.org, punctuation.definition.raw.end.org, punctuation.definition.strikethrough.begin.org, punctuation.definition.strikethrough.end.org#AAAAAA
markup.underline.link, string.other.link, markup.underline.link.org#006DAFunderline
markup.inline.raw, markup.raw, markup.fenced_code, markup.raw.inline, string.other.verbatim.org#006400
markup.quote#666666italic
markup.list, punctuation.definition.list#7F7F7F
keyword.other.todo.org#D8ABA7bold
keyword.other.done.org#89C58Fbold
entity.name.tag.org, meta.tag.org#8B864E
meta.property.org, keyword.other.property.org#6434A3
meta.drawer.org, keyword.other.drawer.org#0000FF
constant.other.timestamp.org, string.other.timestamp.org#6434A3
meta.block.begin.org, meta.block.end.org, keyword.control.block.org#000088
entity.other.citation.org, variable.other.citation.key.org#006400
markup.underline.link.ref.org, keyword.other.ref.org#E3258D
entity.name.label.org#E3258D
markup.math.inline.latex.org, markup.math.display.latex.org, markup.math.display.bracket.latex.org, markup.math.inline.paren.latex.org, markup.math.content.org, markup.math.block.latex.org#3465A4
support.type.property-name.json#006699
entity.name.tag.yaml#006699
support.type.property-name.css#006699
support.constant.property-value.css#6434A3
keyword.other.unit.css#008000
variable.language.self, variable.language.this#0000FFitalic
entity.name.function.decorator, meta.decorator#6434A3
string.quoted.docstring#008000italic
Scimax for VS Code by John Kitchin - VS Code Theme