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#82dfff10
  • activityBar.activeBorder#43c8ffff
  • activityBar.activeFocusBorder#43c8ffff
  • activityBar.background#17212B
  • activityBar.border#00060eff
  • activityBar.foreground#23a8f2ff
  • activityBar.inactiveForeground#61bef260
  • activityBarBadge.background#ffd49cc0
  • activityBarBadge.foreground#000000
  • badge.background#ffd49cc0
  • badge.foreground#000000
  • breadcrumb.activeSelectionForeground#23a8f2a0
  • breadcrumb.background#181e26ff
  • breadcrumb.focusForeground#23A8F2
  • breadcrumb.foreground#23a8f2a0
  • button.background#141a22ff
  • button.foreground#efe9e1ff
  • button.hoverBackground#181e26ff
  • descriptionForeground#efe9e1ff
  • dropdown.background#2e343cff
  • dropdown.border#10161E
  • dropdown.foreground#b0b6beff
  • dropdown.listBackground#2e343cff
  • editor.background#10161E
  • editor.findMatchBackground#ffb47f1e
  • editor.findMatchHighlightBackground#ffb47f3c
  • editor.findRangeHighlightBackground#5789ff23
  • editor.foreground#82dfff60
  • editor.lineHighlightBackground#62bfdf20
  • editor.selectionBackground#23a8f240
  • editor.selectionHighlightBackground#23aaf249
  • editor.selectionHighlightBorder#23a8f240
  • editor.wordHighlightStrongBackground#23aaf249
  • editor.wordHighlightStrongBorder#23a8f2a0
  • editorBracketMatch.background#ff336660
  • editorBracketMatch.border#ff336660
  • editorError.foreground#ff0033
  • editorGroup.border#00060eff
  • editorGroupHeader.border#00060eff
  • editorGroupHeader.noTabsBackground#141a22ff
  • editorGroupHeader.tabsBackground#141a22ff
  • editorGroupHeader.tabsBorder#61bef260
  • editorGutter.background#10161E
  • editorGutter.modifiedBackground#23A8F2
  • editorHoverWidget.border#429fbf60
  • editorIndentGuide.activeBackground#23a8f249
  • editorIndentGuide.background#181e26ff
  • editorLineNumber.activeForeground#9cddffa0
  • editorLineNumber.foreground#8ccdf240
  • editorOverviewRuler.errorForeground#ff0033
  • editorOverviewRuler.findMatchForeground#23a8f240
  • editorOverviewRuler.warningForeground#cc884478
  • editorOverviewRuler.wordHighlightForeground#23aaf249
  • editorPane.background#080e16ff
  • editorSuggestWidget.background#10161E
  • editorSuggestWidget.border#429fbf60
  • editorSuggestWidget.selectedBackground#20262eff
  • editorUnnecessaryCode.border#10161e80
  • editorUnnecessaryCode.opacity#10161e80
  • editorWidget.background#141a22ff
  • editorWidget.border#23A8F2
  • editorWidget.foreground#23a8f2ff
  • errorForeground#23A8F2
  • focusBorder#429fbf60
  • foreground#82dfff60
  • gitDecoration.untrackedResourceForeground#99bb33
  • icon.foreground#23a8f2ff
  • input.background#20262eff
  • input.border#10161E
  • input.foreground#9cddffa0
  • input.placeholderForeground#6cadd240
  • inputOption.activeBackground#1ba0ea3c
  • inputOption.activeBorder#1ba0ea4b
  • list.activeSelectionBackground#23a8f22a
  • list.activeSelectionForeground#fec67cff
  • list.dropBackground#2e343cff
  • list.errorForeground#ff4b7eff
  • list.focusBackground#23a8f22a
  • list.focusForeground#86e3fff0
  • list.highlightForeground#1ba0ea80
  • list.hoverBackground#10161E
  • list.hoverForeground#86e3fff0
  • list.inactiveSelectionBackground#10161E
  • list.inactiveSelectionForeground#d8a869ff
  • list.invalidItemForeground#f58fffff
  • list.warningForeground#feba76ff
  • listFilterWidget.outline#00060eff
  • menu.background#141a22f0
  • menu.border#141a22f0
  • menu.foreground#82dfff80
  • menu.selectionBackground#23a8f240
  • menu.selectionBorder#23a8f240
  • menu.selectionForeground#86e3fff0
  • menu.separatorBackground#23a8f280
  • menubar.selectionBackground#23a8f240
  • menubar.selectionBorder#23a8f240
  • menubar.selectionForeground#82dfff80
  • minimap.background#10161E
  • minimap.errorHighlight#ff003378
  • minimap.selectionHighlight#23a8f240
  • minimap.warningHighlight#cc884478
  • notificationCenter.border#10161E
  • notificationCenterHeader.background#181e26ff
  • notificationCenterHeader.foreground#82dfff60
  • notificationLink.foreground#1ba0eaff
  • notifications.background#181e26f0
  • notifications.border#23a8f2f0
  • notifications.foreground#82dfff60
  • notificationsErrorIcon.foreground#ff003378
  • notificationsInfoIcon.foreground#23a8f2ff
  • notificationsWarningIcon.foreground#cc884478
  • notificationToast.border#23a8f2f0
  • panel.background#10161E
  • panel.border#82dfff20
  • panelTitle.activeBorder#bcfdff40
  • panelTitle.activeForeground#bcfdff40
  • panelTitle.inactiveForeground#8ccdf240
  • pickerGroup.foreground#fec67cff
  • progressBar.background#181e26ff
  • quickInput.foreground#82dfff60
  • scrollbar.shadow#00060eff
  • scrollbarSlider.activeBackground#23a8f280
  • scrollbarSlider.background#23a8f240
  • scrollbarSlider.hoverBackground#23a8f240
  • selection.background#23a8f240
  • settings.checkboxBackground#20262eff
  • settings.checkboxBorder#10161E
  • settings.dropdownBorder#10161E
  • settings.dropdownListBorder#10161E
  • settings.headerForeground#23A8F2
  • settings.modifiedItemIndicator#61bef260
  • settings.numberInputBorder#10161E
  • settings.textInputBorder#10161E
  • sideBar.background#11161dff
  • sideBar.border#0c121aff
  • sideBar.dropBackground#61bef260
  • sideBar.foreground#82dfff60
  • sideBarSectionHeader.background#17212B
  • sideBarSectionHeader.border#82dfff20
  • sideBarSectionHeader.foreground#75c9e660
  • sideBarTitle.foreground#61bef260
  • statusBar.background#141a22ff
  • statusBar.border#82dfff20
  • statusBar.debuggingBackground#3bc0ffff
  • statusBar.debuggingForeground#000000
  • statusBar.foreground#82dfff60
  • statusBar.noFolderBackground#23a8f280
  • statusBar.noFolderForeground#ffffff
  • statusBarItem.activeBackground#23a8f280
  • statusBarItem.hoverBackground#23a8f240
  • statusBarItem.prominentBackground#23a8f280
  • statusBarItem.prominentHoverBackground#23a8f240
  • statusBarItem.remoteBackground#141a22ff
  • statusBarItem.remoteForeground#23A8F2
  • tab.activeBackground#181e26ff
  • tab.activeBorder#181e26ff
  • tab.activeBorderTop#23A8F2
  • tab.activeForeground#ffffff
  • tab.activeModifiedBorder#23A8F2
  • tab.border#00060eff
  • tab.hoverBackground#23a8f210
  • tab.hoverBorder#ffd49cc0
  • tab.hoverForeground#23a8f2a0
  • tab.inactiveBackground#141a22ff
  • tab.inactiveForeground#ffffff80
  • tab.inactiveModifiedBorder#ffd49cff
  • tab.lastPinnedBorder#61bef240
  • tab.unfocusedActiveBorder#181e26ff
  • tab.unfocusedActiveBorderTop#23a8f2a0
  • tab.unfocusedActiveForeground#ffffffa0
  • tab.unfocusedActiveModifiedBorder#23a8f2a0
  • tab.unfocusedHoverForeground#23a8f260
  • tab.unfocusedInactiveBackground#141a22ff
  • tab.unfocusedInactiveForeground#ffffff40
  • tab.unfocusedInactiveModifiedBorder#ffd49ca0
  • 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#11161dff
  • terminal.border#00060eff
  • terminal.foreground#3b6172
  • terminal.selectionBackground#23a8f240
  • terminalCursor.foreground#3b6172
  • textBlockQuote.border#23a8f280
  • textCodeBlock.background#23a8f280
  • textLink.activeForeground#3bc0ffff
  • textLink.foreground#1ba0eaff
  • textSeparator.foreground#23a8f280
  • titleBar.activeBackground#080e16ff
  • titleBar.activeForeground#82dfffc0
  • titleBar.border#00060eff
  • titleBar.inactiveBackground#10161eff
  • titleBar.inactiveForeground#5b9cb380
  • welcomePage.background#10161E
  • welcomePage.buttonBackground#141a22ff
  • welcomePage.buttonHoverBackground#181e26ff
  • welcomePage.progress.foreground#23A8F2
  • window.activeBorder#61bef260
  • window.inactiveBorder#5b9cb380

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#9cc09bee
meta.preprocessor, punctuation.definition.preprocessor#f5cda6ee
keyword.other.phpdoc#6fa367ee
punctuation.definition.comment, punctuation.whitespace.comment#b3deb4ee
punctuation.section.embedded#9e9e9eee
source.ruby.embedded#dca8a9ee
keyword.other.directive#ecececee
keyword.other.directive.line-number
string, string.unquoted#e59b9bee
string.unquoted.heredoc#e5e5e5ee
support.constant.numeric, constant.numeric#9ce5e4ee
constant, support.constant#e5e5c0ee
constant.character, constant.other#dca8a9ee
variable.other.constant#e5e5c0ee
keyword, keyword.control, meta.selector.css, entity.other.attribute-name#ffe5c1ee
variable.other.readwrite.instance#ffe5c1ee
entity.name.module, support.other.module#ff9620ee
keyword.operator#f9f9f9ee
keyword.operator.symbol.infix.floating-point
source.ocaml, keyword.operator.symbol.prefix.floating-point
storage.type, storage.modifier, support.type#ffffb0ee
entity.name.class.variant#5b96b3ee
entity.other#e5e5e5ee
entity.other.inherited-class#e6a239ee
storage.type.user-defined, meta.property-list#ffee20ee
entity.name.type, entity.name.type.class, entity.other.attribute-name.class.css, support.class, entity.name.class#ffb33dee
invalid#ffdcfbee
entity.other.attribute-name.html#e5e6c1ee
entity.name.tag#e5e6c1ee
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#9e9e9eee
support.function.construct#ffe5c1ee
punctuation.definition.variable#ffe5c1ee
meta.function-name, entity.name.function#ffff9cee
support.function#d7cb36ee
meta.brace#8ededcee
punctuation.definition.string.begin, punctuation.definition.string.end#e5e5e5ee
punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, meta.tag.structure.any.html#ffe4c0ee
entity.name.tag.yaml#ffe5c1ee
punctuation.definition.entry#e5e5e5ee
keyword.other.DML.sql, keyword.other.data-integrity.sql#c8c8c8ee
source.sql, constant.other.database-name.sql, constant.other.table-name.sql, keyword.operator.star#a9d0ffee
source.diff, meta.diff.comment, meta.toc-list.comment.diff#ffffffee
meta.diff.header.from-file#da8889ee
meta.diff.header.to-file#78c59fee
meta.diff.range.unified#a1dfe2ee
markup.inserted.diff#78c59fee
markup.deleted.diff#da8889ee
string.regexp#d7865cee
string.regexp.arbitrary-repitition#b18277ee
punctuation.definition.arbitrary-repitition#ffffffee
string.regexp.character-class#dba397ee
punctuation.definition.character-class#ffffffee
markup.raw.inline.markdown#ffe5c1ee
markup.heading.markdown, punctuation.definition.heading#ffffffee
markup.list#ecececee
sublimelinter.mark.warning#ebc820ee
sublimelinter.gutter-mark#ffffffee
sublimelinter.mark.error#df3d20ee
doctype#d8dedcee
entity#d8dedcee
hyperlink#6da4b3ee
invisibles#ffffffee
level0#405f40ee
level1#40405fee
level10#5c7b7bee
level2#5f5f40ee
level3#5f405fee
level4#405f5fee
level5#7b5c5cee
level6#5c7b5cee
level7#5c5c7bee
level8#7b7b5cee
level9#7b5c7bee
markup#e2e2e2ee
match#ffdc7eee
meta#cdc0b3ee
none#927e84ee
property#9caec7ee
punctuation#ffe182ee
source#eaeaeaee
storage#935c7bee
support#f7b8fcee
text#eaeaeaee
variable#cdbdaeee
wordhighlight#8dff30ee

Shiki preview

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

Loading...