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#dfdde6
  • activityBar.foreground#333333
  • activityBar.inactiveForeground#666666
  • editor.background#f8f5ff
  • editor.findMatchBackground#aaeccf
  • editor.foreground#4f3363
  • editor.selectionBackground#eed0ff
  • editorCursor.background#4f45ff
  • editorCursor.foreground#4f3363
  • editorGroup.border#c6bac5
  • editorGutter.background#f8f5ff
  • editorLineNumber.activeForeground#c035aa
  • editorLineNumber.foreground#786e74
  • inlineChatInput.background#dad8e0
  • inlineChatInput.foreground#2f1f3b
  • inlineChatInput.placeholderForeground#065fbf
  • input.background#dad8e0
  • input.foreground#2f1f3b
  • input.placeholderForeground#065fbf
  • panel.background#f8f5ff
  • sideBar.background#dfdde6
  • statusBar.background#ddb4ff
  • statusBar.foreground#241f48
  • statusBar.noFolderBackground#e3e0e9
  • statusBarItem.remoteBackground#ddb4ff
  • statusBarItem.remoteForeground#241f48

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#a05b5f—
comment#a24568—
entity.name.tag#786e74—
entity.name.tag#0f7a9d—
comment#a05b5f—
markup.underline.link#3f7668—
keyword#786e74—
markup.fenced_code, markup.inline.raw——
markup.list#786e74—
invalid#d03033—
keyword#b8532f—
keyword#ad45ba—
invalid.deprecated#b8532f—
invalid.deprecated——
markup.inserted#005000—
markup.inserted#005000—
comment#a05b5f—
comment#5165e4—
comment#a05b5f—
comment#c035aa—
comment#007f6f—
comment#c035aa—
keyword#ad45ba—
gitDecoration.addedResourceForeground#057800—
gitDecoration.untrackedResourceForeground#057800—
gitDecoration.ignoredResourceForeground#786e74—
gitDecoration.modifiedResourceForeground#b8532f—
breadcrumb.foreground, tree.tableColumnHeader.foreground#c035aa—
explorer.fileForeground#4f3363—
explorer.directoryForeground#c035aa—
comment.documentation#696969—
editorSuggestWidget.highlightForeground#c035aa—
editorSuggestWidget.selectedBackground——
editorSuggestWidget.background——
invalid#FF0000—
invalid#5165e4—
invalid#0f7a9d—
invalid#0f7a9d—
invalid#057800—
invalid, invalid.deprecated#b8532f—
invalid#d03033—
invalid.deprecated#b8532f—
invalid#d03033—
invalid#d03033—
invalid.deprecated#b8532f—
invalid#7f0000—
invalid.deprecated#F3EA98—
invalid#FC5C94—
entity.name.type#ad45ba—
variable#3f6faf—
entity.name.function#5165e4—
constant#c035aa—
string#007f6f—
comment.documentation#786e74—
diffEditor.insertedTextBackground#005000—
diffEditor.removedTextBackground#8f1313—
invalid#d03033—
entity.name.function——
diff.insertedTextBackground#005000—
diff.removedTextBackground#8f1313—
invalid.deprecated#d03033—
invalid.deprecated#b8532f—
entity.name.function#b8532f—
invalid.deprecated#b8532f—
string#007f6f—
invalid.deprecated#b8532f—
invalid#d03033—
invalid.deprecated#b8532f—
invalid#d03033—
variable#3f6faf—
variable#786e74—
comment#a05b5f—
comment#a05b5f—
comment.documentation#804fb0—
entity.name.function#b8532f—
editor.findMatchBackground#4f3363—
editor.findMatchHighlightBackground#4f3363—
editor.findMatchBackground, editor.findMatchHighlightBackground#4f3363—
string.regexp#c3303a—
string.regexp#ad45ba—
string.regexp#007f6f—
meta.preprocessor, keyword.control.import#c01f5f—
invalid.deprecated#b8532f—
invalid.deprecated#b8532f—
constant, constant.language, support.constant#c035aa—
constant#c035aa—
storage.type, support.type, entity.name.type#0f7a9d—
entity.name.type#0f7a9d—
variable#5f60bf—
variable, variable.other#3f6faf—
variable#3f6faf—
entity.name.function#6060d0—
entity.name.function, support.function#5165e4—
entity.name.function#5165e4—
support.function, support.class, support.type#705ae3—
keyword, storage, keyword.control, storage.modifier#ad45ba—
keyword#ad45ba—
comment.documentation#804fb0—
comment.documentation, comment.block.documentation#804fb0—
comment.documentation#804fb0—
string, string.quoted, string.template#007f6f—
string#007f6f—
comment, punctuation.definition.comment#a05b5f—
comment#a05b5f—
comment, punctuation.definition.comment#a05b5f—
comment#a05b5f—
invalid#4f3363—
invalid#d03033—
invalid.illegal#d03033—
editor.wordHighlightStrongBackground#4f3363—
invalid.deprecated#b8532f—
invalid.illegal#d03033—
editorCursor.foreground——
editorGutter.background#4f3363—
editorGroup.border#c6bac5—
editorGroupHeader.tabsBackground——
statusBar.noFolderBackground#786e74—
statusBar.background, statusBar.foreground#241f48—
editorLineNumber.activeForeground#c035aa—
editorLineNumber.activeForeground#c035aa—
editorLineNumber.foreground#786e74—
invalid.deprecated——
editor.selectionHighlightBackground#4f3363—
editor.selectionBackground, editor.selectionForeground——
editor.findMatchBackground#4f3363—