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#373839
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#323334
  • editor.findMatchBackground#80A0C2
  • editor.foreground#eceff4
  • editor.selectionBackground#3f3f3f
  • editorCursor.background#80A0C2
  • editorCursor.foreground#eceff4
  • editorGroup.border#181818
  • editorGutter.background#323334
  • editorLineNumber.activeForeground#eceff4
  • editorLineNumber.foreground#727269
  • inlineChatInput.background#363738
  • inlineChatInput.foreground#ffffff
  • inlineChatInput.placeholderForeground#80A0C2
  • input.background#363738
  • input.foreground#ffffff
  • input.placeholderForeground#80A0C2
  • panel.background#323334
  • sideBar.background#373839
  • statusBar.background#1e1e20
  • statusBar.foreground#eceff4
  • statusBar.noFolderBackground#222224
  • statusBarItem.remoteBackground#1e1e20
  • statusBarItem.remoteForeground#eceff4

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#80A0C2—
comment#747474—
markup.heading#80A0C2—
entity.name.tag#80A0C2—
entity.name.tag#80A0C2—
comment#747474—
markup.underline.link#B58DAE—
keyword#ECCC87—
markup.fenced_code, markup.inline.raw——
markup.list#C16069—
invalid#C16069—
keyword#ECCC87—
keyword#A2BF8A—
invalid.deprecated#ECCC87—
invalid.deprecated——
markup.inserted#A2BF8A—
markup.inserted#81986e—
comment#5D80AE—
comment#80A0C2—
comment#D2876D—
comment#A2BF8A—
comment#B58DAE—
keyword#86C0D1—
gitDecoration.addedResourceForeground#A2BF8A—
gitDecoration.untrackedResourceForeground#7d7d7d—
gitDecoration.ignoredResourceForeground#747474—
gitDecoration.renamedResourceForeground#7d7d7d—
gitDecoration.modifiedResourceForeground#5D80AE—
breadcrumb.foreground, tree.tableColumnHeader.foreground#A2BF8A—
explorer.fileForeground#eceff4—
explorer.directoryForeground#eceff4—
comment.documentation#696969—
editorSuggestWidget.highlightForeground#80A0C2—
editorSuggestWidget.selectedBackground——
editorSuggestWidget.background#eceff4—
invalid#FF0000—
invalid#8EBCBB—
invalid#ECCC87—
invalid#ECCC87—
invalid#A2BF8A—
invalid, invalid.deprecated#ECCC87—
invalid#C16069—
invalid.deprecated#ECCC87—
invalid#C16069—
invalid#C16069—
invalid.deprecated#ECCC87—
invalid#C16069—
invalid.deprecated#ECCC87—
invalid#C16069—
entity.name.type#80A0C2—
variable#FFA500—
entity.name.function#4D4DDDDDDDDD—
constant#FF1493—
string#FFA500—
comment.documentation#747474—
diffEditor.insertedTextBackground#A2BF8A—
diffEditor.removedTextBackground#C16069—
invalid#FF0000—
entity.name.function#86C0D1—
diff.insertedTextBackground#A2BF8A—
diff.removedTextBackground#C16069—
meta.diff.header.file#80A0C2—
meta.diff.header#86C0D1—
invalid.deprecated#C16069—
invalid.deprecated#ECCC87—
entity.name.function#dac6d6—
invalid.deprecated#ECCC87—
string#FFFFE0—
invalid.deprecated#ECCC87—
invalid#C16069—
invalid.deprecated#ECCC87—
invalid#C16069—
variable#A2BF8A—
variable#B58DAE—
variable#3f3f3f—
comment#3f3f3f—
comment#eceff4—
comment.documentation#A2BF8A—
editor.findMatchBackground#A2BF8A—
editor.findMatchHighlightBackground#dfdfdf—
editor.findMatchBackground, editor.findMatchHighlightBackground#dfdfdf—
string.regexp#80A0C2—
string.regexp#80A0C2—
string.regexp#A2BF8A—
meta.preprocessor, keyword.control.import#80A0C2—
invalid.deprecated#ECCC87—
invalid.deprecated#ECCC87—
constant, constant.language, support.constant#B58DAE—
constant#B58DAE—
storage.type, support.type, entity.name.type#ECCC87—
entity.name.type#ECCC87—
variable#dac6d6—
variable, variable.other#dac6d6—
variable#dac6d6—
entity.name.function#8EBCBB—
entity.name.function, support.function#8EBCBB—
entity.name.function#8EBCBB—
support.function, support.class, support.type#8EBCBB—
keyword, storage, keyword.control, storage.modifier#80A0C2—
keyword#80A0C2—
comment.documentation#B58DAE—
comment.documentation, comment.block.documentation#7d7d7d—
comment.documentation#7d7d7d—
string, string.quoted, string.template#A2BF8A—
string#A2BF8A—
comment, punctuation.definition.comment#747474—
comment#747474—
comment, punctuation.definition.comment#747474—
comment#747474—
invalid#000000—
invalid——
invalid.illegal#000000—
editor.wordHighlightStrongBackground#C16069—
invalid.deprecated#ECCC87—
invalid.illegal#C16069—
editorCursor.foreground——
editorGutter.background#3f3f3f—
editorGroup.border#181818—
editorGroupHeader.tabsBackground——
statusBar.noFolderBackground#525252—
statusBar.background, statusBar.foreground——
editorLineNumber.activeForeground——
editorLineNumber.activeForeground#eceff4—
editorLineNumber.foreground#727269—
invalid.deprecated——
editor.selectionHighlightBackground——
editor.selectionBackground, editor.selectionForeground——
editor.findMatchBackground#000000—