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#fff09110
  • activityBar.activeBorder#ffdb53ff
  • activityBar.activeFocusBorder#ffdb53ff
  • activityBar.background#0e0e12ff
  • activityBar.border#0d0d0fff
  • activityBar.foreground#ffbb33ff
  • activityBar.inactiveForeground#ffcf7060
  • activityBarBadge.background#8fc2ffc0
  • activityBarBadge.foreground#000000
  • badge.background#8fc2ffc0
  • badge.foreground#000000
  • breadcrumb.activeSelectionForeground#ffbb33a0
  • breadcrumb.background#1a1a1eff
  • breadcrumb.focusForeground#ffbb33ff
  • breadcrumb.foreground#ffbb33a0
  • button.background#16161aff
  • button.foreground#edede9ff
  • button.hoverBackground#1a1a1eff
  • descriptionForeground#edede9ff
  • dropdown.background#303034ff
  • dropdown.border#101014ff
  • dropdown.foreground#b2b2b6ff
  • dropdown.listBackground#303034ff
  • editor.background#121216
  • editor.findMatchBackground#8fb4ff1e
  • editor.findMatchHighlightBackground#8fb4ff3c
  • editor.findRangeHighlightBackground#c5ff6723
  • editor.foreground#fff09160
  • editor.lineHighlightBackground#dfd07120
  • editor.selectionBackground#ffbb3340
  • editor.selectionHighlightBackground#ffb83349
  • editor.selectionHighlightBorder#ffbb3340
  • editor.wordHighlightStrongBackground#ffb83349
  • editor.wordHighlightStrongBorder#ffbb33a0
  • editorBracketMatch.background#ff336660
  • editorBracketMatch.border#ff336660
  • editorError.foreground#ff0033
  • editorGroup.border#0d0d0fff
  • editorGroupHeader.border#0d0d0fff
  • editorGroupHeader.noTabsBackground#16161aff
  • editorGroupHeader.tabsBackground#16161aff
  • editorGroupHeader.tabsBorder#ffcf7060
  • editorGutter.background#121216
  • editorGutter.modifiedBackground#ffbb33ff
  • editorHoverWidget.border#bfb05160
  • editorIndentGuide.activeBackground#ffbb3349
  • editorIndentGuide.background#1a1a1eff
  • editorLineNumber.activeForeground#ffedaaa0
  • editorLineNumber.foreground#ffdd9a40
  • editorOverviewRuler.errorForeground#ff0033
  • editorOverviewRuler.findMatchForeground#ffbb3340
  • editorOverviewRuler.warningForeground#cc884478
  • editorOverviewRuler.wordHighlightForeground#ffb83349
  • editorPane.background#0f0f13ff
  • editorSuggestWidget.background#121216
  • editorSuggestWidget.border#bfb05160
  • editorSuggestWidget.selectedBackground#222226ff
  • editorUnnecessaryCode.border#12121680
  • editorUnnecessaryCode.opacity#12121680
  • editorWidget.background#16161aff
  • editorWidget.border#ffbb33ff
  • editorWidget.foreground#ffbb33ff
  • errorForeground#ffbb33ff
  • focusBorder#bfb05160
  • foreground#fff09160
  • gitDecoration.untrackedResourceForeground#99bb33
  • icon.foreground#ffbb33ff
  • input.background#222226ff
  • input.border#121216
  • input.foreground#ffedaaa0
  • input.placeholderForeground#dfbd7a40
  • inputOption.activeBackground#f7b32b3c
  • inputOption.activeBorder#f7b32b4b
  • list.activeSelectionBackground#ffbb332a
  • list.activeSelectionForeground#fcc980ff
  • list.dropBackground#303034ff
  • list.errorForeground#ff4b7eff
  • list.focusBackground#ffbb332a
  • list.focusForeground#fff495f0
  • list.highlightForeground#f7b32b80
  • list.hoverBackground#df9b132a
  • list.hoverForeground#fff495f0
  • list.inactiveSelectionBackground#df9b132a
  • list.inactiveSelectionForeground#d6ab6dff
  • list.invalidItemForeground#f58fffff
  • list.warningForeground#feba76ff
  • listFilterWidget.outline#0d0d0fff
  • menu.background#16161af0
  • menu.border#16161af0
  • menu.foreground#fff09180
  • menu.selectionBackground#ffbb3340
  • menu.selectionBorder#ffbb3340
  • menu.selectionForeground#fff495f0
  • menu.separatorBackground#ffbb3380
  • menubar.selectionBackground#ffbb3340
  • menubar.selectionBorder#ffbb3340
  • menubar.selectionForeground#fff09180
  • minimap.background#121216
  • minimap.errorHighlight#ff003378
  • minimap.selectionHighlight#ffbb3340
  • minimap.warningHighlight#cc884478
  • notificationCenter.border#121216
  • notificationCenterHeader.background#1a1a1eff
  • notificationCenterHeader.foreground#fff09160
  • notificationLink.foreground#f7b32bff
  • notifications.background#1a1a1ef0
  • notifications.border#ffbb33f0
  • notifications.foreground#fff09160
  • notificationsErrorIcon.foreground#ff003378
  • notificationsInfoIcon.foreground#ffbb33ff
  • notificationsWarningIcon.foreground#cc884478
  • notificationToast.border#ffbb33f0
  • panel.background#101014ff
  • panel.border#fff09120
  • panelTitle.activeBorder#ffffca40
  • panelTitle.activeForeground#ffffca40
  • panelTitle.inactiveForeground#ffdd9a40
  • pickerGroup.foreground#fcc980ff
  • progressBar.background#1a1a1eff
  • quickInput.foreground#fff09160
  • scrollbar.shadow#020206ff
  • scrollbarSlider.activeBackground#ffbb3380
  • scrollbarSlider.background#ffbb3340
  • scrollbarSlider.hoverBackground#ffbb3340
  • selection.background#ffbb3340
  • settings.checkboxBackground#222226ff
  • settings.checkboxBorder#121216
  • settings.dropdownBorder#121216
  • settings.dropdownListBorder#121216
  • settings.headerForeground#ffbb33ff
  • settings.modifiedItemIndicator#ffcf7060
  • settings.numberInputBorder#121216
  • settings.textInputBorder#121216
  • sideBar.background#121216
  • sideBar.border#0d0d0fff
  • sideBar.dropBackground#ffcf7060
  • sideBar.foreground#fff09160
  • sideBarSectionHeader.background#121216
  • sideBarSectionHeader.border#fff09120
  • sideBarSectionHeader.foreground#e6d88360
  • sideBarTitle.foreground#ffcf7060
  • statusBar.background#16161aff
  • statusBar.border#fff09120
  • statusBar.debuggingBackground#ffd34bff
  • statusBar.debuggingForeground#000000
  • statusBar.foreground#fff09160
  • statusBar.noFolderBackground#ffbb3380
  • statusBar.noFolderForeground#ffffff
  • statusBarItem.activeBackground#ffbb3380
  • statusBarItem.hoverBackground#ffbb3340
  • statusBarItem.prominentBackground#ffbb3380
  • statusBarItem.prominentHoverBackground#ffbb3340
  • statusBarItem.remoteBackground#16161aff
  • statusBarItem.remoteForeground#ffbb33ff
  • tab.activeBackground#1a1a1eff
  • tab.activeBorder#1a1a1eff
  • tab.activeBorderTop#ffbb33ff
  • tab.activeForeground#ffffff
  • tab.activeModifiedBorder#ffbb33ff
  • tab.border#0d0d0fff
  • tab.hoverBackground#ffbb3310
  • tab.hoverBorder#8fc2ffc0
  • tab.hoverForeground#ffbb33a0
  • tab.inactiveBackground#121216
  • tab.inactiveForeground#ffffff80
  • tab.inactiveModifiedBorder#8fc2ffff
  • tab.lastPinnedBorder#ffcf7040
  • tab.unfocusedActiveBorder#1a1a1eff
  • tab.unfocusedActiveBorderTop#ffbb33a0
  • tab.unfocusedActiveForeground#ffffffa0
  • tab.unfocusedActiveModifiedBorder#ffbb33a0
  • tab.unfocusedHoverForeground#ffbb3360
  • tab.unfocusedInactiveBackground#121216
  • tab.unfocusedInactiveForeground#ffffff40
  • tab.unfocusedInactiveModifiedBorder#8fc2ffa0
  • 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#121216
  • terminal.border#0d0d0fff
  • terminal.foreground#6b6544
  • terminal.selectionBackground#ffbb3340
  • terminalCursor.foreground#6b6544
  • textBlockQuote.border#ffbb3380
  • textCodeBlock.background#ffbb3380
  • textLink.activeForeground#ffd34bff
  • textLink.foreground#f7b32bff
  • textSeparator.foreground#ffbb3380
  • titleBar.activeBackground#0f0f13ff
  • titleBar.activeForeground#ffdb5360
  • titleBar.border#0d0d0fff
  • titleBar.inactiveBackground#17171bff
  • titleBar.inactiveForeground#b3a86680
  • welcomePage.background#121216
  • welcomePage.buttonBackground#16161aff
  • welcomePage.buttonHoverBackground#1a1a1eff
  • welcomePage.progress.foreground#ffbb33ff
  • window.activeBorder#ffcf7060
  • window.inactiveBorder#b3a86680

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#87AE86
meta.preprocessor, punctuation.definition.preprocessor#E8BC92
keyword.other.phpdoc#568E4D
punctuation.definition.comment, punctuation.whitespace.comment#A0CFA1
punctuation.section.embedded#898989
source.ruby.embedded#CC9495
keyword.other.directive#DEDEDEbold
keyword.other.directive.line-numberunderline
string, string.unquoted#D68686
string.unquoted.heredoc#D6D6D6
support.constant.numeric, constant.numeric#87D6D5
constant, support.constant#D6D6AEbold
constant.character, constant.other#CC9495
variable.other.constant#D6D6AE
keyword, keyword.control, meta.selector.css, entity.other.attribute-name#FED6AF
variable.other.readwrite.instance#FED6AF
entity.name.module, support.other.module#FF8000bold
keyword.operator#ECECEC
keyword.operator.symbol.infix.floating-pointunderline
source.ocaml, keyword.operator.symbol.prefix.floating-pointunderline
storage.type, storage.modifier, support.type#FFFB9D
entity.name.class.variant#4080A0
entity.other#D6D6D6
entity.other.inherited-class#D78D1B
storage.type.user-defined, meta.property-list#FFE000
entity.name.type, entity.name.type.class, entity.other.attribute-name.class.css, support.class, entity.name.class#F4A020
invalid#FFCCEEbold italic underline
entity.other.attribute-name.html#D6D7AFbold
entity.name.tag#D6D7AF
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#898989
support.function.construct#FED6AF
punctuation.definition.variable#FED6AF
meta.function-name, entity.name.function#FFFD87
support.function#C7BA18
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#FED5AE94bold
entity.name.tag.yaml#FED6AFbold
punctuation.definition.entry#D6D6D6
keyword.other.DML.sql, keyword.other.data-integrity.sql#B7B7B7bold
source.sql, constant.other.database-name.sql, constant.other.table-name.sql, keyword.operator.star#95BFF3bold
source.diff, meta.diff.comment, meta.toc-list.comment.diff#FFFFFF
meta.diff.header.from-file#CA7172bold
meta.diff.header.to-file#60B38Abold
meta.diff.range.unified#8CD0D3
markup.inserted.diff#60B38A
markup.deleted.diff#CA7172
string.regexp#C76F41
string.regexp.arbitrary-repitition#9E6A5F
punctuation.definition.arbitrary-repitition#FFFFFF5E
string.regexp.character-class#CB8E81
punctuation.definition.character-class#FFFFFF5E
markup.raw.inline.markdown#FED6AF
markup.heading.markdown, punctuation.definition.heading#FFFFFFbold
markup.list#DEDEDE
sublimelinter.mark.warning#DDB700
sublimelinter.gutter-mark#FFFFFF
sublimelinter.mark.error#D02000
doctype#c8cecc
entity#c8cecc
hyperlink#548fa0ff
invisibles#ffffffff
level0#234523
level1#232345
level10#416363
level2#454523
level3#452345
level4#234545
level5#634141
level6#416341
level7#414163
level8#636341
level9#634163
markup#d3d3d3
match#ffcc66
meta#bcaea0
none#7c666d
property#879ab5ff
punctuation#ffd26a bold
source#dcdcdcff
storage#7d4163
support#eaa5ef
text#dcdcdcff
variable#bcab9a
wordhighlight#77FF11

Shiki preview

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

Loading...