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#2e282a
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#2a2426
  • editor.findMatchBackground#d9bb80
  • editor.foreground#e6d6ac
  • editor.selectionBackground#504945
  • editorCursor.background#FFFFFF
  • editorCursor.foreground#e6d6ac
  • editorGroup.border#5b5b5b
  • editorGutter.background#2a2426
  • editorLineNumber.activeForeground#e6d6ac
  • editorLineNumber.foreground#7c6f64
  • inlineChatInput.background#2d2729
  • inlineChatInput.foreground#fdebbd
  • inlineChatInput.placeholderForeground#87c095
  • input.background#2d2729
  • input.foreground#fdebbd
  • input.placeholderForeground#87c095
  • panel.background#2a2426
  • sideBar.background#2e282a
  • statusBar.background#504945
  • statusBar.foreground#e1d7c0
  • statusBar.noFolderBackground#2a2426
  • statusBarItem.remoteBackground#504945
  • statusBarItem.remoteForeground#e1d7c0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#e68183
comment#5b5b5b
markup.heading#d9bb80
entity.name.tag#87c095
entity.name.tag#e68183
comment#5b5b5b
markup.underline.link#e68183
keyword#d9bb80
markup.fenced_code, markup.inline.raw
markup.list#e68183
invalid#e68183
keyword#d9bb80
keyword#87af87
invalid.deprecated#d9bb80
invalid.deprecated
markup.inserted#729472
markup.inserted#5b765b
comment#d3a0bc
comment#e68183
comment#e39b7b
comment#87af87
comment#e68183
keyword#87c095
gitDecoration.addedResourceForeground#729472
gitDecoration.untrackedResourceForeground#e1d7c0
gitDecoration.ignoredResourceForeground#5b5b5b
gitDecoration.renamedResourceForeground#e1d7c0
gitDecoration.modifiedResourceForeground#d3a0bc
breadcrumb.foreground, tree.tableColumnHeader.foreground#87af87
explorer.fileForeground#e6d6ac
explorer.directoryForeground#e6d6ac
comment.documentation#696969
editorSuggestWidget.highlightForeground#87c095
editorSuggestWidget.selectedBackground
editorSuggestWidget.background#e6d6ac
invalid#FF0000
invalid#87c095
invalid#d9bb80
invalid#d9bb80
invalid#87af87
invalid, invalid.deprecated#d9bb80
invalid#e68183
invalid.deprecated#d9bb80
invalid#e68183
invalid.deprecated
invalid
invalid#e68183
invalid.deprecated#d9bb80
invalid#e68183
invalid.deprecated#d9bb80
invalid#e68183
entity.name.type#e68183
variable#FFA500
entity.name.function#4D4DDDDDDDDD
constant#FF1493
string#FFA500
comment.documentation#5b5b5b
diffEditor.insertedTextBackground#87af87
diffEditor.removedTextBackground#e68183
invalid#FF0000
entity.name.function#87c095
diff.insertedTextBackground#87af87
diff.removedTextBackground#e68183
meta.diff.header.file#89beba
meta.diff.header#87c095
invalid.deprecated#e68183
invalid.deprecated#d9bb80
entity.name.function#87c095
invalid.deprecated#d9bb80
string#FFFFE0
invalid.deprecated#d9bb80
invalid#e68183
invalid.deprecated#d9bb80
invalid#e68183
variable#87af87
variable#e68183
variable#5b5b5b
comment#5b5b5b
comment#e6d6ac
comment.documentation#87af87
editor.findMatchBackground#87af87
editor.findMatchHighlightBackground#0d1011
editor.findMatchBackground, editor.findMatchHighlightBackground#0d1011
string.regexp#87c095
string.regexp#87c095
string.regexp#87af87
meta.preprocessor, keyword.control.import#87c095
invalid.deprecated#d9bb80
invalid.deprecated#d9bb80
constant, constant.language, support.constant#d3a0bc
constant#d3a0bc
storage.type, support.type, entity.name.type#d9bb80
entity.name.type#d9bb80
variable#87c095
variable, variable.other#87c095
variable#87c095
entity.name.function#87c095
entity.name.function, support.function#87c095
entity.name.function#87c095
support.function, support.class, support.type#e39b7b
keyword, storage, keyword.control, storage.modifier#e68183
keyword#e68183
comment.documentation#d3a0bc
comment.documentation, comment.block.documentation#e1d7c0
comment.documentation#e1d7c0
string, string.quoted, string.template#87af87
string#87af87
comment, punctuation.definition.comment#5b5b5b
comment#5b5b5b
comment, punctuation.definition.comment#5b5b5b
comment#5b5b5b
invalid#0d1011
invalid
invalid.illegal
editor.wordHighlightStrongBackground
invalid.deprecated#d9bb80
invalid.illegal#e68183
editorCursor.foreground
editorGutter.background#5b5b5b
editorGroup.border#5b5b5b
editorGroupHeader.tabsBackground#e1d7c0
statusBar.noFolderBackground#5b5b5b
statusBar.background, statusBar.foreground#e1d7c0
editorLineNumber.activeForeground
editorLineNumber.activeForeground#e6d6ac
editorLineNumber.foreground#7c6f64
invalid.deprecated
editor.selectionHighlightBackground
editor.selectionBackground, editor.selectionForeground
editor.findMatchBackground#0d1011

Shiki preview

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

Loading...

Emacs Themes Ported - Coding Theme