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#1d1e2a
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#1a1b26
  • editor.findMatchBackground#b4f9f8
  • editor.foreground#a9b1d6
  • editor.selectionBackground#414868
  • editorCursor.background#b4f9f8
  • editorCursor.foreground#a9b1d6
  • editorGroup.border#252630
  • editorGutter.background#191a25
  • editorLineNumber.activeForeground#c0caf5
  • editorLineNumber.foreground#51587a
  • inlineChatInput.background#1c1d29
  • inlineChatInput.foreground#bac3eb
  • inlineChatInput.placeholderForeground#b4f9f8
  • input.background#1c1d29
  • input.foreground#bac3eb
  • input.placeholderForeground#b4f9f8
  • panel.background#1a1b26
  • sideBar.background#1d1e2a
  • statusBar.background#161620
  • statusBar.foreground#a9b1d6
  • statusBar.noFolderBackground#171822
  • statusBarItem.remoteBackground#161620
  • statusBarItem.remoteForeground#a9b1d6

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#bb9af7—
comment#51587a—
markup.heading#7dcfff—
entity.name.tag#9aa5ce—
entity.name.tag#bb9af7—
comment#51587a—
markup.underline.link#bb9af7—
keyword#c0caf5—
markup.fenced_code, markup.inline.raw#7dcfff—
markup.list#f7768e—
invalid#f7768e—
keyword#e0af68—
keyword#9ece6a—
invalid.deprecated#e0af68—
invalid.deprecated——
markup.inserted#73daca—
markup.inserted#5caea1—
comment#9aa5ce—
comment#bb9af7—
comment#ff9e64—
comment#73daca—
comment#bb9af7—
keyword#b4f9f8—
gitDecoration.addedResourceForeground#73daca—
gitDecoration.untrackedResourceForeground#7c819b—
gitDecoration.ignoredResourceForeground#51587a—
gitDecoration.renamedResourceForeground#e0af68—
gitDecoration.modifiedResourceForeground#73daca—
breadcrumb.foreground, tree.tableColumnHeader.foreground#bb9af7—
explorer.fileForeground#a9b1d6—
explorer.directoryForeground#c0caf5—
comment.documentation#696969—
editorSuggestWidget.highlightForeground#b4f9f8—
editorSuggestWidget.selectedBackground——
editorSuggestWidget.background#a9b1d6—
invalid#FF0000—
invalid#7aa2f7—
invalid#c0caf5—
invalid#c0caf5—
invalid#b4f9f8—
invalid#73daca—
invalid, invalid.deprecated#e0af68—
invalid#f7768e—
invalid.deprecated#e0af68—
invalid#f7768e—
invalid#f7768e—
invalid.deprecated#e0af68—
invalid#f7768e—
invalid.deprecated#e0af68—
invalid#f7768e—
entity.name.type#bb9af7—
variable#FFA500—
entity.name.function#4D4DDDDDDDDD—
constant#FF1493—
string#FFA500—
comment.documentation#51587a—
diffEditor.insertedTextBackground#73daca—
diffEditor.removedTextBackground#f7768e—
invalid#FF0000—
entity.name.function#b4f9f8—
diff.insertedTextBackground#73daca—
diff.removedTextBackground#f7768e—
meta.diff.header.file#7aa2f7—
meta.diff.header#b4f9f8—
invalid.deprecated#f7768e—
invalid.deprecated#e0af68—
entity.name.function#c0caf5—
invalid.deprecated#e0af68—
string#FFFFE0—
invalid.deprecated#e0af68—
invalid#f7768e—
invalid.deprecated#e0af68—
invalid#f7768e—
variable#73daca—
variable#bb9af7—
variable#8189af—
comment#8189af—
comment#a9b1d6—
comment.documentation#73daca—
editor.findMatchBackground#73daca—
editor.findMatchHighlightBackground#c0caf5—
editor.findMatchBackground, editor.findMatchHighlightBackground#c0caf5—
string.regexp#7dcfff—
string.regexp#7dcfff—
string.regexp#9ece6a—
meta.preprocessor, keyword.control.import#7dcfff—
invalid.deprecated#e0af68—
invalid.deprecated#e0af68—
constant, constant.language, support.constant#ff9e64—
constant#ff9e64—
storage.type, support.type, entity.name.type#c0caf5—
entity.name.type#c0caf5—
variable#c0caf5—
variable, variable.other#c0caf5—
variable#c0caf5—
entity.name.function#7aa2f7—
entity.name.function, support.function#7aa2f7—
entity.name.function#7aa2f7—
support.function, support.class, support.type#f7768e—
keyword, storage, keyword.control, storage.modifier#bb9af7—
keyword#bb9af7—
comment.documentation#ff9e64—
comment.documentation, comment.block.documentation#7c819b—
comment.documentation#7c819b—
string, string.quoted, string.template#9ece6a—
string#9ece6a—
comment, punctuation.definition.comment#51587a—
comment#51587a—
comment, punctuation.definition.comment#51587a—
comment#51587a—
invalid#414868—
invalid——
invalid.illegal#414868—
editor.wordHighlightStrongBackground#f7768e—
invalid.deprecated#e0af68—
invalid.illegal#f7768e—
editorCursor.foreground——
editorGutter.background#8189af—
editorGroup.border#252630—
editorGroupHeader.tabsBackground——
statusBar.noFolderBackground#9099c0—
statusBar.background, statusBar.foreground——
editorLineNumber.activeForeground——
editorLineNumber.activeForeground#c0caf5—
editorLineNumber.foreground#51587a—
invalid.deprecated——
editor.selectionHighlightBackground——
editor.selectionBackground, editor.selectionForeground——
editor.findMatchBackground#414868—