Skip to main content
Coding Theme

Wonda Matrix Theme

Publisher: Wonda Matrix ThemeThemes in package: 1

A stunning Matrix-inspired dark theme with cyberpunk aesthetics - featuring iconic digital green on deep space black

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.activeBorder#00ff41
  • activityBar.background#0d1117
  • activityBar.foreground#00ff41
  • activityBar.inactiveForeground#e6e6e6
  • activityBarBadge.background#00ff41
  • activityBarBadge.foreground#0d1117
  • activityBarTop.activeBorder#00ff41
  • activityBarTop.background#0d1117
  • activityBarTop.foreground#00ff41
  • activityBarTop.inactiveForeground#e6e6e6
  • badge.background#00ff41
  • badge.foreground#0d1117
  • button.background#1a4d2e
  • button.border#00ff41
  • button.foreground#ffffff
  • button.hoverBackground#00ff41
  • button.secondaryBackground#0e2818
  • button.secondaryForeground#e6e6e6
  • button.secondaryHoverBackground#1a4d2e
  • checkbox.background#0e2818
  • checkbox.border#1a4d2e
  • checkbox.foreground#00ff41
  • dropdown.background#0a0e13
  • dropdown.border#00ff41
  • dropdown.foreground#e6e6e6
  • dropdown.listBackground#0d1117
  • editor.background#0d1117
  • editor.findMatchBackground#00ff4160
  • editor.findMatchBorder#00ff41
  • editor.findMatchHighlightBackground#00ff4140
  • editor.findMatchHighlightBorder#00ff4180
  • editor.findRangeHighlightBackground#00ff4120
  • editor.foreground#e6e6e6
  • editor.lineHighlightBackground#0e281880
  • editor.selectionBackground#1a4d2e80
  • editorBracketHighlight.foreground1#00ff41
  • editorBracketHighlight.foreground2#33ff66
  • editorBracketHighlight.foreground3#00cc33
  • editorBracketHighlight.foreground4#00ff41
  • editorBracketHighlight.foreground5#33ff66
  • editorBracketHighlight.foreground6#00cc33
  • editorBracketHighlight.unexpectedBracket.foreground#ff0000
  • editorBracketMatch.background#1a4d2e80
  • editorBracketMatch.border#00ff41
  • editorBracketPairGuide.activeBackground1#00ff41
  • editorBracketPairGuide.activeBackground2#33ff66
  • editorBracketPairGuide.activeBackground3#00cc33
  • editorBracketPairGuide.activeBackground4#00ff41
  • editorBracketPairGuide.activeBackground5#33ff66
  • editorBracketPairGuide.activeBackground6#00cc33
  • editorBracketPairGuide.background1#00ff4120
  • editorBracketPairGuide.background2#33ff6620
  • editorBracketPairGuide.background3#00cc3320
  • editorBracketPairGuide.background4#00ff4120
  • editorBracketPairGuide.background5#33ff6620
  • editorBracketPairGuide.background6#00cc3320
  • editorCursor.foreground#00ff41
  • editorGroupHeader.noTabsBackground#0a0e13
  • editorGroupHeader.tabsBackground#0a0e13
  • editorGroupHeader.tabsBorder#1a4d2e
  • editorWhitespace.foreground#1a4d2e40
  • editorWidget.background#0d1117
  • editorWidget.foreground#e6e6e6
  • focusBorder#00ff41
  • foreground#e6e6e6
  • input.background#0e2818
  • input.border#1a4d2e
  • input.foreground#00ff41
  • input.placeholderForeground#4d774e
  • inputOption.activeBackground#1a4d2e
  • inputOption.activeBorder#00ff41
  • inputOption.activeForeground#00ff41
  • inputValidation.infoBorder#1a4d2e
  • list.activeSelectionBackground#1a4d2e
  • list.activeSelectionForeground#00ff41
  • list.activeSelectionIconForeground#00ff41
  • list.filterMatchBackground#00ff4140
  • list.filterMatchBorder#00ff41
  • list.focusAndSelectionOutline#00ff41
  • list.focusBackground#1a4d2e
  • list.focusForeground#ffffff
  • list.focusHighlightForeground#00ff41
  • list.focusOutline#00ff41
  • list.highlightForeground#00ff41
  • list.hoverBackground#0e2818
  • list.inactiveSelectionBackground#0e2818
  • panel.background#0d1117
  • panel.border#1a4d2e
  • panel.dropBorder#00ff41
  • panelInput.border#1a4d2e
  • panelSection.border#1a4d2e
  • panelSection.dropBackground#0e2818
  • panelSectionHeader.background#0a0e13
  • panelSectionHeader.border#1a4d2e
  • panelSectionHeader.foreground#ffffff
  • panelTitle.activeBorder#00ff41
  • panelTitle.activeForeground#00ff41
  • panelTitle.inactiveForeground#e6e6e6
  • quickInput.background#0a0e13
  • quickInput.foreground#e6e6e6
  • quickInputList.focusBackground#1a4d2e
  • quickInputList.focusForeground#ffffff
  • quickInputList.focusIconForeground#00ff41
  • quickInputTitle.background#0d1117
  • scrollbarSlider.activeBackground#00ff4160
  • scrollbarSlider.background#1a4d2e40
  • scrollbarSlider.hoverBackground#1a4d2e
  • searchEditor.findMatchBackground#00ff4160
  • searchEditor.findMatchBorder#00ff41
  • sideBar.background#0d1117
  • sideBar.border#1a4d2e
  • sideBar.foreground#e6e6e6
  • sideBarActivityBarTop.border#1a4d2e
  • sideBarSectionHeader.background#0a0e13
  • sideBarSectionHeader.border#1a4d2e
  • sideBarSectionHeader.foreground#ffffff
  • sideBarTitle.foreground#ffffff
  • statusBar.background#0d1117
  • statusBar.foreground#e6e6e6
  • tab.activeBackground#0e2818
  • tab.activeBorder#00ff41
  • tab.activeBorderTop#00ff41
  • tab.activeForeground#ffffff
  • tab.border#1a4d2e
  • tab.hoverBackground#0e281860
  • tab.hoverBorder#1a4d2e
  • tab.hoverForeground#ffffff
  • tab.inactiveBackground#0d1117
  • tab.inactiveForeground#888888
  • terminal.background#0d1117
  • terminal.foreground#00ff41
  • terminalCursor.foreground#00ff41
  • textBlockQuote.background#0a0e13
  • textBlockQuote.border#1a4d2e
  • textCodeBlock.background#0a0e13
  • textLink.activeForeground#00ffff
  • textLink.foreground#00ccff
  • textPreformat.foreground#e6e6e6
  • textSeparator.foreground#1a4d2e
  • titleBar.activeBackground#0e2818
  • titleBar.activeForeground#ffffff
  • titleBar.inactiveBackground#0d1117
  • titleBar.inactiveForeground#888888

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#4d774eitalic
variable, variable.other, variable.parameter#00cc33—
constant.language.boolean, constant.language.null, constant.language.undefined#0099ccbold
constant.numeric, constant.language.numeric, constant.numeric.hex, constant.numeric.octal, constant.numeric.binary, constant.numeric.float, constant.numeric.decimal#00ff41—
constant, entity.name.constant, variable.other.constant#00cc33—
variable.language.this, variable.language.super, variable.language.self#9933ccbold italic
entity.name.type, entity.name.class, entity.name.interface, support.class, support.type#00ffffbold
entity.name.function, entity.name.method, variable.function, support.function#00ff41bold
entity.name.tag#00cc33bold
entity.other.attribute-name#66cc66—
keyword.control, keyword.operator.new, keyword.other#00ffffbold
keyword.operator, keyword.operator.arithmetic, keyword.operator.comparison, keyword.operator.logical, keyword.operator.assignment#ff3366bold
storage, storage.type, storage.modifier#00ffffbold
storage.modifier.package, storage.modifier.import, keyword.control.import, keyword.control.export, keyword.control.from#00cc33—
string, string.quoted#ffffff—
string.template, punctuation.definition.template-expression#ffffff—
punctuation.definition.string#33ffaa—
string.regexp, constant.character.escape#33ffaa—
punctuation.separator, punctuation.terminator, punctuation.accessor#66cc66—
punctuation.section.embedded#00cc33—
meta.brace, punctuation.definition.block, punctuation.definition.parameters, punctuation.definition.array#00ff41—
meta.property-name, support.type.property-name#99ddaa—
meta.object-literal.key#99ddaa—
invalid.broken#ff0000bold
invalid.deprecated#ff6600strikethrough
invalid.illegal#ff0000bold underline
markup.bold#ffffffbold
markup.italic#e6e6e6italic
markup.heading#ffffffbold
markup.inserted#00ff88—
markup.deleted#ff6666—
markup.changed#ffcc66—
markup.inline.raw, markup.fenced_code#00ff88—
markup.quote#999999italic
markup.list#e6e6e6—
markup.underline.link#00ccffunderline
text.html.markdown, meta.paragraph.markdown#e6e6e6—
Wonda Matrix Theme by Wonda Matrix Theme - VS Code Theme