Skip to main content
Coding Theme

Zenburn Dark Matter Theme

Publisher: Nicola GranataThemes in package: 98

Zenburn token colors in different intensities and on different dark backgrounds to reduce eye strain.

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.activeBackground#b1b1b110
  • activityBar.activeBorder#b0b0b0ff
  • activityBar.activeFocusBorder#b0b0b0ff
  • activityBar.background#1d2123ff
  • activityBar.border#090d0fff
  • activityBar.foreground#909090ff
  • activityBar.inactiveForeground#90909060
  • activityBarBadge.background#ddcdbdc0
  • activityBarBadge.foreground#000000
  • badge.background#ddcdbdc0
  • badge.foreground#000000
  • breadcrumb.activeSelectionForeground#909090a0
  • breadcrumb.background#212527ff
  • breadcrumb.focusForeground#909090
  • breadcrumb.foreground#909090a0
  • button.background#1d2123ff
  • button.foreground#e6e2e0ff
  • button.hoverBackground#212527ff
  • descriptionForeground#e6e2e0ff
  • dropdown.background#373b3dff
  • dropdown.border#191d1f
  • dropdown.foreground#b9bdbfff
  • dropdown.listBackground#373b3dff
  • editor.background#191d1f
  • editor.findMatchBackground#8b8b8b1e
  • editor.findMatchHighlightBackground#8b8b8b3c
  • editor.findRangeHighlightBackground#c4c4c423
  • editor.foreground#b1b1b160
  • editor.lineHighlightBackground#91919120
  • editor.selectionBackground#90909040
  • editor.selectionHighlightBackground#90909049
  • editor.selectionHighlightBorder#90909040
  • editor.wordHighlightStrongBackground#90909049
  • editor.wordHighlightStrongBorder#909090a0
  • editorBracketMatch.background#ff336660
  • editorBracketMatch.border#ff336660
  • editorError.foreground#ff0033
  • editorGroup.border#090d0fff
  • editorGroupHeader.border#090d0fff
  • editorGroupHeader.noTabsBackground#1d2123ff
  • editorGroupHeader.tabsBackground#1d2123ff
  • editorGroupHeader.tabsBorder#90909060
  • editorGutter.background#191d1f
  • editorGutter.modifiedBackground#909090
  • editorHoverWidget.border#71717160
  • editorIndentGuide.activeBackground#90909049
  • editorIndentGuide.background#212527ff
  • editorLineNumber.activeForeground#a0a0a0a0
  • editorLineNumber.foreground#90909060
  • editorOverviewRuler.errorForeground#ff0033
  • editorOverviewRuler.findMatchForeground#90909040
  • editorOverviewRuler.warningForeground#cc884478
  • editorOverviewRuler.wordHighlightForeground#90909049
  • editorPane.background#111517ff
  • editorSuggestWidget.background#191d1f
  • editorSuggestWidget.border#71717160
  • editorSuggestWidget.selectedBackground#292d2fff
  • editorUnnecessaryCode.border#191d1f80
  • editorUnnecessaryCode.opacity#191d1f80
  • editorWidget.background#1d2123ff
  • editorWidget.border#909090
  • editorWidget.foreground#909090ff
  • errorForeground#909090
  • focusBorder#71717160
  • foreground#b1b1b160
  • gitDecoration.untrackedResourceForeground#99bb33
  • icon.foreground#909090ff
  • input.background#292d2fff
  • input.border#191d1f
  • input.foreground#a0a0a0a0
  • input.placeholderForeground#70707060
  • inputOption.activeBackground#8888883c
  • inputOption.activeBorder#8888884b
  • list.activeSelectionBackground#9090902a
  • list.activeSelectionForeground#f5c07bff
  • list.dropBackground#373b3dff
  • list.errorForeground#ff4b7eff
  • list.focusBackground#9090902a
  • list.focusForeground#b5b5b5f0
  • list.highlightForeground#88888880
  • list.hoverBackground#191d1f
  • list.hoverForeground#b5b5b5f0
  • list.inactiveSelectionBackground#191d1f
  • list.inactiveSelectionForeground#d0a369ff
  • list.invalidItemForeground#f58fffff
  • list.warningForeground#feba76ff
  • listFilterWidget.outline#090d0fff
  • menu.background#1d2123f0
  • menu.border#1d2123f0
  • menu.foreground#b1b1b180
  • menu.selectionBackground#90909040
  • menu.selectionBorder#90909040
  • menu.selectionForeground#b5b5b5f0
  • menu.separatorBackground#90909080
  • menubar.selectionBackground#90909040
  • menubar.selectionBorder#90909040
  • menubar.selectionForeground#b1b1b180
  • minimap.background#191d1f
  • minimap.errorHighlight#ff003378
  • minimap.selectionHighlight#90909040
  • minimap.warningHighlight#cc884478
  • notificationCenter.border#191d1f
  • notificationCenterHeader.background#212527ff
  • notificationCenterHeader.foreground#b1b1b160
  • notificationLink.foreground#888888ff
  • notifications.background#212527f0
  • notifications.border#909090f0
  • notifications.foreground#b1b1b160
  • notificationsErrorIcon.foreground#ff003378
  • notificationsInfoIcon.foreground#909090ff
  • notificationsWarningIcon.foreground#cc884478
  • notificationToast.border#909090f0
  • panel.background#191d1f
  • panel.border#b1b1b120
  • panelTitle.activeBorder#c0c0c060
  • panelTitle.activeForeground#c0c0c060
  • panelTitle.inactiveForeground#90909060
  • pickerGroup.foreground#f5c07bff
  • progressBar.background#212527ff
  • quickInput.foreground#b1b1b160
  • scrollbar.shadow#090d0fff
  • scrollbarSlider.activeBackground#90909080
  • scrollbarSlider.background#90909040
  • scrollbarSlider.hoverBackground#90909040
  • selection.background#90909040
  • settings.checkboxBackground#292d2fff
  • settings.checkboxBorder#191d1f
  • settings.dropdownBorder#191d1f
  • settings.dropdownListBorder#191d1f
  • settings.headerForeground#909090
  • settings.modifiedItemIndicator#90909060
  • settings.numberInputBorder#191d1f
  • settings.textInputBorder#191d1f
  • sideBar.background#15191bff
  • sideBar.border#15191bff
  • sideBar.dropBackground#90909060
  • sideBar.foreground#b1b1b160
  • sideBarSectionHeader.background#1d2123ff
  • sideBarSectionHeader.border#b1b1b120
  • sideBarSectionHeader.foreground#a0a0a060
  • sideBarTitle.foreground#90909060
  • statusBar.background#1d2123ff
  • statusBar.border#b1b1b120
  • statusBar.debuggingBackground#ddcdbdc0
  • statusBar.debuggingForeground#000000
  • statusBar.foreground#b1b1b160
  • statusBar.noFolderBackground#90909080
  • statusBar.noFolderForeground#ffffff
  • statusBarItem.activeBackground#90909080
  • statusBarItem.hoverBackground#90909040
  • statusBarItem.prominentBackground#90909080
  • statusBarItem.prominentHoverBackground#90909040
  • statusBarItem.remoteBackground#1d2123ff
  • statusBarItem.remoteForeground#909090
  • tab.activeBackground#212527ff
  • tab.activeBorder#212527ff
  • tab.activeBorderTop#909090
  • tab.activeForeground#ffffff
  • tab.activeModifiedBorder#909090
  • tab.border#090d0fff
  • tab.hoverBackground#90909010
  • tab.hoverBorder#ddcdbdc0
  • tab.hoverForeground#909090a0
  • tab.inactiveBackground#1d2123ff
  • tab.inactiveForeground#ffffff80
  • tab.inactiveModifiedBorder#cbcbcbff
  • tab.lastPinnedBorder#90909040
  • tab.unfocusedActiveBorder#212527ff
  • tab.unfocusedActiveBorderTop#909090a0
  • tab.unfocusedActiveForeground#ffffffa0
  • tab.unfocusedActiveModifiedBorder#909090a0
  • tab.unfocusedHoverForeground#90909060
  • tab.unfocusedInactiveBackground#1d2123ff
  • tab.unfocusedInactiveForeground#ffffff40
  • tab.unfocusedInactiveModifiedBorder#cbcbcba0
  • terminal.ansiBlack#3F3F3F
  • terminal.ansiBlue#7CB8BB
  • terminal.ansiBrightBlack#4F4F4F
  • terminal.ansiBrightBlue#7CB8BB
  • terminal.ansiBrightCyan#93E0E3
  • terminal.ansiBrightGreen#5F7F5F
  • terminal.ansiBrightMagenta#DC8CC3
  • terminal.ansiBrightRed#DCA3A3
  • terminal.ansiBrightWhite#FFFFFF
  • terminal.ansiBrightYellow#E0CF9F
  • terminal.ansiCyan#93E0E3
  • terminal.ansiGreen#5F7F5F
  • terminal.ansiMagenta#DC8CC3
  • terminal.ansiRed#DCA3A3
  • terminal.ansiWhite#DCDCCC
  • terminal.ansiYellow#E0CF9F
  • terminal.background#15191bff
  • terminal.border#090d0fff
  • terminal.foreground#4f5253
  • terminal.selectionBackground#90909040
  • terminalCursor.foreground#4f5253
  • textBlockQuote.border#90909080
  • textCodeBlock.background#90909080
  • textLink.activeForeground#a8a8a8ff
  • textLink.foreground#888888ff
  • textSeparator.foreground#90909080
  • titleBar.activeBackground#111517ff
  • titleBar.activeForeground#b1b1b1c0
  • titleBar.border#090d0fff
  • titleBar.inactiveBackground#191d1fff
  • titleBar.inactiveForeground#7c7c7c80
  • welcomePage.background#191d1f
  • welcomePage.buttonBackground#1d2123ff
  • welcomePage.buttonHoverBackground#212527ff
  • welcomePage.progress.foreground#909090
  • window.activeBorder#90909060
  • window.inactiveBorder#7c7c7c80

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#87ae86ee
meta.preprocessor, punctuation.definition.preprocessor#e8bc92ee
keyword.other.phpdoc#568e4dee
punctuation.definition.comment, punctuation.whitespace.comment#a0cfa1ee
punctuation.section.embedded#898989ee
source.ruby.embedded#cc9495ee
keyword.other.directive#dededeee
keyword.other.directive.line-number
string, string.unquoted#d68686ee
string.unquoted.heredoc#d6d6d6ee
support.constant.numeric, constant.numeric#87d6d5ee
constant, support.constant#d6d6aeee
constant.character, constant.other#cc9495ee
variable.other.constant#d6d6aeee
keyword, keyword.control, meta.selector.css, entity.other.attribute-name#fed6afee
variable.other.readwrite.instance#fed6afee
entity.name.module, support.other.module#ff8000ee
keyword.operator#ecececee
keyword.operator.symbol.infix.floating-point
source.ocaml, keyword.operator.symbol.prefix.floating-point
storage.type, storage.modifier, support.type#fffb9dee
entity.name.class.variant#4080a0ee
entity.other#d6d6d6ee
entity.other.inherited-class#d78d1bee
storage.type.user-defined, meta.property-list#ffe000ee
entity.name.type, entity.name.type.class, entity.other.attribute-name.class.css, support.class, entity.name.class#f4a020ee
invalid#ffcceeee
entity.other.attribute-name.html#d6d7afee
entity.name.tag#d6d7afee
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#898989ee
support.function.construct#fed6afee
punctuation.definition.variable#fed6afee
meta.function-name, entity.name.function#fffd87ee
support.function#c7ba18ee
meta.brace#78ceccee
punctuation.definition.string.begin, punctuation.definition.string.end#d6d6d6ee
punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, meta.tag.structure.any.html#fed5aeee
entity.name.tag.yaml#fed6afee
punctuation.definition.entry#d6d6d6ee
keyword.other.DML.sql, keyword.other.data-integrity.sql#b7b7b7ee
source.sql, constant.other.database-name.sql, constant.other.table-name.sql, keyword.operator.star#95bff3ee
source.diff, meta.diff.comment, meta.toc-list.comment.diff#ffffffee
meta.diff.header.from-file#ca7172ee
meta.diff.header.to-file#60b38aee
meta.diff.range.unified#8cd0d3ee
markup.inserted.diff#60b38aee
markup.deleted.diff#ca7172ee
string.regexp#c76f41ee
string.regexp.arbitrary-repitition#9e6a5fee
punctuation.definition.arbitrary-repitition#ffffffee
string.regexp.character-class#cb8e81ee
punctuation.definition.character-class#ffffffee
markup.raw.inline.markdown#fed6afee
markup.heading.markdown, punctuation.definition.heading#ffffffee
markup.list#dededeee
sublimelinter.mark.warning#ddb700ee
sublimelinter.gutter-mark#ffffffee
sublimelinter.mark.error#d02000ee
doctype#c8ceccee
entity#c8ceccee
hyperlink#548fa0ee
invisibles#ffffffee
level0#234523ee
level1#232345ee
level10#416363ee
level2#454523ee
level3#452345ee
level4#234545ee
level5#634141ee
level6#416341ee
level7#414163ee
level8#636341ee
level9#634163ee
markup#d3d3d3ee
match#ffcc66ee
meta#bcaea0ee
none#7c666dee
property#879ab5ee
punctuation#ffd26aee
source#dcdcdcee
storage#7d4163ee
support#eaa5efee
text#dcdcdcee
variable#bcab9aee
wordhighlight#77ff11ee

Shiki preview

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

Loading...