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#8e3e3b
  • editor.foreground#ffffff
  • editor.selectionBackground#5a5a5a
  • editor.selectionForeground#ffffff
  • editorCursor.background#ff5f5f
  • editorCursor.foreground#ffffff
  • editorGroup.border#646464
  • editorGutter.background#1e1e1e
  • editorLineNumber.activeForeground#ffffff
  • editorLineNumber.foreground#989898
  • inlineChatInput.background#000000
  • inlineChatInput.foreground#ffffff
  • inlineChatInput.placeholderForeground#6ae4b9
  • input.background#000000
  • input.foreground#ffffff
  • input.placeholderForeground#6ae4b9
  • panel.background#000000
  • sideBar.background#000000
  • statusBar.background#003c52
  • statusBar.foreground#f0f0f0
  • statusBar.noFolderBackground#2d2d2d
  • statusBarItem.remoteBackground#003c52
  • statusBarItem.remoteForeground#f0f0f0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#ff9070
comment#ff9070
entity.name.tag#989898
entity.name.tag#79a8ff
comment#ff9070
markup.underline.link#a0d7f2
keyword#989898
markup.fenced_code, markup.inline.raw
markup.list#989898
invalid#ff6740
keyword#feacd0
keyword#ff7f86
invalid.deprecated#feacd0
invalid.deprecated
markup.inserted#9fdfdf
markup.inserted#9fdfdf
comment#ff9070
comment#6ae4b9
comment#ff9070
comment#00d3d0
comment#ff6740
comment#00d3d0
keyword#ff7f86
gitDecoration.addedResourceForeground#00d3d0
gitDecoration.untrackedResourceForeground#00d3d0
gitDecoration.ignoredResourceForeground#989898
gitDecoration.modifiedResourceForeground#feacd0
breadcrumb.foreground, tree.tableColumnHeader.foreground#00d3d0
explorer.fileForeground#ffffff
explorer.directoryForeground#00d3d0
comment.documentation#696969
editorSuggestWidget.highlightForeground#00d3d0
editorSuggestWidget.selectedBackground
editorSuggestWidget.background
invalid#FF0000
invalid#4ae2ff
invalid#79a8ff
invalid#79a8ff
invalid#00d3d0
invalid, invalid.deprecated#feacd0
invalid#ff6740
invalid.deprecated#ffffff
invalid#ffffff
invalid#ffffff
invalid.deprecated#feacd0
invalid#ff7fbf
invalid.deprecated#F3EA98
invalid#FC5C94
entity.name.type#ff7f86
variable#6ae4b9
entity.name.function#4ae2ff
constant#88ca9f
string#00d3d0
comment.documentation#989898
diffEditor.insertedTextBackground#9fdfdf
diffEditor.removedTextBackground#ffbfbf
invalid#ff6740
entity.name.function
diff.insertedTextBackground#9fdfdf
diff.removedTextBackground#ffbfbf
invalid.deprecated#ff6740
invalid.deprecated#feacd0
entity.name.function#feacd0
invalid.deprecated#feacd0
string#00d3d0
invalid.deprecated#feacd0
invalid#ff6740
invalid.deprecated#feacd0
invalid#ff6740
variable#6ae4b9
variable#989898
comment#ff9070
comment#ff9070
comment.documentation#a0d7f2
entity.name.function#ff6740
editor.findMatchBackground#ffffff
editor.findMatchHighlightBackground#ffffff
editor.findMatchBackground, editor.findMatchHighlightBackground#ffffff
string.regexp#ff5f59
string.regexp#feacd0
string.regexp#00d3d0
meta.preprocessor, keyword.control.import#ff6740
invalid.deprecated#feacd0
invalid.deprecated#feacd0
constant, constant.language, support.constant#88ca9f
constant#88ca9f
storage.type, support.type, entity.name.type#79a8ff
entity.name.type#79a8ff
variable#76afbf
variable, variable.other#6ae4b9
variable#6ae4b9
entity.name.function#9099d9
entity.name.function, support.function#4ae2ff
entity.name.function#4ae2ff
support.function, support.class, support.type#feacd0
keyword, storage, keyword.control, storage.modifier#ff7f86
keyword#ff7f86
comment.documentation#caa6df
comment.documentation, comment.block.documentation#a0d7f2
comment.documentation#a0d7f2
string, string.quoted, string.template#00d3d0
string#00d3d0
comment, punctuation.definition.comment#ff9070
comment#ff9070
comment, punctuation.definition.comment#ff9070
comment#ff9070
invalid#ffffff
invalid#ffffff
invalid.illegal#ffffff
editor.wordHighlightStrongBackground#ffffff
invalid.deprecated#feacd0
invalid.illegal#ff6740
editorCursor.foreground
editorGutter.background#ffffff
editorGroup.border#646464
editorGroupHeader.tabsBackground
statusBar.noFolderBackground#969696
statusBar.background, statusBar.foreground#f0f0f0
editorLineNumber.activeForeground#00d3d0
editorLineNumber.activeForeground#ffffff
editorLineNumber.foreground#989898
invalid.deprecated
editor.selectionHighlightBackground#ffffff
editor.selectionBackground, editor.selectionForeground#ffffff
editor.findMatchBackground#ffffff

Shiki preview

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

Loading...

Emacs Themes Ported - Coding Theme