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#0d0b23
  • activityBar.foreground#cccccc
  • activityBar.inactiveForeground#888888
  • editor.background#0c0a20
  • editor.findMatchBackground#1ea8fc
  • editor.foreground#f2f3f7
  • editor.selectionBackground#1f1147
  • editorCursor.background#1ea8fc
  • editorCursor.foreground#f2f3f7
  • editorGroup.border#BA45A3
  • editorGutter.background#0c0a20
  • editorLineNumber.activeForeground#f2f3f7
  • editorLineNumber.foreground#2d2844
  • inlineChatInput.background#0d0b23
  • inlineChatInput.foreground#f2f3f7
  • inlineChatInput.placeholderForeground#1ea8fc
  • input.background#0d0b23
  • input.foreground#f2f3f7
  • input.placeholderForeground#1ea8fc
  • panel.background#0c0a20
  • sideBar.background#0d0b23
  • statusBar.background#0a091c
  • statusBar.foreground#f2f3f7
  • statusBar.noFolderBackground#0c0a20
  • statusBarItem.remoteBackground#0a091c
  • statusBarItem.remoteForeground#f2f3f7

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#ff2afc—
comment#546A90—
markup.heading#e61f44—
entity.name.tag#BA45A3—
entity.name.tag#ff2afc—
comment#546A90—
markup.underline.link#A875FF—
keyword#ffd400—
markup.fenced_code, markup.inline.raw——
markup.list#e61f44—
invalid#e61f44—
keyword#ffd400—
keyword#7984D1—
invalid.deprecated#ffd400—
invalid.deprecated——
markup.inserted#a7da1e—
markup.inserted#85ae18—
comment#df85ff—
comment#ff2afc—
comment#cf433e—
comment#a7da1e—
comment#ff2afc—
keyword#42c6ff—
gitDecoration.addedResourceForeground#a7da1e—
gitDecoration.untrackedResourceForeground#A875FF—
gitDecoration.ignoredResourceForeground#546A90—
gitDecoration.renamedResourceForeground#A875FF—
gitDecoration.modifiedResourceForeground#df85ff—
breadcrumb.foreground, tree.tableColumnHeader.foreground#7984D1—
explorer.fileForeground#f2f3f7—
explorer.directoryForeground#f2f3f7—
comment.documentation#696969—
editorSuggestWidget.highlightForeground#ff2afc—
editorSuggestWidget.selectedBackground——
editorSuggestWidget.background#f2f3f7—
invalid#FF0000—
invalid#42c6ff—
invalid#ffd400—
invalid#ffd400—
invalid#a7da1e—
invalid, invalid.deprecated#ffd400—
invalid#e61f44—
invalid.deprecated#ffd400—
invalid#e61f44—
invalid#e61f44—
invalid.deprecated#ffd400—
invalid#e61f44—
invalid.deprecated#ffd400—
invalid#e61f44—
entity.name.type#ff2afc—
variable#FFA500—
entity.name.function#4D4DDDDDDDDD—
constant#FF1493—
string#FFA500—
comment.documentation#546A90—
diffEditor.insertedTextBackground#a7da1e—
diffEditor.removedTextBackground#e61f44—
invalid#FF0000—
entity.name.function#42c6ff—
diff.insertedTextBackground#a7da1e—
diff.removedTextBackground#e61f44—
meta.diff.header.file#1ea8fc—
meta.diff.header#42c6ff—
invalid.deprecated#e61f44—
invalid.deprecated#ffd400—
entity.name.function#df85ff—
invalid.deprecated#ffd400—
string#FFFFE0—
invalid.deprecated#ffd400—
invalid#e61f44—
invalid.deprecated#ffd400—
invalid#e61f44—
variable#a7da1e—
variable#ff2afc—
variable#546A90—
comment#546A90—
comment#f2f3f7—
comment.documentation#a7da1e—
editor.findMatchBackground#a7da1e—
editor.findMatchHighlightBackground#919ad9—
editor.findMatchBackground, editor.findMatchHighlightBackground#919ad9—
string.regexp#ff2afc—
string.regexp#ff2afc—
string.regexp#7984D1—
meta.preprocessor, keyword.control.import#ff2afc—
invalid.deprecated#ffd400—
invalid.deprecated#ffd400—
constant, constant.language, support.constant#df85ff—
constant#df85ff—
storage.type, support.type, entity.name.type#ffd400—
entity.name.type#ffd400—
variable#df85ff—
variable, variable.other#df85ff—
variable#df85ff—
entity.name.function#42c6ff—
entity.name.function, support.function#42c6ff—
entity.name.function#42c6ff—
support.function, support.class, support.type#1ea8fc—
keyword, storage, keyword.control, storage.modifier#ff2afc—
keyword#ff2afc—
comment.documentation#df85ff—
comment.documentation, comment.block.documentation#A875FF—
comment.documentation#A875FF—
string, string.quoted, string.template#7984D1—
string#7984D1—
comment, punctuation.definition.comment#546A90—
comment#546A90—
comment, punctuation.definition.comment#546A90—
comment#546A90—
invalid#131033—
invalid——
invalid.illegal#131033—
editor.wordHighlightStrongBackground#e61f44—
invalid.deprecated#ffd400—
invalid.illegal#e61f44—
editorCursor.foreground——
editorGutter.background#2d2844—
editorGroup.border#BA45A3—
editorGroupHeader.tabsBackground——
statusBar.noFolderBackground#BA45A3—
statusBar.background, statusBar.foreground——
editorLineNumber.activeForeground——
editorLineNumber.activeForeground#f2f3f7—
editorLineNumber.foreground#2d2844—
invalid.deprecated——
editor.selectionHighlightBackground——
editor.selectionBackground, editor.selectionForeground——
editor.findMatchBackground#131033—