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#000000
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#000000
  • editor.findMatchBackground#0170bf
  • editor.foreground#bbc2cf
  • editor.selectionBackground#00365a
  • editorCursor.background#0170bf
  • editorCursor.foreground#bbc2cf
  • editorGroup.border#1c1f24
  • editorGutter.background#000000
  • editorLineNumber.activeForeground#DFDFDF
  • editorLineNumber.foreground#5b6065
  • inlineChatInput.background#000000
  • inlineChatInput.foreground#bbc2cf
  • inlineChatInput.placeholderForeground#0170bf
  • input.background#000000
  • input.foreground#bbc2cf
  • input.placeholderForeground#0170bf
  • panel.background#000000
  • sideBar.background#000000
  • statusBar.background#1e2126
  • statusBar.foreground#bbc2cf
  • statusBar.noFolderBackground#000000
  • statusBarItem.remoteBackground#1e2126
  • statusBarItem.remoteForeground#bbc2cf

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#DFDFDF
comment#98be65
markup.heading#ff6c6b
entity.name.tag#5B6268
entity.name.tag#DFDFDF
comment#98be65
markup.underline.link#c678dd
keyword#DFDFDF
markup.fenced_code, markup.inline.raw
markup.list#ff6c6b
invalid#ff6c6b
keyword#ECBE7B
keyword#b4916d
invalid.deprecated#ECBE7B
invalid.deprecated
markup.inserted#98be65
markup.inserted#799850
comment#a9a1e1
comment#bbc2cf
comment#b4916d
comment#98be65
comment#c678dd
keyword#46D9FF
gitDecoration.addedResourceForeground#98be65
gitDecoration.untrackedResourceForeground#81a155
gitDecoration.ignoredResourceForeground#98be65
gitDecoration.renamedResourceForeground#81a155
gitDecoration.modifiedResourceForeground#a9a1e1
breadcrumb.foreground, tree.tableColumnHeader.foreground#b4916d
explorer.fileForeground#bbc2cf
explorer.directoryForeground#bbc2cf
comment.documentation#696969
editorSuggestWidget.highlightForeground#0170bf
editorSuggestWidget.selectedBackground
editorSuggestWidget.background#bbc2cf
invalid#FF0000
invalid#DFDFDF
invalid#DFDFDF
invalid#DFDFDF
invalid#98be65
invalid, invalid.deprecated#ECBE7B
invalid#ff6c6b
invalid.deprecated#ECBE7B
invalid#ff6c6b
invalid#ff6c6b
invalid.deprecated#ECBE7B
invalid#ff6c6b
invalid.deprecated#ECBE7B
invalid#ff6c6b
entity.name.type#DFDFDF
variable#FFA500
entity.name.function#4D4DDDDDDDDD
constant#FF1493
string#FFA500
comment.documentation#98be65
diffEditor.insertedTextBackground#98be65
diffEditor.removedTextBackground#ff6c6b
invalid#FF0000
entity.name.function#46D9FF
diff.insertedTextBackground#98be65
diff.removedTextBackground#ff6c6b
meta.diff.header.file#0170bf
meta.diff.header#46D9FF
invalid.deprecated#ff6c6b
invalid.deprecated#ECBE7B
entity.name.function#bbc2cf
invalid.deprecated#ECBE7B
string#FFFFE0
invalid.deprecated#ECBE7B
invalid#ff6c6b
invalid.deprecated#ECBE7B
invalid#ff6c6b
variable#98be65
variable#c678dd
variable#5B6268
comment#5B6268
comment#bbc2cf
comment.documentation#98be65
editor.findMatchBackground#98be65
editor.findMatchHighlightBackground#DFDFDF
editor.findMatchBackground, editor.findMatchHighlightBackground#DFDFDF
string.regexp#bbc2cf
string.regexp#bbc2cf
string.regexp#b4916d
meta.preprocessor, keyword.control.import#bbc2cf
invalid.deprecated#ECBE7B
invalid.deprecated#ECBE7B
constant, constant.language, support.constant#bbc2cf
constant#bbc2cf
storage.type, support.type, entity.name.type#DFDFDF
entity.name.type#DFDFDF
variable#bbc2cf
variable, variable.other#bbc2cf
variable#bbc2cf
entity.name.function#DFDFDF
entity.name.function, support.function#DFDFDF
entity.name.function#DFDFDF
support.function, support.class, support.type#DFDFDF
keyword, storage, keyword.control, storage.modifier#DFDFDF
keyword#DFDFDF
comment.documentation#bbc2cf
comment.documentation, comment.block.documentation#81a155
comment.documentation#81a155
string, string.quoted, string.template#b4916d
string#b4916d
comment, punctuation.definition.comment#98be65
comment#98be65
comment, punctuation.definition.comment#98be65
comment#98be65
invalid#1B2229
invalid
invalid.illegal#1B2229
editor.wordHighlightStrongBackground#ff6c6b
invalid.deprecated#ECBE7B
invalid.illegal#ff6c6b
editorCursor.foreground
editorGutter.background#3f444a
editorGroup.border#1c1f24
editorGroupHeader.tabsBackground
statusBar.noFolderBackground#747295
statusBar.background, statusBar.foreground
editorLineNumber.activeForeground
editorLineNumber.activeForeground#DFDFDF
editorLineNumber.foreground#5b6065
invalid.deprecated
editor.selectionHighlightBackground
editor.selectionBackground, editor.selectionForeground
editor.findMatchBackground#1B2229

Shiki preview

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

Loading...