Skip to main content
Coding Theme

Color themes

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#e6e6e6
  • activityBar.foreground#333333
  • activityBar.inactiveForeground#666666
  • editor.background#ffffff
  • editor.findMatchBackground#b2e4dc
  • editor.foreground#000000
  • editor.selectionBackground#bdbdbd
  • editor.selectionForeground#000000
  • editorCursor.background#000000
  • editorCursor.foreground#000000
  • editorGroup.border#9f9f9f
  • editorGutter.background#f2f2f2
  • editorLineNumber.activeForeground#000000
  • editorLineNumber.foreground#595959
  • inlineChatInput.background#e0e0e0
  • inlineChatInput.foreground#000000
  • inlineChatInput.placeholderForeground#005f5f
  • input.background#e0e0e0
  • input.foreground#000000
  • input.placeholderForeground#005f5f
  • panel.background#ffffff
  • sideBar.background#e6e6e6
  • statusBar.background#c8c8c8
  • statusBar.foreground#000000
  • statusBar.noFolderBackground#e6e6e6
  • statusBarItem.remoteBackground#c8c8c8
  • statusBarItem.remoteForeground#000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#595959
comment#7a4f2f
entity.name.tag#595959
entity.name.tag#005f5f
comment#595959
markup.underline.link#193668
keyword#595959
markup.fenced_code, markup.inline.raw
markup.list#595959
invalid#a60000
keyword#884900
keyword#531ab6
invalid.deprecated#884900
invalid.deprecated
markup.inserted#005000
markup.inserted#005000
comment#595959
comment#005e8b
comment#595959
comment#0031a9
comment#8f0075
comment#0031a9
keyword#531ab6
gitDecoration.addedResourceForeground#005f5f
gitDecoration.untrackedResourceForeground#005f5f
gitDecoration.ignoredResourceForeground#595959
gitDecoration.modifiedResourceForeground#884900
breadcrumb.foreground, tree.tableColumnHeader.foreground#0031a9
explorer.fileForeground#000000
explorer.directoryForeground#0031a9
comment.documentation#696969
editorSuggestWidget.highlightForeground#0031a9
editorSuggestWidget.selectedBackground
editorSuggestWidget.background
invalid#FF0000
invalid#721045
invalid#005f5f
invalid#005f5f
invalid#005f5f
invalid, invalid.deprecated#884900
invalid#a60000
invalid.deprecated#000000
invalid#000000
invalid#000000
invalid.deprecated#884900
invalid#7f0000
invalid.deprecated#F3EA98
invalid#FC5C94
entity.name.type#531ab6
variable#005e8b
entity.name.function#721045
constant#0000b0
string#3548cf
comment.documentation#595959
diffEditor.insertedTextBackground#005000
diffEditor.removedTextBackground#8f1313
invalid#a60000
entity.name.function
diff.insertedTextBackground#005000
diff.removedTextBackground#8f1313
invalid.deprecated#a60000
invalid.deprecated#884900
entity.name.function#884900
invalid.deprecated#884900
string#3548cf
invalid.deprecated#884900
invalid#a60000
invalid.deprecated#884900
invalid#a60000
variable#005e8b
variable#595959
comment#595959
comment#595959
comment.documentation#2a5045
entity.name.function#884900
editor.findMatchBackground#000000
editor.findMatchHighlightBackground#000000
editor.findMatchBackground, editor.findMatchHighlightBackground#000000
string.regexp#00663f
string.regexp#721045
string.regexp#3548cf
meta.preprocessor, keyword.control.import#a0132f
invalid.deprecated#884900
invalid.deprecated#884900
constant, constant.language, support.constant#0000b0
constant#0000b0
storage.type, support.type, entity.name.type#005f5f
entity.name.type#005f5f
variable#2f3f83
variable, variable.other#005e8b
variable#005e8b
entity.name.function#7b435c
entity.name.function, support.function#721045
entity.name.function#721045
support.function, support.class, support.type#8f0075
keyword, storage, keyword.control, storage.modifier#531ab6
keyword#531ab6
comment.documentation#7c318f
comment.documentation, comment.block.documentation#2a5045
comment.documentation#2a5045
string, string.quoted, string.template#3548cf
string#3548cf
comment, punctuation.definition.comment#595959
comment#595959
comment, punctuation.definition.comment#595959
comment#595959
invalid#000000
invalid#000000
invalid.illegal#000000
editor.wordHighlightStrongBackground#000000
invalid.deprecated#884900
invalid.illegal#a60000
editorCursor.foreground
editorGutter.background#000000
editorGroup.border#9f9f9f
editorGroupHeader.tabsBackground
statusBar.noFolderBackground#585858
statusBar.background, statusBar.foreground#000000
editorLineNumber.activeForeground#0031a9
editorLineNumber.activeForeground#000000
editorLineNumber.foreground#595959
invalid.deprecated
editor.selectionHighlightBackground#000000
editor.selectionBackground, editor.selectionForeground#000000
editor.findMatchBackground#000000

Shiki preview

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

Loading...

Emacs Themes Ported - Coding Theme