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#211f36
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#1E1C31
  • editor.findMatchBackground#906CFF
  • editor.foreground#CBE3E7
  • editor.selectionBackground#3D4551
  • editorCursor.background#906CFF
  • editorCursor.foreground#CBE3E7
  • editorGroup.border#292F37
  • editorGutter.background#1E1C31
  • editorLineNumber.activeForeground#CBE3E7
  • editorLineNumber.foreground#565575
  • inlineChatInput.background#201e35
  • inlineChatInput.foreground#CBE3E7
  • inlineChatInput.placeholderForeground#906CFF
  • input.background#201e35
  • input.foreground#CBE3E7
  • input.placeholderForeground#906CFF
  • panel.background#1E1C31
  • sideBar.background#211f36
  • statusBar.background#1b192c
  • statusBar.foreground#CBE3E7
  • statusBar.noFolderBackground#1E1C31
  • statusBarItem.remoteBackground#1b192c
  • statusBarItem.remoteForeground#CBE3E7

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#FF8080
comment#565575
markup.heading#FF8080
entity.name.tag#858FA5
entity.name.tag#FF8080
comment#565575
markup.underline.link#C991E1
keyword#91DDFF
markup.fenced_code, markup.inline.raw
markup.list#FF8080
invalid#FF8080
keyword#FFE9AA
keyword#FFE9AA
invalid.deprecated#FFE9AA
invalid.deprecated
markup.inserted#95FFA4
markup.inserted#77cc83
comment#906CFF
comment#FF8080
comment#FFB378
comment#95FFA4
comment#C991E1
keyword#AAFFE4
gitDecoration.addedResourceForeground#95FFA4
gitDecoration.untrackedResourceForeground#858FA5
gitDecoration.ignoredResourceForeground#565575
gitDecoration.renamedResourceForeground#858FA5
gitDecoration.modifiedResourceForeground#906CFF
breadcrumb.foreground, tree.tableColumnHeader.foreground#FFE9AA
explorer.fileForeground#CBE3E7
explorer.directoryForeground#CBE3E7
comment.documentation#696969
editorSuggestWidget.highlightForeground#906CFF
editorSuggestWidget.selectedBackground
editorSuggestWidget.background#CBE3E7
invalid#FF0000
invalid#C991E1
invalid#91DDFF
invalid#91DDFF
invalid#95FFA4
invalid, invalid.deprecated#FFE9AA
invalid#FF8080
invalid.deprecated#FFE9AA
invalid#FF8080
invalid#FF8080
invalid.deprecated#FFE9AA
invalid#FF8080
invalid.deprecated#FFE9AA
invalid#FF8080
entity.name.type#FF8080
variable#FFA500
entity.name.function#4D4DDDDDDDDD
constant#FF1493
string#FFA500
comment.documentation#565575
diffEditor.insertedTextBackground#95FFA4
diffEditor.removedTextBackground#FF8080
invalid#FF0000
entity.name.function#AAFFE4
diff.insertedTextBackground#95FFA4
diff.removedTextBackground#FF8080
meta.diff.header.file#91DDFF
meta.diff.header#AAFFE4
invalid.deprecated#FF8080
invalid.deprecated#FFE9AA
entity.name.function#FFE9AA
invalid.deprecated#FFE9AA
string#FFFFE0
invalid.deprecated#FFE9AA
invalid#FF8080
invalid.deprecated#FFE9AA
invalid#FF8080
variable#95FFA4
variable#C991E1
variable#565575
comment#565575
comment#CBE3E7
comment.documentation#95FFA4
editor.findMatchBackground#95FFA4
editor.findMatchHighlightBackground#BAC9E4
editor.findMatchBackground, editor.findMatchHighlightBackground#BAC9E4
string.regexp#63F2F1
string.regexp#63F2F1
string.regexp#FFE9AA
meta.preprocessor, keyword.control.import#63F2F1
invalid.deprecated#FFE9AA
invalid.deprecated#FFE9AA
constant, constant.language, support.constant#AAFFE4
constant#AAFFE4
storage.type, support.type, entity.name.type#91DDFF
entity.name.type#91DDFF
variable#FFE9AA
variable, variable.other#FFE9AA
variable#FFE9AA
entity.name.function#C991E1
entity.name.function, support.function#C991E1
entity.name.function#C991E1
support.function, support.class, support.type#C991E1
keyword, storage, keyword.control, storage.modifier#FF8080
keyword#FF8080
comment.documentation#AAFFE4
comment.documentation, comment.block.documentation#858FA5
comment.documentation#858FA5
string, string.quoted, string.template#FFE9AA
string#FFE9AA
comment, punctuation.definition.comment#565575
comment#565575
comment, punctuation.definition.comment#565575
comment#565575
invalid#100E23
invalid
invalid.illegal#100E23
editor.wordHighlightStrongBackground#FF8080
invalid.deprecated#FFE9AA
invalid.illegal#FF8080
editorCursor.foreground
editorGutter.background#565575
editorGroup.border#292F37
editorGroupHeader.tabsBackground
statusBar.noFolderBackground#858FA5
statusBar.background, statusBar.foreground
editorLineNumber.activeForeground
editorLineNumber.activeForeground#CBE3E7
editorLineNumber.foreground#565575
invalid.deprecated
editor.selectionHighlightBackground
editor.selectionBackground, editor.selectionForeground
editor.findMatchBackground#100E23

Shiki preview

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

Loading...