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#0e1219
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#0d1017
  • editor.findMatchBackground#e6b450
  • editor.foreground#bfbdb6
  • editor.selectionBackground#213145
  • editorCursor.background#e6b450
  • editorCursor.foreground#bfbdb6
  • editorGroup.border#07080c
  • editorGutter.background#0d1017
  • editorLineNumber.activeForeground#bfbdb6
  • editorLineNumber.foreground#f5faff
  • inlineChatInput.background#0e1119
  • inlineChatInput.foreground#bfbdb6
  • inlineChatInput.placeholderForeground#e6b450
  • input.background#0e1119
  • input.foreground#bfbdb6
  • input.placeholderForeground#e6b450
  • panel.background#0d1017
  • sideBar.background#0e1219
  • statusBar.background#080a0f
  • statusBar.foreground#bfbdb6
  • statusBar.noFolderBackground#090c11
  • statusBarItem.remoteBackground#080a0f
  • statusBarItem.remoteForeground#bfbdb6

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#ff8f40
comment#373b42
markup.heading#f07178
entity.name.tag#373b42
entity.name.tag#ff8f40
comment#373b42
markup.underline.link#d2a6ff
keyword#e6b673
markup.fenced_code, markup.inline.raw
markup.list#f07178
invalid#d95757
keyword#ffb454
keyword#7fd962
invalid.deprecated#ffb454
invalid.deprecated
markup.inserted#aad94c
markup.inserted#88ad3c
comment#dbb7ff
comment#ff8f40
comment#ff8f40
comment#7fd962
comment#d2a6ff
keyword#39bae6
gitDecoration.addedResourceForeground#aad94c
gitDecoration.untrackedResourceForeground#696c71
gitDecoration.ignoredResourceForeground#373b42
gitDecoration.renamedResourceForeground#696c71
gitDecoration.modifiedResourceForeground#dbb7ff
breadcrumb.foreground, tree.tableColumnHeader.foreground#7fd962
explorer.fileForeground#bfbdb6
explorer.directoryForeground#bfbdb6
comment.documentation#696969
editorSuggestWidget.highlightForeground#e6b450
editorSuggestWidget.selectedBackground
editorSuggestWidget.background#bfbdb6
invalid#FF0000
invalid#ffb454
invalid#e6b673
invalid#e6b673
invalid#7fd962
invalid, invalid.deprecated#ffb454
invalid#d95757
invalid.deprecated#ffb454
invalid#d95757
invalid#d95757
invalid.deprecated#ffb454
invalid#d95757
invalid.deprecated#ffb454
invalid#d95757
entity.name.type#ff8f40
variable#FFA500
entity.name.function#4D4DDDDDDDDD
constant#FF1493
string#FFA500
comment.documentation#373b42
diffEditor.insertedTextBackground#7fd962
diffEditor.removedTextBackground#f26d78
invalid#FF0000
entity.name.function#39bae6
diff.insertedTextBackground#7fd962
diff.removedTextBackground#f26d78
meta.diff.header.file#59c2ff
meta.diff.header#39bae6
invalid.deprecated#d95757
invalid.deprecated#ffb454
entity.name.function#bfbdb6
invalid.deprecated#ffb454
string#FFFFE0
invalid.deprecated#ffb454
invalid#d95757
invalid.deprecated#ffb454
invalid#d95757
variable#7fd962
variable#d2a6ff
variable#090c11
comment#090c11
comment#bfbdb6
comment.documentation#7fd962
editor.findMatchBackground#7fd962
editor.findMatchHighlightBackground#07080c
editor.findMatchBackground, editor.findMatchHighlightBackground#07080c
string.regexp#f29668
string.regexp#f29668
string.regexp#7fd962
meta.preprocessor, keyword.control.import#f29668
invalid.deprecated#ffb454
invalid.deprecated#ffb454
constant, constant.language, support.constant#d2a6ff
constant#d2a6ff
storage.type, support.type, entity.name.type#e6b673
entity.name.type#e6b673
variable#bfbdb6
variable, variable.other#bfbdb6
variable#bfbdb6
entity.name.function#ffb454
entity.name.function, support.function#ffb454
entity.name.function#ffb454
keyword, storage, keyword.control, storage.modifier#ff8f40
keyword#ff8f40
comment.documentation#d2a6ff
comment.documentation, comment.block.documentation#696c71
comment.documentation#696c71
string, string.quoted, string.template#7fd962
string#7fd962
comment, punctuation.definition.comment#373b42
comment#373b42
comment, punctuation.definition.comment#373b42
comment#373b42
invalid#2f3238
invalid
invalid.illegal#2f3238
editor.wordHighlightStrongBackground#bfbdb6
invalid.deprecated#ffb454
invalid.illegal#d95757
editorCursor.foreground
editorGutter.background#f5faff
editorGroup.border#07080c
editorGroupHeader.tabsBackground#bfbdb6
statusBar.noFolderBackground#bfbdb6
statusBar.background, statusBar.foreground#bfbdb6
editorLineNumber.activeForeground
editorLineNumber.activeForeground#bfbdb6
editorLineNumber.foreground#f5faff
invalid.deprecated
editor.selectionHighlightBackground
editor.selectionBackground, editor.selectionForeground
editor.findMatchBackground#2f3238

Shiki preview

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

Loading...