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#d8d5dc
  • activityBar.foreground#333333
  • activityBar.inactiveForeground#666666
  • editor.background#F0EDF4
  • editor.findMatchBackground#9783B1
  • editor.foreground#4A3B5E
  • editor.selectionBackground#d0cdd6
  • editorCursor.background#9783B1
  • editorCursor.foreground#4A3B5E
  • editorGroup.border#c3bdcc
  • editorGutter.background#F0EDF4
  • editorLineNumber.activeForeground#9783B1
  • editorLineNumber.foreground#bfb2cf
  • inlineChatInput.background#d3d1d7
  • inlineChatInput.foreground#292034
  • inlineChatInput.placeholderForeground#9783B1
  • input.background#d3d1d7
  • input.foreground#292034
  • input.placeholderForeground#9783B1
  • panel.background#F0EDF4
  • sideBar.background#d8d5dc
  • statusBar.background#E1DBE9
  • statusBar.foreground#4A3B5E
  • statusBar.noFolderBackground#d8d5db
  • statusBarItem.remoteBackground#E1DBE9
  • statusBarItem.remoteForeground#4A3B5E

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#875faf—
comment#B4A5C7—
markup.heading#dc322f—
entity.name.tag#9783B1—
entity.name.tag#875faf—
comment#B4A5C7—
markup.underline.link#f4649b—
keyword#f4649b—
markup.fenced_code, markup.inline.raw——
markup.list#dc322f—
invalid#dc322f—
keyword#a07000—
keyword#5f8700—
invalid.deprecated#a07000—
invalid.deprecated——
markup.inserted#5f8700—
markup.inserted#4c6c00—
comment#875faf—
comment#875faf—
comment#d75f00—
comment#5f8700—
comment#f4649b—
keyword#008ea1—
gitDecoration.addedResourceForeground#5f8700—
gitDecoration.untrackedResourceForeground#998ca9—
gitDecoration.ignoredResourceForeground#B4A5C7—
gitDecoration.renamedResourceForeground#998ca9—
gitDecoration.modifiedResourceForeground#875faf—
breadcrumb.foreground, tree.tableColumnHeader.foreground#008070—
explorer.fileForeground#4A3B5E—
explorer.directoryForeground#4A3B5E—
comment.documentation#696969—
editorSuggestWidget.highlightForeground#9783B1—
editorSuggestWidget.selectedBackground——
editorSuggestWidget.background#4A3B5E—
invalid#FF0000—
invalid#007daf—
invalid#f4649b—
invalid#f4649b—
invalid#5f8700—
invalid, invalid.deprecated#a07000—
invalid#dc322f—
invalid.deprecated#a07000—
invalid#dc322f—
invalid#dc322f—
invalid.deprecated#a07000—
invalid#dc322f—
invalid.deprecated#a07000—
invalid#dc322f—
entity.name.type#875faf—
variable#B22222—
entity.name.function#00008B—
constant#FF1493—
string#CD0000—
comment.documentation#B4A5C7—
diffEditor.insertedTextBackground#5f8700—
diffEditor.removedTextBackground#dc322f—
invalid#FF0000—
entity.name.function#008ea1—
diff.insertedTextBackground#5f8700—
diff.removedTextBackground#dc322f—
meta.diff.header.file#007daf—
meta.diff.header#008ea1—
invalid.deprecated#dc322f—
invalid.deprecated#a07000—
entity.name.function#513969—
invalid.deprecated#a07000—
string#00008B—
invalid.deprecated#a07000—
invalid#dc322f—
invalid.deprecated#a07000—
invalid#dc322f—
variable#5f8700—
variable#f4649b—
variable#B4A5C7—
comment#B4A5C7—
comment#4A3B5E—
comment.documentation#5f8700—
editor.findMatchBackground#5f8700—
editor.findMatchHighlightBackground#E8E4EE—
editor.findMatchBackground, editor.findMatchHighlightBackground#E8E4EE—
string.regexp#f4649b—
string.regexp#f4649b—
string.regexp#5f8700—
meta.preprocessor, keyword.control.import#f4649b—
invalid.deprecated#a07000—
invalid.deprecated#a07000—
constant, constant.language, support.constant#008070—
constant#008070—
storage.type, support.type, entity.name.type#f4649b—
entity.name.type#f4649b—
variable#513969—
variable, variable.other#513969—
variable#513969—
entity.name.function#007daf—
entity.name.function, support.function#007daf—
entity.name.function#007daf—
support.function, support.class, support.type#007daf—
keyword, storage, keyword.control, storage.modifier#875faf—
keyword#875faf—
comment.documentation#008070—
comment.documentation, comment.block.documentation#998ca9—
comment.documentation#998ca9—
string, string.quoted, string.template#5f8700—
string#5f8700—
comment, punctuation.definition.comment#B4A5C7—
comment#B4A5C7—
comment, punctuation.definition.comment#B4A5C7—
comment#B4A5C7—
invalid#E8E4EE—
invalid——
invalid.illegal#E8E4EE—
editor.wordHighlightStrongBackground#dc322f—
invalid.deprecated#a07000—
invalid.illegal#dc322f—
editorCursor.foreground——
editorGutter.background#B4A5C7—
editorGroup.border#c3bdcc—
editorGroupHeader.tabsBackground#4A3B5E—
statusBar.noFolderBackground#ab97c2—
statusBar.background, statusBar.foreground#4A3B5E—
editorLineNumber.activeForeground——
editorLineNumber.activeForeground#9783B1—
editorLineNumber.foreground#bfb2cf—
invalid.deprecated——
editor.selectionHighlightBackground——
editor.selectionBackground, editor.selectionForeground——
editor.findMatchBackground#E8E4EE—