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#282b35
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#242730
  • editor.findMatchBackground#51afef
  • editor.foreground#bbc2cf
  • editor.selectionBackground#3d4451
  • editorCursor.background#51afef
  • editorCursor.foreground#bbc2cf
  • editorGroup.border#1c1f24
  • editorGutter.background#242730
  • editorLineNumber.activeForeground#51afef
  • editorLineNumber.foreground#484854
  • inlineChatInput.background#272a34
  • inlineChatInput.foreground#eaf3ff
  • inlineChatInput.placeholderForeground#51afef
  • input.background#272a34
  • input.foreground#eaf3ff
  • input.placeholderForeground#51afef
  • panel.background#242730
  • sideBar.background#282b35
  • statusBar.background#1e2128
  • statusBar.foreground#bbc2cf
  • statusBar.noFolderBackground#21242c
  • statusBarItem.remoteBackground#1e2128
  • statusBarItem.remoteForeground#bbc2cf

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#51afef—
comment#62686E—
markup.heading#ff665c—
entity.name.tag#C57BDB—
entity.name.tag#51afef—
comment#62686E—
markup.underline.link#C57BDB—
keyword#FCCE7B—
markup.fenced_code, markup.inline.raw——
markup.list#ff665c—
invalid#ff665c—
keyword#FCCE7B—
keyword#7bc275—
invalid.deprecated#FCCE7B—
invalid.deprecated——
markup.inserted#7bc275—
markup.inserted#629b5d—
comment#a991f1—
comment#51afef—
comment#e69055—
comment#7bc275—
comment#C57BDB—
keyword#5cEfFF—
gitDecoration.addedResourceForeground#7bc275—
gitDecoration.untrackedResourceForeground#7e7e87—
gitDecoration.ignoredResourceForeground#62686E—
gitDecoration.renamedResourceForeground#7e7e87—
gitDecoration.modifiedResourceForeground#a991f1—
breadcrumb.foreground, tree.tableColumnHeader.foreground#7bc275—
explorer.fileForeground#bbc2cf—
explorer.directoryForeground#bbc2cf—
comment.documentation#696969—
editorSuggestWidget.highlightForeground#51afef—
editorSuggestWidget.selectedBackground——
editorSuggestWidget.background#bbc2cf—
invalid#FF0000—
invalid#5cEfFF—
invalid#FCCE7B—
invalid#FCCE7B—
invalid#7bc275—
invalid, invalid.deprecated#FCCE7B—
invalid#ff665c—
invalid.deprecated#FCCE7B—
invalid#ff665c—
invalid#ff665c—
invalid.deprecated#FCCE7B—
invalid#ff665c—
invalid.deprecated#FCCE7B—
invalid#ff665c—
entity.name.type#51afef—
variable#FFA500—
entity.name.function#4D4DDDDDDDDD—
constant#FF1493—
string#FFA500—
comment.documentation#62686E—
diffEditor.insertedTextBackground#7bc275—
diffEditor.removedTextBackground#ff665c—
invalid#FF0000—
entity.name.function#5cEfFF—
diff.insertedTextBackground#7bc275—
diff.removedTextBackground#ff665c—
meta.diff.header.file#51afef—
meta.diff.header#5cEfFF—
invalid.deprecated#ff665c—
invalid.deprecated#FCCE7B—
entity.name.function#dcafe9—
invalid.deprecated#FCCE7B—
string#FFFFE0—
invalid.deprecated#FCCE7B—
invalid#ff665c—
invalid.deprecated#FCCE7B—
invalid#ff665c—
variable#7bc275—
variable#C57BDB—
variable#484854—
comment#484854—
comment#bbc2cf—
comment.documentation#7bc275—
editor.findMatchBackground#7bc275—
editor.findMatchHighlightBackground#DFDFDF—
editor.findMatchBackground, editor.findMatchHighlightBackground#DFDFDF—
string.regexp#C57BDB—
string.regexp#C57BDB—
string.regexp#7bc275—
meta.preprocessor, keyword.control.import#C57BDB—
invalid.deprecated#FCCE7B—
invalid.deprecated#FCCE7B—
constant, constant.language, support.constant#a991f1—
constant#a991f1—
storage.type, support.type, entity.name.type#FCCE7B—
entity.name.type#FCCE7B—
variable#dcafe9—
variable, variable.other#dcafe9—
variable#dcafe9—
entity.name.function#5cEfFF—
entity.name.function, support.function#5cEfFF—
entity.name.function#5cEfFF—
support.function, support.class, support.type#C57BDB—
keyword, storage, keyword.control, storage.modifier#51afef—
keyword#51afef—
comment.documentation#a991f1—
comment.documentation, comment.block.documentation#7e7e87—
comment.documentation#7e7e87—
string, string.quoted, string.template#7bc275—
string#7bc275—
comment, punctuation.definition.comment#62686E—
comment#62686E—
comment, punctuation.definition.comment#62686E—
comment#62686E—
invalid#1c1f24—
invalid——
invalid.illegal#1c1f24—
editor.wordHighlightStrongBackground#ff665c—
invalid.deprecated#FCCE7B—
invalid.illegal#ff665c—
editorCursor.foreground——
editorGutter.background#484854—
editorGroup.border#1c1f24—
editorGroupHeader.tabsBackground#bbc2cf—
statusBar.noFolderBackground#495c73—
statusBar.background, statusBar.foreground#bbc2cf—
editorLineNumber.activeForeground——
editorLineNumber.activeForeground#51afef—
editorLineNumber.foreground#484854—
invalid.deprecated——
editor.selectionHighlightBackground——
editor.selectionBackground, editor.selectionForeground——
editor.findMatchBackground#1c1f24—