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#a5c9ed10
  • activityBar.activeBorder#86b9ecff
  • activityBar.activeFocusBorder#86b9ecff
  • activityBar.background#171e23ff
  • activityBar.border#030a0fff
  • activityBar.foreground#6699ccff
  • activityBar.inactiveForeground#84a8cc60
  • activityBarBadge.background#f5cea8c0
  • activityBarBadge.foreground#000000
  • badge.background#f5cea8c0
  • badge.foreground#000000
  • breadcrumb.activeSelectionForeground#6699cca0
  • breadcrumb.background#1b2227ff
  • breadcrumb.focusForeground#6699CC
  • breadcrumb.foreground#6699cca0
  • button.background#171e23ff
  • button.foreground#ece5e0ff
  • button.hoverBackground#1b2227ff
  • descriptionForeground#ece5e0ff
  • dropdown.background#31383dff
  • dropdown.border#131A1F
  • dropdown.foreground#b3babfff
  • dropdown.listBackground#31383dff
  • editor.background#131A1F
  • editor.findMatchBackground#fff5c21e
  • editor.findMatchHighlightBackground#fff5c23c
  • editor.findRangeHighlightBackground#9a9cff23
  • editor.foreground#a5c9ed60
  • editor.lineHighlightBackground#85a9cd20
  • editor.selectionBackground#6699cc40
  • editor.selectionHighlightBackground#6699cc49
  • editor.selectionHighlightBorder#6699cc40
  • editor.wordHighlightStrongBackground#6699cc49
  • editor.wordHighlightStrongBorder#6699cca0
  • editorBracketMatch.background#ff336660
  • editorBracketMatch.border#ff336660
  • editorError.foreground#ff0033
  • editorGroup.border#030a0fff
  • editorGroupHeader.border#030a0fff
  • editorGroupHeader.noTabsBackground#171e23ff
  • editorGroupHeader.tabsBackground#171e23ff
  • editorGroupHeader.tabsBorder#84a8cc60
  • editorGutter.background#131A1F
  • editorGutter.modifiedBackground#6699CC
  • editorHoverWidget.border#6589ad60
  • editorIndentGuide.activeBackground#6699cc49
  • editorIndentGuide.background#1b2227ff
  • editorLineNumber.activeForeground#a9c2dca0
  • editorLineNumber.foreground#99b2cc40
  • editorOverviewRuler.errorForeground#ff0033
  • editorOverviewRuler.findMatchForeground#6699cc40
  • editorOverviewRuler.warningForeground#cc884478
  • editorOverviewRuler.wordHighlightForeground#6699cc49
  • editorPane.background#0b1217ff
  • editorSuggestWidget.background#131A1F
  • editorSuggestWidget.border#6589ad60
  • editorSuggestWidget.selectedBackground#232a2fff
  • editorUnnecessaryCode.border#131a1f80
  • editorUnnecessaryCode.opacity#131a1f80
  • editorWidget.background#171e23ff
  • editorWidget.border#6699CC
  • editorWidget.foreground#6699ccff
  • errorForeground#6699CC
  • focusBorder#6589ad60
  • foreground#a5c9ed60
  • gitDecoration.untrackedResourceForeground#99bb33
  • icon.foreground#6699ccff
  • input.background#232a2fff
  • input.border#131A1F
  • input.foreground#a9c2dca0
  • input.placeholderForeground#7992ac40
  • inputOption.activeBackground#5e91c43c
  • inputOption.activeBorder#5e91c44b
  • list.activeSelectionBackground#6699cc2a
  • list.activeSelectionForeground#fbc37bff
  • list.dropBackground#31383dff
  • list.errorForeground#ff4b7eff
  • list.focusBackground#6699cc2a
  • list.focusForeground#a9cdf1f0
  • list.highlightForeground#5e91c480
  • list.hoverBackground#4679ac2a
  • list.hoverForeground#a9cdf1f0
  • list.inactiveSelectionBackground#4679ac2a
  • list.inactiveSelectionForeground#d5a669ff
  • list.invalidItemForeground#f58fffff
  • list.warningForeground#feba76ff
  • listFilterWidget.outline#030a0fff
  • menu.background#0b1217ff
  • menu.border#0b1217ff
  • menu.foreground#a5c9ed80
  • menu.selectionBackground#6699cc40
  • menu.selectionBorder#6699cc40
  • menu.selectionForeground#a9cdf1f0
  • menu.separatorBackground#6699cc80
  • menubar.selectionBackground#6699cc40
  • menubar.selectionBorder#6699cc40
  • menubar.selectionForeground#a5c9ed80
  • minimap.background#131A1F
  • minimap.errorHighlight#ff003378
  • minimap.selectionHighlight#6699cc40
  • minimap.warningHighlight#cc884478
  • notificationCenter.border#131A1F
  • notificationCenterHeader.background#1b2227ff
  • notificationCenterHeader.foreground#a5c9ed60
  • notificationLink.foreground#5e91c4ff
  • notifications.background#1b2227f0
  • notifications.border#6699ccf0
  • notifications.foreground#a5c9ed60
  • notificationsErrorIcon.foreground#ff003378
  • notificationsInfoIcon.foreground#6699ccff
  • notificationsWarningIcon.foreground#cc884478
  • notificationToast.border#6699ccf0
  • panel.background#131A1F
  • panel.border#a5c9ed20
  • panelTitle.activeBorder#c9e2fc40
  • panelTitle.activeForeground#c9e2fc40
  • panelTitle.inactiveForeground#99b2cc40
  • pickerGroup.foreground#fbc37bff
  • progressBar.background#1b2227ff
  • quickInput.foreground#a5c9ed60
  • scrollbar.shadow#030a0fff
  • scrollbarSlider.activeBackground#6699cc80
  • scrollbarSlider.background#6699cc40
  • scrollbarSlider.hoverBackground#6699cc40
  • selection.background#6699cc40
  • settings.checkboxBackground#232a2fff
  • settings.checkboxBorder#131A1F
  • settings.dropdownBorder#131A1F
  • settings.dropdownListBorder#131A1F
  • settings.headerForeground#6699CC
  • settings.modifiedItemIndicator#84a8cc60
  • settings.numberInputBorder#131A1F
  • settings.textInputBorder#131A1F
  • sideBar.background#171e23ff
  • sideBar.border#0f161bff
  • sideBar.dropBackground#84a8cc60
  • sideBar.foreground#a5c9ed60
  • sideBarSectionHeader.background#171e23ff
  • sideBarSectionHeader.border#a5c9ed20
  • sideBarSectionHeader.foreground#95b5d560
  • sideBarTitle.foreground#84a8cc60
  • statusBar.background#171e23ff
  • statusBar.border#a5c9ed20
  • statusBar.debuggingBackground#7eb1e4ff
  • statusBar.debuggingForeground#000000
  • statusBar.foreground#a5c9ed60
  • statusBar.noFolderBackground#6699cc80
  • statusBar.noFolderForeground#ffffff
  • statusBarItem.activeBackground#6699cc80
  • statusBarItem.hoverBackground#6699cc40
  • statusBarItem.prominentBackground#6699cc80
  • statusBarItem.prominentHoverBackground#6699cc40
  • statusBarItem.remoteBackground#171e23ff
  • statusBarItem.remoteForeground#6699CC
  • tab.activeBackground#1b2227ff
  • tab.activeBorder#1b2227ff
  • tab.activeBorderTop#6699CC
  • tab.activeForeground#ffffff
  • tab.activeModifiedBorder#6699CC
  • tab.border#030a0fff
  • tab.hoverBackground#6699cc10
  • tab.hoverBorder#f5cea8c0
  • tab.hoverForeground#6699cca0
  • tab.inactiveBackground#171e23ff
  • tab.inactiveForeground#ffffff80
  • tab.inactiveModifiedBorder#f5cea8ff
  • tab.lastPinnedBorder#84a8cc40
  • tab.unfocusedActiveBorder#1b2227ff
  • tab.unfocusedActiveBorderTop#6699cca0
  • tab.unfocusedActiveForeground#ffffffa0
  • tab.unfocusedActiveModifiedBorder#6699cca0
  • tab.unfocusedHoverForeground#6699cc60
  • tab.unfocusedInactiveBackground#171e23ff
  • tab.unfocusedInactiveForeground#ffffff40
  • tab.unfocusedInactiveModifiedBorder#f5cea8a0
  • 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#171e23ff
  • terminal.border#030a0fff
  • terminal.foreground#4c5e6f
  • terminal.selectionBackground#6699cc40
  • terminalCursor.foreground#4c5e6f
  • textBlockQuote.border#6699cc80
  • textCodeBlock.background#6699cc80
  • textLink.activeForeground#7eb1e4ff
  • textLink.foreground#5e91c4ff
  • textSeparator.foreground#6699cc80
  • titleBar.activeBackground#0b1217ff
  • titleBar.activeForeground#a5c9ed60
  • titleBar.border#030a0fff
  • titleBar.inactiveBackground#131a1fff
  • titleBar.inactiveForeground#6589ad60
  • welcomePage.background#131A1F
  • welcomePage.buttonBackground#171e23ff
  • welcomePage.buttonHoverBackground#1b2227ff
  • welcomePage.progress.foreground#6699CC
  • window.activeBorder#84a8cc60
  • window.inactiveBorder#6589ad60

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#6c906bee
meta.preprocessor, punctuation.definition.preprocessor#c59d76ee
keyword.other.phpdoc#3f7337ee
punctuation.definition.comment, punctuation.whitespace.comment#83ae84ee
punctuation.section.embedded#6e6e6eee
source.ruby.embedded#ac7879ee
keyword.other.directive#bcbcbcee
keyword.other.directive.line-number
string, string.unquoted#b56b6bee
string.unquoted.heredoc#b5b5b5ee
support.constant.numeric, constant.numeric#6cb5b4ee
constant, support.constant#b5b590ee
constant.character, constant.other#ac7879ee
variable.other.constant#b5b590ee
keyword, keyword.control, meta.selector.css, entity.other.attribute-name#dab591ee
variable.other.readwrite.instance#dab591ee
entity.name.module, support.other.module#db6600ee
keyword.operator#c9c9c9ee
keyword.operator.symbol.infix.floating-point
source.ocaml, keyword.operator.symbol.prefix.floating-point
storage.type, storage.modifier, support.type#dbd780ee
entity.name.class.variant#2b6683ee
entity.other#b5b5b5ee
entity.other.inherited-class#b67209ee
storage.type.user-defined, meta.property-list#dbbe00ee
entity.name.type, entity.name.type.class, entity.other.attribute-name.class.css, support.class, entity.name.class#d0830dee
invalid#dbaccbee
entity.other.attribute-name.html#b5b691ee
entity.name.tag#b5b691ee
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#6e6e6eee
support.function.construct#dab591ee
punctuation.definition.variable#dab591ee
meta.function-name, entity.name.function#dbd96cee
support.function#a79b06ee
meta.brace#5eaeacee
punctuation.definition.string.begin, punctuation.definition.string.end#b5b5b5ee
punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, meta.tag.structure.any.html#dab490ee
entity.name.tag.yaml#dab591ee
punctuation.definition.entry#b5b5b5ee
keyword.other.DML.sql, keyword.other.data-integrity.sql#989898ee
source.sql, constant.other.database-name.sql, constant.other.table-name.sql, keyword.operator.star#79a0d0ee
source.diff, meta.diff.comment, meta.toc-list.comment.diff#dbdbdbee
meta.diff.header.from-file#aa5859ee
meta.diff.header.to-file#48956fee
meta.diff.range.unified#71afb2ee
markup.inserted.diff#48956fee
markup.deleted.diff#aa5859ee
string.regexp#a7562cee
string.regexp.arbitrary-repitition#815247ee
punctuation.definition.arbitrary-repitition#dbdbdbee
string.regexp.character-class#ab7367ee
punctuation.definition.character-class#dbdbdbee
markup.raw.inline.markdown#dab591ee
markup.heading.markdown, punctuation.definition.heading#dbdbdbee
markup.list#bcbcbcee
sublimelinter.mark.warning#bb9800ee
sublimelinter.gutter-mark#dbdbdbee
sublimelinter.mark.error#af0d00ee
doctype#a8aeacee
entity#a8aeacee
hyperlink#3d7483ee
invisibles#dbdbdbee
level0#102f10ee
level1#10102fee
level10#2c4b4bee
level2#2f2f10ee
level3#2f102fee
level4#102f2fee
level5#4b2c2cee
level6#2c4b2cee
level7#2c2c4bee
level8#4b4b2cee
level9#4b2c4bee
markup#b2b2b2ee
match#dbac4eee
meta#9d9083ee
none#624e54ee
property#6c7e97ee
punctuation#dbb152ee
source#bababaee
storage#632c4bee
support#c788ccee
text#bababaee
variable#9d8d7eee
wordhighlight#5ddb00ee

Shiki preview

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

Loading...