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#1e2f39
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#1B2B34
  • editor.findMatchBackground#FAC863
  • editor.foreground#D8DEE9
  • editor.selectionBackground#4F5B66
  • editorCursor.background#FAC863
  • editorCursor.foreground#D8DEE9
  • editorGroup.border#1a1e23
  • editorGutter.background#1B2B34
  • editorLineNumber.activeForeground#D8DEE9
  • editorLineNumber.foreground#A7ADBA
  • inlineChatInput.background#1d2e38
  • inlineChatInput.foreground#eef4ff
  • inlineChatInput.placeholderForeground#FAC863
  • input.background#1d2e38
  • input.foreground#eef4ff
  • input.placeholderForeground#FAC863
  • panel.background#1B2B34
  • sideBar.background#1e2f39
  • statusBar.background#121f28
  • statusBar.foreground#D8DEE9
  • statusBar.noFolderBackground#14232D
  • statusBarItem.remoteBackground#121f28
  • statusBarItem.remoteForeground#D8DEE9

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#C594C5
comment#65737E
markup.heading#6699CC
entity.name.tag#C0C5CE
entity.name.tag#C594C5
comment#65737E
markup.underline.link#E27E8D
keyword#FAC863
markup.fenced_code, markup.inline.raw
markup.list#EC5f67
invalid#EC5f67
keyword#FAC863
keyword#99C794
invalid.deprecated#FAC863
invalid.deprecated
markup.inserted#99C794
markup.inserted#99C794
comment#C594C5
comment#C594C5
comment#F99157
comment#99C794
comment#E27E8D
keyword#5FB3B3
gitDecoration.addedResourceForeground#99C794
gitDecoration.untrackedResourceForeground#8b969e
gitDecoration.ignoredResourceForeground#65737E
gitDecoration.renamedResourceForeground#8b969e
gitDecoration.modifiedResourceForeground#C594C5
breadcrumb.foreground, tree.tableColumnHeader.foreground#99C794
explorer.fileForeground#D8DEE9
explorer.directoryForeground#D8DEE9
comment.documentation#696969
editorSuggestWidget.highlightForeground#FAC863
editorSuggestWidget.selectedBackground
editorSuggestWidget.background#D8DEE9
invalid#FF0000
invalid#6699CC
invalid#FAC863
invalid#FAC863
invalid#99C794
invalid, invalid.deprecated#FAC863
invalid#EC5f67
invalid.deprecated#FAC863
invalid#EC5f67
invalid#EC5f67
invalid.deprecated#FAC863
invalid#EC5f67
invalid.deprecated#FAC863
invalid#EC5f67
entity.name.type#C594C5
variable#FFA500
entity.name.function#4D4DDDDDDDDD
constant#FF1493
string#FFA500
comment.documentation#65737E
diffEditor.insertedTextBackground#99C794
diffEditor.removedTextBackground#EC5f67
invalid#FF0000
entity.name.function#5FB3B3
diff.insertedTextBackground#99C794
diff.removedTextBackground#EC5f67
meta.diff.header.file#6699CC
meta.diff.header#5FB3B3
invalid.deprecated#EC5f67
invalid.deprecated#FAC863
entity.name.function#F99157
invalid.deprecated#FAC863
string#FFFFE0
invalid.deprecated#FAC863
invalid#EC5f67
invalid.deprecated#FAC863
invalid#EC5f67
variable#99C794
variable#E27E8D
variable#A7ADBA
comment#A7ADBA
comment#D8DEE9
comment.documentation#99C794
editor.findMatchBackground#99C794
editor.findMatchHighlightBackground#D8DEE9
editor.findMatchBackground, editor.findMatchHighlightBackground#D8DEE9
string.regexp#5FB3B3
string.regexp#5FB3B3
string.regexp#99C794
meta.preprocessor, keyword.control.import#5FB3B3
invalid.deprecated#FAC863
invalid.deprecated#FAC863
constant, constant.language, support.constant#F99157
constant#F99157
storage.type, support.type, entity.name.type#FAC863
entity.name.type#FAC863
variable#F99157
variable, variable.other#F99157
variable#F99157
entity.name.function#6699CC
entity.name.function, support.function#6699CC
entity.name.function#6699CC
support.function, support.class, support.type#EC5f67
keyword, storage, keyword.control, storage.modifier#C594C5
keyword#C594C5
comment.documentation#F99157
comment.documentation, comment.block.documentation#8b969e
comment.documentation#8b969e
string, string.quoted, string.template#99C794
string#99C794
comment, punctuation.definition.comment#65737E
comment#65737E
comment, punctuation.definition.comment#65737E
comment#65737E
invalid#1B2B34
invalid
invalid.illegal#1B2B34
editor.wordHighlightStrongBackground#EC5f67
invalid.deprecated#FAC863
invalid.illegal#EC5f67
editorCursor.foreground
editorGutter.background#A7ADBA
editorGroup.border#1a1e23
editorGroupHeader.tabsBackground
statusBar.noFolderBackground#C0C5CE
statusBar.background, statusBar.foreground
editorLineNumber.activeForeground
editorLineNumber.activeForeground#D8DEE9
editorLineNumber.foreground#A7ADBA
invalid.deprecated
editor.selectionHighlightBackground
editor.selectionBackground, editor.selectionForeground
editor.findMatchBackground#1B2B34

Shiki preview

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

Loading...