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#2f3541
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#2b303b
  • editor.findMatchBackground#D08770
  • editor.foreground#c0c5ce
  • editor.selectionBackground#4f5b66
  • editorCursor.background#D08770
  • editorCursor.foreground#c0c5ce
  • editorGroup.border#20242c
  • editorGutter.background#2b303b
  • editorLineNumber.activeForeground#c0c5ce
  • editorLineNumber.foreground#4f5b66
  • inlineChatInput.background#2e3440
  • inlineChatInput.foreground#ffffff
  • inlineChatInput.placeholderForeground#D08770
  • input.background#2e3440
  • input.foreground#ffffff
  • input.placeholderForeground#D08770
  • panel.background#2b303b
  • sideBar.background#2f3541
  • statusBar.background#1c1f24
  • statusBar.foreground#c0c5ce
  • statusBar.noFolderBackground#21262d
  • statusBarItem.remoteBackground#1c1f24
  • statusBarItem.remoteForeground#c0c5ce

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#b48ead
comment#65737E
markup.heading#BF616A
entity.name.tag#65737E
entity.name.tag#b48ead
comment#65737E
markup.underline.link#c678dd
keyword#ECBE7B
markup.fenced_code, markup.inline.raw
markup.list#BF616A
invalid#BF616A
keyword#ECBE7B
keyword#A3BE8C
invalid.deprecated#ECBE7B
invalid.deprecated
markup.inserted#A3BE8C
markup.inserted#829870
comment#b48ead
comment#b48ead
comment#D08770
comment#A3BE8C
comment#c678dd
keyword#46D9FF
gitDecoration.addedResourceForeground#A3BE8C
gitDecoration.untrackedResourceForeground#8b969e
gitDecoration.ignoredResourceForeground#65737E
gitDecoration.renamedResourceForeground#8b969e
gitDecoration.modifiedResourceForeground#b48ead
breadcrumb.foreground, tree.tableColumnHeader.foreground#A3BE8C
explorer.fileForeground#c0c5ce
explorer.directoryForeground#c0c5ce
comment.documentation#696969
editorSuggestWidget.highlightForeground#D08770
editorSuggestWidget.selectedBackground
editorSuggestWidget.background#c0c5ce
invalid#FF0000
invalid#8FA1B3
invalid#ECBE7B
invalid#ECBE7B
invalid#A3BE8C
invalid, invalid.deprecated#ECBE7B
invalid#BF616A
invalid.deprecated#ECBE7B
invalid#BF616A
invalid#BF616A
invalid.deprecated#ECBE7B
invalid#BF616A
invalid.deprecated#ECBE7B
invalid#BF616A
entity.name.type#b48ead
variable#FFA500
entity.name.function#4D4DDDDDDDDD
constant#FF1493
string#FFA500
comment.documentation#65737E
diffEditor.insertedTextBackground#A3BE8C
diffEditor.removedTextBackground#BF616A
invalid#FF0000
entity.name.function#46D9FF
diff.insertedTextBackground#A3BE8C
diff.removedTextBackground#BF616A
meta.diff.header.file#8FA1B3
meta.diff.header#46D9FF
invalid.deprecated#BF616A
invalid.deprecated#ECBE7B
entity.name.function#BF616A
invalid.deprecated#ECBE7B
string#FFFFE0
invalid.deprecated#ECBE7B
invalid#BF616A
invalid.deprecated#ECBE7B
invalid#BF616A
variable#A3BE8C
variable#c678dd
variable#4f5b66
comment#4f5b66
comment#c0c5ce
comment.documentation#A3BE8C
editor.findMatchBackground#A3BE8C
editor.findMatchHighlightBackground#DFDFDF
editor.findMatchBackground, editor.findMatchHighlightBackground#DFDFDF
string.regexp#c0c5ce
string.regexp#c0c5ce
string.regexp#A3BE8C
meta.preprocessor, keyword.control.import#c0c5ce
invalid.deprecated#ECBE7B
invalid.deprecated#ECBE7B
constant, constant.language, support.constant#D08770
constant#D08770
storage.type, support.type, entity.name.type#ECBE7B
entity.name.type#ECBE7B
variable#BF616A
variable, variable.other#BF616A
variable#BF616A
entity.name.function#8FA1B3
entity.name.function, support.function#8FA1B3
entity.name.function#8FA1B3
support.function, support.class, support.type#D08770
keyword, storage, keyword.control, storage.modifier#b48ead
keyword#b48ead
comment.documentation#D08770
comment.documentation, comment.block.documentation#8b969e
comment.documentation#8b969e
string, string.quoted, string.template#A3BE8C
string#A3BE8C
comment, punctuation.definition.comment#65737E
comment#65737E
comment, punctuation.definition.comment#65737E
comment#65737E
invalid#1B2229
invalid
invalid.illegal#1B2229
editor.wordHighlightStrongBackground#BF616A
invalid.deprecated#ECBE7B
invalid.illegal#BF616A
editorCursor.foreground
editorGutter.background#4f5b66
editorGroup.border#20242c
editorGroupHeader.tabsBackground
statusBar.noFolderBackground#636574
statusBar.background, statusBar.foreground
editorLineNumber.activeForeground
editorLineNumber.activeForeground#c0c5ce
editorLineNumber.foreground#4f5b66
invalid.deprecated
editor.selectionHighlightBackground
editor.selectionBackground, editor.selectionForeground
editor.findMatchBackground#1B2229

Shiki preview

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

Loading...