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#0e0f18
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#0D0E16
  • editor.findMatchBackground#D85F00
  • editor.foreground#CEDBE5
  • editor.selectionBackground#1E1E33
  • editorCursor.background#D85F00
  • editorCursor.foreground#CEDBE5
  • editorGroup.border#0F1019
  • editorGutter.background#0D0E16
  • editorLineNumber.activeForeground#D85F00
  • editorLineNumber.foreground#585C6C
  • inlineChatInput.background#0e0f18
  • inlineChatInput.foreground#CEDBE5
  • inlineChatInput.placeholderForeground#D85F00
  • input.background#0e0f18
  • input.foreground#CEDBE5
  • input.placeholderForeground#D85F00
  • panel.background#0D0E16
  • sideBar.background#0e0f18
  • statusBar.background#464A56
  • statusBar.foreground#ffffff
  • statusBar.noFolderBackground#030306
  • statusBarItem.remoteBackground#464A56
  • statusBarItem.remoteForeground#ffffff

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#D83441
comment#D8B941
markup.heading#D83441
entity.name.tag#767676
entity.name.tag#D83441
comment#767676
markup.underline.link#8041D8
keyword#3679D8
markup.fenced_code, markup.inline.raw
markup.list#D83441
invalid#D83441
keyword#D85F00
keyword#79D836
invalid.deprecated#D85F00
invalid.deprecated
markup.inserted#79D836
markup.inserted#79D836
comment#AB11D8
comment#D83441
comment#D85F00
comment#79D836
comment#8041D8
keyword#36D8BD
gitDecoration.addedResourceForeground#79D836
gitDecoration.untrackedResourceForeground#9ae168
gitDecoration.ignoredResourceForeground#767676
gitDecoration.renamedResourceForeground#9ae168
gitDecoration.modifiedResourceForeground#AB11D8
breadcrumb.foreground, tree.tableColumnHeader.foreground#79D836
explorer.fileForeground#CEDBE5
explorer.directoryForeground#CEDBE5
comment.documentation#696969
editorSuggestWidget.highlightForeground#D85F00
editorSuggestWidget.selectedBackground
editorSuggestWidget.background#CEDBE5
invalid#FF0000
invalid#D8B941
invalid#3679D8
invalid#3679D8
invalid#79D836
invalid, invalid.deprecated#D85F00
invalid#D83441
invalid.deprecated#D85F00
invalid#D83441
invalid#D83441
invalid.deprecated#D85F00
invalid#D83441
invalid.deprecated#D85F00
invalid#D83441
entity.name.type#D83441
variable#FFA500
entity.name.function#4D4DDDDDDDDD
constant#FF1493
string#FFA500
comment.documentation#767676
diffEditor.insertedTextBackground#79D836
diffEditor.removedTextBackground#D83441
invalid#FF0000
entity.name.function#36D8BD
diff.insertedTextBackground#79D836
diff.removedTextBackground#D83441
meta.diff.header.file#3679D8
meta.diff.header#36D8BD
invalid.deprecated#D83441
invalid.deprecated#D85F00
entity.name.function#86e7d7
invalid.deprecated#D85F00
string#FFFFE0
invalid.deprecated#D85F00
invalid#D83441
invalid.deprecated#D85F00
invalid#D83441
variable#79D836
variable#8041D8
variable#767676
comment#767676
comment#CEDBE5
comment.documentation#79D836
editor.findMatchBackground#79D836
editor.findMatchHighlightBackground#D0D0D0
editor.findMatchBackground, editor.findMatchHighlightBackground#D0D0D0
string.regexp#3679D8
string.regexp#3679D8
string.regexp#79D836
meta.preprocessor, keyword.control.import#3679D8
invalid.deprecated#D85F00
invalid.deprecated#D85F00
constant, constant.language, support.constant#8041D8
constant#8041D8
storage.type, support.type, entity.name.type#3679D8
entity.name.type#3679D8
variable#86e7d7
variable, variable.other#86e7d7
variable#86e7d7
entity.name.function#D8B941
entity.name.function, support.function#D8B941
entity.name.function#D8B941
support.function, support.class, support.type#3679D8
keyword, storage, keyword.control, storage.modifier#D83441
keyword#D83441
comment.documentation#8041D8
comment.documentation, comment.block.documentation#9ae168
comment.documentation#9ae168
string, string.quoted, string.template#79D836
string#79D836
comment, punctuation.definition.comment#767676
comment#767676
comment, punctuation.definition.comment#767676
comment#767676
invalid#0F1019
invalid
invalid.illegal#0F1019
editor.wordHighlightStrongBackground#D83441
invalid.deprecated#D85F00
invalid.illegal#D83441
editorCursor.foreground
editorGutter.background#585C6C
editorGroup.border#0F1019
editorGroupHeader.tabsBackground
statusBar.noFolderBackground#B2B2B2
statusBar.background, statusBar.foreground
editorLineNumber.activeForeground
editorLineNumber.activeForeground#D85F00
editorLineNumber.foreground#585C6C
invalid.deprecated
editor.selectionHighlightBackground
editor.selectionBackground, editor.selectionForeground
editor.findMatchBackground#0F1019

Shiki preview

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

Loading...