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#ffc0d810
  • activityBar.activeBorder#ff97b9ff
  • activityBar.activeFocusBorder#ff97b9ff
  • activityBar.background#202020ff
  • activityBar.border#0c0c0cff
  • activityBar.foreground#ff7799ff
  • activityBar.inactiveForeground#ff9fb760
  • activityBarBadge.background#7ee4cac0
  • activityBarBadge.foreground#000000
  • badge.background#7ee4cac0
  • badge.foreground#000000
  • breadcrumb.activeSelectionForeground#ff7799a0
  • breadcrumb.background#242424ff
  • breadcrumb.focusForeground#FF7799
  • breadcrumb.foreground#ff7799a0
  • button.background#202020ff
  • button.foreground#e3e3e3ff
  • button.hoverBackground#242424ff
  • descriptionForeground#e3e3e3ff
  • dropdown.background#3a3a3aff
  • dropdown.border#1C1C1C
  • dropdown.foreground#bcbcbcff
  • dropdown.listBackground#3a3a3aff
  • editor.background#1C1C1C
  • editor.findMatchBackground#d3ffff1e
  • editor.findMatchHighlightBackground#d3ffff3c
  • editor.findRangeHighlightBackground#ffb2ab23
  • editor.foreground#ffc0d860
  • editor.lineHighlightBackground#dfa0b820
  • editor.selectionBackground#ff779940
  • editor.selectionHighlightBackground#ff779949
  • editor.selectionHighlightBorder#ff779940
  • editor.wordHighlightStrongBackground#ff779949
  • editor.wordHighlightStrongBorder#ff7799a0
  • editorBracketMatch.background#ff336660
  • editorBracketMatch.border#ff336660
  • editorError.foreground#ff0033
  • editorGroup.border#0c0c0cff
  • editorGroupHeader.border#0c0c0cff
  • editorGroupHeader.noTabsBackground#202020ff
  • editorGroupHeader.tabsBackground#202020ff
  • editorGroupHeader.tabsBorder#ff9fb760
  • editorGutter.background#1C1C1C
  • editorGutter.modifiedBackground#FF7799
  • editorHoverWidget.border#bf809860
  • editorIndentGuide.activeBackground#ff779949
  • editorIndentGuide.background#242424ff
  • editorLineNumber.activeForeground#ffcbdca0
  • editorLineNumber.foreground#ffbbcc40
  • editorOverviewRuler.errorForeground#ff0033
  • editorOverviewRuler.findMatchForeground#ff779940
  • editorOverviewRuler.warningForeground#cc884478
  • editorOverviewRuler.wordHighlightForeground#ff779949
  • editorPane.background#141414ff
  • editorSuggestWidget.background#1C1C1C
  • editorSuggestWidget.border#bf809860
  • editorSuggestWidget.selectedBackground#2c2c2cff
  • editorUnnecessaryCode.border#1c1c1c80
  • editorUnnecessaryCode.opacity#1c1c1c80
  • editorWidget.background#202020ff
  • editorWidget.border#FF7799
  • editorWidget.foreground#ff7799ff
  • errorForeground#FF7799
  • focusBorder#bf809860
  • foreground#ffc0d860
  • gitDecoration.untrackedResourceForeground#99bb33
  • icon.foreground#ff7799ff
  • input.background#2c2c2cff
  • input.border#1C1C1C
  • input.foreground#ffcbdca0
  • input.placeholderForeground#df9bac40
  • inputOption.activeBackground#f76f913c
  • inputOption.activeBorder#f76f914b
  • list.activeSelectionBackground#ff77992a
  • list.activeSelectionForeground#f2c17dff
  • list.dropBackground#3a3a3aff
  • list.errorForeground#ff4b7eff
  • list.focusBackground#ff77992a
  • list.focusForeground#ffc4dcf0
  • list.highlightForeground#f76f9180
  • list.hoverBackground#df57792a
  • list.hoverForeground#ffc4dcf0
  • list.inactiveSelectionBackground#df57792a
  • list.inactiveSelectionForeground#cea46aff
  • list.invalidItemForeground#f58fffff
  • list.warningForeground#feba76ff
  • listFilterWidget.outline#0c0c0cff
  • menu.background#202020f0
  • menu.border#202020f0
  • menu.foreground#ffc0d880
  • menu.selectionBackground#ff779940
  • menu.selectionBorder#ff779940
  • menu.selectionForeground#ffc4dcf0
  • menu.separatorBackground#ff779980
  • menubar.selectionBackground#ff779940
  • menubar.selectionBorder#ff779940
  • menubar.selectionForeground#ffc0d880
  • minimap.background#1C1C1C
  • minimap.errorHighlight#ff003378
  • minimap.selectionHighlight#ff779940
  • minimap.warningHighlight#cc884478
  • notificationCenter.border#1C1C1C
  • notificationCenterHeader.background#242424ff
  • notificationCenterHeader.foreground#ffc0d860
  • notificationLink.foreground#f76f91ff
  • notifications.background#242424f0
  • notifications.border#ff7799f0
  • notifications.foreground#ffc0d860
  • notificationsErrorIcon.foreground#ff003378
  • notificationsInfoIcon.foreground#ff7799ff
  • notificationsWarningIcon.foreground#cc884478
  • notificationToast.border#ff7799f0
  • panel.background#1C1C1C
  • panel.border#ffc0d820
  • panelTitle.activeBorder#ffebfc40
  • panelTitle.activeForeground#ffebfc40
  • panelTitle.inactiveForeground#ffbbcc40
  • pickerGroup.foreground#f2c17dff
  • progressBar.background#242424ff
  • quickInput.foreground#ffc0d860
  • scrollbar.shadow#0c0c0cff
  • scrollbarSlider.activeBackground#ff779980
  • scrollbarSlider.background#ff779940
  • scrollbarSlider.hoverBackground#ff779940
  • selection.background#ff779940
  • settings.checkboxBackground#2c2c2cff
  • settings.checkboxBorder#1C1C1C
  • settings.dropdownBorder#1C1C1C
  • settings.dropdownListBorder#1C1C1C
  • settings.headerForeground#FF7799
  • settings.modifiedItemIndicator#ff9fb760
  • settings.numberInputBorder#1C1C1C
  • settings.textInputBorder#1C1C1C
  • sideBar.background#1C1C1C
  • sideBar.border#181818ff
  • sideBar.dropBackground#ff9fb760
  • sideBar.foreground#ffc0d860
  • sideBarSectionHeader.background#202020ff
  • sideBarSectionHeader.border#ffc0d820
  • sideBarSectionHeader.foreground#ffbfd760
  • sideBarTitle.foreground#ff9fb760
  • statusBar.background#202020ff
  • statusBar.border#ffc0d820
  • statusBar.debuggingBackground#ff8fb1ff
  • statusBar.debuggingForeground#000000
  • statusBar.foreground#ffc0d860
  • statusBar.noFolderBackground#ff779980
  • statusBar.noFolderForeground#ffffff
  • statusBarItem.activeBackground#ff779980
  • statusBarItem.hoverBackground#ff779940
  • statusBarItem.prominentBackground#ff779980
  • statusBarItem.prominentHoverBackground#ff779940
  • statusBarItem.remoteBackground#202020ff
  • statusBarItem.remoteForeground#FF7799
  • tab.activeBackground#242424ff
  • tab.activeBorder#242424ff
  • tab.activeBorderTop#FF7799
  • tab.activeForeground#ffffff
  • tab.activeModifiedBorder#FF7799
  • tab.border#0c0c0cff
  • tab.hoverBackground#ff779910
  • tab.hoverBorder#7ee4cac0
  • tab.hoverForeground#ff7799a0
  • tab.inactiveBackground#202020ff
  • tab.inactiveForeground#ffffff80
  • tab.inactiveModifiedBorder#7ee4caff
  • tab.lastPinnedBorder#ff9fb740
  • tab.unfocusedActiveBorder#242424ff
  • tab.unfocusedActiveBorderTop#ff7799a0
  • tab.unfocusedActiveForeground#ffffffa0
  • tab.unfocusedActiveModifiedBorder#ff7799a0
  • tab.unfocusedHoverForeground#ff779960
  • tab.unfocusedInactiveBackground#202020ff
  • tab.unfocusedInactiveForeground#ffffff40
  • tab.unfocusedInactiveModifiedBorder#7ee4caa0
  • 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#1C1C1C
  • terminal.border#0c0c0cff
  • terminal.foreground#715962
  • terminal.selectionBackground#ff779940
  • terminalCursor.foreground#715962
  • textBlockQuote.border#ff779980
  • textCodeBlock.background#ff779980
  • textLink.activeForeground#ff8fb1ff
  • textLink.foreground#f76f91ff
  • textSeparator.foreground#ff779980
  • titleBar.activeBackground#141414ff
  • titleBar.activeForeground#ffc0d8c0
  • titleBar.border#0c0c0cff
  • titleBar.inactiveBackground#1c1c1cff
  • titleBar.inactiveForeground#b3869780
  • welcomePage.background#1C1C1C
  • welcomePage.buttonBackground#202020ff
  • welcomePage.buttonHoverBackground#242424ff
  • welcomePage.progress.foreground#FF7799
  • window.activeBorder#ff9fb760
  • window.inactiveBorder#b3869780

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#87ae86ff
meta.preprocessor, punctuation.definition.preprocessor#e8bc92ff
keyword.other.phpdoc#568e4dff
punctuation.definition.comment, punctuation.whitespace.comment#a0cfa1ff
punctuation.section.embedded#898989ff
source.ruby.embedded#cc9495ff
keyword.other.directive#dededeff
keyword.other.directive.line-number
string, string.unquoted#d68686ff
string.unquoted.heredoc#d6d6d6ff
support.constant.numeric, constant.numeric#87d6d5ff
constant, support.constant#d6d6aeff
constant.character, constant.other#cc9495ff
variable.other.constant#d6d6aeff
keyword, keyword.control, meta.selector.css, entity.other.attribute-name#fed6afff
variable.other.readwrite.instance#fed6afff
entity.name.module, support.other.module#ff8000ff
keyword.operator#ecececff
keyword.operator.symbol.infix.floating-point
source.ocaml, keyword.operator.symbol.prefix.floating-point
storage.type, storage.modifier, support.type#fffb9dff
entity.name.class.variant#4080a0ff
entity.other#d6d6d6ff
entity.other.inherited-class#d78d1bff
storage.type.user-defined, meta.property-list#ffe000ff
entity.name.type, entity.name.type.class, entity.other.attribute-name.class.css, support.class, entity.name.class#f4a020ff
invalid#ffcceeff
entity.other.attribute-name.html#d6d7afff
entity.name.tag#d6d7afff
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#898989ff
support.function.construct#fed6afff
punctuation.definition.variable#fed6afff
meta.function-name, entity.name.function#fffd87ff
support.function#c7ba18ff
meta.brace#78cecc80
punctuation.definition.string.begin, punctuation.definition.string.end#d6d6d680
punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, meta.tag.structure.any.html#fed5ae94
entity.name.tag.yaml#fed6afff
punctuation.definition.entry#d6d6d6ff
keyword.other.DML.sql, keyword.other.data-integrity.sql#b7b7b7ff
source.sql, constant.other.database-name.sql, constant.other.table-name.sql, keyword.operator.star#95bff3ff
source.diff, meta.diff.comment, meta.toc-list.comment.diff#ffffffff
meta.diff.header.from-file#ca7172ff
meta.diff.header.to-file#60b38aff
meta.diff.range.unified#8cd0d3ff
markup.inserted.diff#60b38aff
markup.deleted.diff#ca7172ff
string.regexp#c76f41ff
string.regexp.arbitrary-repitition#9e6a5fff
punctuation.definition.arbitrary-repitition#ffffff5e
string.regexp.character-class#cb8e81ff
punctuation.definition.character-class#ffffff5e
markup.raw.inline.markdown#fed6afff
markup.heading.markdown, punctuation.definition.heading#ffffffff
markup.list#dededeff
sublimelinter.mark.warning#ddb700ff
sublimelinter.gutter-mark#ffffffff
sublimelinter.mark.error#d02000ff
doctype#c8ceccff
entity#c8ceccff
hyperlink#548fa0ff
invisibles#ffffffff
level0#234523ff
level1#232345ff
level10#416363ff
level2#454523ff
level3#452345ff
level4#234545ff
level5#634141ff
level6#416341ff
level7#414163ff
level8#636341ff
level9#634163ff
markup#d3d3d3ff
match#ffcc66ff
meta#bcaea0ff
none#7c666dff
property#879ab5ff
punctuation#ffd26aff
source#dcdcdcff
storage#7d4163ff
support#eaa5efff
text#dcdcdcff
variable#bcab9aff
wordhighlight#77ff11ff

Shiki preview

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

Loading...