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#002f3b
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#002b36
  • editor.findMatchBackground#268bd2
  • editor.foreground#839496
  • editor.selectionBackground#073642
  • editorCursor.background#268bd2
  • editorCursor.foreground#839496
  • editorGroup.border#011417
  • editorGutter.background#002b36
  • editorLineNumber.activeForeground#839496
  • editorLineNumber.foreground#56697A
  • inlineChatInput.background#002e3a
  • inlineChatInput.foreground#c5dee1
  • inlineChatInput.placeholderForeground#268bd2
  • input.background#002e3a
  • input.foreground#c5dee1
  • input.placeholderForeground#268bd2
  • panel.background#002b36
  • sideBar.background#002f3b
  • statusBar.background#002630
  • statusBar.foreground#aac0c3
  • statusBar.noFolderBackground#00212B
  • statusBarItem.remoteBackground#002630
  • statusBarItem.remoteForeground#aac0c3

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#859900
comment#405A61
markup.heading#dc322f
entity.name.tag#405A61
entity.name.tag#859900
comment#405A61
markup.underline.link#35a69c
keyword#b58900
markup.fenced_code, markup.inline.raw
markup.list#dc322f
invalid#dc322f
keyword#b58900
keyword#2aa198
invalid.deprecated#b58900
invalid.deprecated
markup.inserted#859900
markup.inserted#6a7a00
comment#6c71c4
comment#859900
comment#cb4b16
comment#859900
comment#d33682
keyword#2aa198
gitDecoration.addedResourceForeground#859900
gitDecoration.untrackedResourceForeground#35a69c
gitDecoration.ignoredResourceForeground#405A61
gitDecoration.renamedResourceForeground#35a69c
gitDecoration.modifiedResourceForeground#6c71c4
breadcrumb.foreground, tree.tableColumnHeader.foreground#2aa198
explorer.fileForeground#839496
explorer.directoryForeground#839496
comment.documentation#696969
editorSuggestWidget.highlightForeground#268bd2
editorSuggestWidget.selectedBackground
editorSuggestWidget.background#839496
invalid#FF0000
invalid#268bd2
invalid#b58900
invalid#b58900
invalid#859900
invalid, invalid.deprecated#b58900
invalid#dc322f
invalid.deprecated#b58900
invalid#dc322f
invalid#dc322f
invalid.deprecated#b58900
invalid#dc322f
invalid.deprecated#b58900
invalid#dc322f
entity.name.type#859900
variable#FFA500
entity.name.function#4D4DDDDDDDDD
constant#FF1493
string#FFA500
comment.documentation#405A61
diffEditor.insertedTextBackground#859900
diffEditor.removedTextBackground#dc322f
invalid#FF0000
entity.name.function#2aa198
diff.insertedTextBackground#859900
diff.removedTextBackground#dc322f
meta.diff.header.file#268bd2
meta.diff.header#2aa198
invalid.deprecated#dc322f
invalid.deprecated#b58900
entity.name.function#6c71c4
invalid.deprecated#b58900
string#FFFFE0
invalid.deprecated#b58900
invalid#dc322f
invalid.deprecated#b58900
invalid#dc322f
variable#859900
variable#d33682
variable#56697A
comment#56697A
comment#839496
comment.documentation#859900
editor.findMatchBackground#859900
editor.findMatchHighlightBackground#626C6C
editor.findMatchBackground, editor.findMatchHighlightBackground#626C6C
string.regexp#cb4b16
string.regexp#cb4b16
string.regexp#2aa198
meta.preprocessor, keyword.control.import#cb4b16
invalid.deprecated#b58900
invalid.deprecated#b58900
constant, constant.language, support.constant#d33682
constant#d33682
storage.type, support.type, entity.name.type#b58900
entity.name.type#b58900
variable#6c71c4
variable, variable.other#6c71c4
variable#6c71c4
entity.name.function#268bd2
entity.name.function, support.function#268bd2
entity.name.function#268bd2
support.function, support.class, support.type#268bd2
keyword, storage, keyword.control, storage.modifier#859900
keyword#859900
comment.documentation#d33682
comment.documentation, comment.block.documentation#35a69c
comment.documentation#35a69c
string, string.quoted, string.template#2aa198
string#2aa198
comment, punctuation.definition.comment#405A61
comment#405A61
comment, punctuation.definition.comment#405A61
comment#405A61
invalid#073642
invalid
invalid.illegal#073642
editor.wordHighlightStrongBackground#dc322f
invalid.deprecated#b58900
invalid.illegal#dc322f
editorCursor.foreground
editorGutter.background#56697A
editorGroup.border#011417
editorGroupHeader.tabsBackground
statusBar.noFolderBackground#405A61
statusBar.background, statusBar.foreground
editorLineNumber.activeForeground
editorLineNumber.activeForeground#839496
editorLineNumber.foreground#56697A
invalid.deprecated
editor.selectionHighlightBackground
editor.selectionBackground, editor.selectionForeground
editor.findMatchBackground#073642

Shiki preview

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

Loading...

Emacs Themes Ported - Coding Theme