Matrix Mint

Name: Matrix Mint
Author: Barkerbg001

Publisher: Barkerbg001Themes in package: 1

A minimal, dark theme for VS Code with vibrant green Matrix-inspired accents and an interactive Matrix animation that appears while typing.

GitHub

VS Code preview

Full workbench mockup using this variant's colors and tokenColors.

Matrix Mint — Matrix Mint

fetchUser.ts

index.ts

README.md

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Dark+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.background#0a1a0a
activityBar.border#0a1a0a
activityBar.dropBorder#1a4d1a
activityBar.foreground#4d9966
activityBar.inactiveForeground#4d996699
activityBarBadge.background#00ff41
activityBarBadge.foreground#0a1a0a
badge.background#00ff41
badge.foreground#0f1f0f
breadcrumb.activeSelectionForeground#c5d3e0
breadcrumb.background#0f1f0f
breadcrumb.focusForeground#c5d3e0
breadcrumb.foreground#4d9966
breadcrumbPicker.background#0a1a0a
button.background#00ff41
button.foreground#0a1a0a
button.hoverBackground#00ff4199
debugExceptionWidget.background#1a4d1a
debugExceptionWidget.border#1a4d1a
debugToolBar.background#1a4d1a
debugToolBar.border#1a4d1a
descriptionForeground#c5d3e0
diffEditor.border#1a4d1a
diffEditor.insertedTextBackground#66ffaa22
diffEditor.insertedTextBorder#66ffaa44
diffEditor.removedTextBackground#ff444422
diffEditor.removedTextBorder#ff444444
dropdown.background#1a4d1a
dropdown.border#1a4d1a
dropdown.foreground#c5d3e0
dropdown.listBackground#0a1a0a
editor.background#0f1f0f
editor.findMatchBackground#4d996677
editor.findMatchBorder#00ff41
editor.findMatchHighlightBackground#4d996677
editor.findRangeHighlightBackground#4d996677
editor.foreground#a2aabc
editor.hoverHighlightBackground#4d996677
editor.inactiveSelectionBackground#4d996677
editor.lineHighlightBackground#1a4d1a
editor.lineHighlightBorder#1a4d1a
editor.rangeHighlightBackground#1a4d1a
editor.selectionBackground#1a4d1a
editor.selectionForeground#a2aabc
editor.selectionHighlightBackground#1a4d1a
editor.wordHighlightBackground#4d996677
editor.wordHighlightStrongBackground#4d996677
editorBracketMatch.background#4d996655
editorBracketMatch.border#00ff41
editorCodeLens.foreground#c5d3e0
editorCursor.background#0f1f0f
editorCursor.foreground#00ff41
editorError.foreground#ff4444
editorGroup.border#1a4d1a
editorGroup.dropBackground#1a4d1a
editorGroup.emptyBackground#0f1f0f
editorGroup.focusedEmptyBorder#0f1f0f
editorGroupHeader.noTabsBackground#0f1f0f
editorGroupHeader.tabsBackground#0a1a0a
editorGroupHeader.tabsBorder#0a1a0a
editorGutter.addedBackground#66ffaa
editorGutter.background#0f1f0f
editorGutter.deletedBackground#ff4444
editorGutter.modifiedBackground#00ff88
editorHint.foreground#00ff41
editorHoverWidget.background#1a4d1a
editorHoverWidget.border#1a4d1a
editorIndentGuide.activeBackground#4d996677
editorIndentGuide.background#4d996633
editorInfo.foreground#00ff88
editorInlayHint.background#0a1a0a
editorInlayHint.foreground#4d996699
editorLineNumber.activeForeground#4d9966
editorLineNumber.foreground#4d996655
editorLink.activeForeground#00ff41
editorMarkerNavigation.background#1a4d1a
editorMarkerNavigationError.background#ff4444
editorMarkerNavigationInfo.background#00ff88
editorMarkerNavigationWarning.background#00ff41
editorOverviewRuler.addedForeground#66ffaa
editorOverviewRuler.border#1a4d1a
editorOverviewRuler.bracketMatchForeground#00ff41
editorOverviewRuler.commonContentForeground#1a4d1a
editorOverviewRuler.currentContentForeground#00ff88
editorOverviewRuler.deletedForeground#ff4444
editorOverviewRuler.errorForeground#ff4444
editorOverviewRuler.findMatchForeground#00ff41
editorOverviewRuler.incomingContentForeground#66ffaa
editorOverviewRuler.infoForeground#00ff88
editorOverviewRuler.modifiedForeground#00ff88
editorOverviewRuler.rangeHighlightForeground#4d9966
editorOverviewRuler.selectionHighlightForeground#4d9966
editorOverviewRuler.warningForeground#99ffcc
editorOverviewRuler.wordHighlightForeground#4d9966
editorOverviewRuler.wordHighlightStrongForeground#4d9966
editorPane.background#0f1f0f
editorRuler.foreground#1a4d1a
editorSuggestWidget.background#1a4d1a
editorSuggestWidget.border#1a4d1a
editorSuggestWidget.foreground#c5d3e0
editorSuggestWidget.highlightForeground#00ff41
editorSuggestWidget.selectedBackground#0f1f0f
editorWarning.foreground#99ffcc
editorWhitespace.foreground#4d996677
editorWidget.background#0a1a0a
editorWidget.border#0a1a0a
errorForeground#ff4444
extensionButton.prominentBackground#00ff41
extensionButton.prominentForeground#0f1f0f
extensionButton.prominentHoverBackground#00ff4199
focusBorder#4d996677
foreground#4d9966
gitDecoration.conflictingResourceForeground#ff4444
gitDecoration.deletedResourceForeground#ff4444
gitDecoration.ignoredResourceForeground#4d996677
gitDecoration.modifiedResourceForeground#00ff88
gitDecoration.untrackedResourceForeground#66ffaa
input.background#0f1f0f
input.border#1a4d1a
input.foreground#c5d3e0
input.placeholderForeground#4d996677
inputOption.activeBorder#1a4d1a
inputValidation.errorBackground#0f1f0f
inputValidation.errorBorder#ff4444
inputValidation.errorForeground#ff4444
inputValidation.infoBackground#0f1f0f
inputValidation.infoBorder#00ff88
inputValidation.infoForeground#00ff88
inputValidation.warningBackground#0f1f0f
inputValidation.warningBorder#99ffcc
inputValidation.warningForeground#99ffcc
list.activeSelectionBackground#1a4d1a
list.activeSelectionForeground#c5d3e0
list.dropBackground#1a4d1a
list.errorForeground#ff4444
list.focusBackground#1a4d1a
list.focusForeground#c5d3e0
list.highlightForeground#00ff41
list.hoverBackground#1a4d1a
list.hoverForeground#c5d3e0
list.inactiveFocusBackground#1a4d1a
list.inactiveSelectionBackground#1a4d1a
list.inactiveSelectionForeground#c5d3e0
list.invalidItemForeground#ff4444
list.warningForeground#99ffcc
listFilterWidget.background#1a4d1a
listFilterWidget.noMatchesOutline#ff4444
listFilterWidget.outline#1a4d1a
menu.background#0a1a0a
menu.foreground#4d9966
menu.selectionBackground#1a4d1a
menu.selectionForeground#c5d3e0
menubar.selectionBackground#1a4d1a
menubar.selectionForeground#c5d3e0
merge.border#4d9966
merge.commonContentBackground#1a4d1a55
merge.commonHeaderBackground#1a4d1a77
merge.currentContentBackground#00ff8822
merge.currentHeaderBackground#00ff8877
merge.incomingContentBackground#66ffaa22
merge.incomingHeaderBackground#66ffaa77
notificationCenter.border#0a1a0a
notificationCenterHeader.background#0a1a0a
notificationCenterHeader.foreground#c5d3e0
notificationLink.foreground#c5d3e0
notifications.background#0a1a0a
notifications.border#0a1a0a
notifications.foreground#c5d3e0
notificationToast.border#0a1a0a
panel.background#0a1a0a
panel.border#0f1f0f
panel.dropBorder#1a4d1a
panelInput.border#4d9966
panelSection.border#1a4d1a
panelSection.dropBackground#1a4d1a
panelSectionHeader.background#0f1f0f
panelSectionHeader.foreground#00ff41
panelTitle.activeBorder#00ff41
panelTitle.activeForeground#c5d3e0
panelTitle.inactiveForeground#4d9966
peekView.border#00ff41
peekViewEditor.background#1a4d1a
peekViewEditor.matchHighlightBackground#4d9966
peekViewEditor.matchHighlightBorder#00ff41
peekViewEditorGutter.background#0f1f0f
peekViewResult.background#1a4d1a
peekViewResult.fileForeground#4d9966
peekViewResult.lineForeground#c5d3e0
peekViewResult.matchHighlightBackground#00ff4133
peekViewResult.selectionBackground#1a4d1a
peekViewResult.selectionForeground#c5d3e0
peekViewTitle.background#1a4d1a
peekViewTitleDescription.foreground#4d9966
peekViewTitleLabel.foreground#4d9966
pickerGroup.border#1a4d1a
pickerGroup.foreground#00ff41
progressBar.background#00ff41
scrollbar.shadow#00030F
scrollbarSlider.activeBackground#4d996677
scrollbarSlider.background#4d996655
scrollbarSlider.hoverBackground#4d996699
selection.background#4d996677
settings.checkboxBackground#1a4d1a
settings.checkboxBorder#1a4d1a
settings.checkboxForeground#c5d3e0
settings.dropdownBackground#1a4d1a
settings.dropdownBorder#1a4d1a
settings.dropdownForeground#c5d3e0
settings.dropdownListBorder#1a4d1a
settings.headerForeground#c5d3e0
settings.modifiedItemIndicator#00ff88
settings.numberInputBackground#1a4d1a
settings.numberInputBorder#1a4d1a
settings.numberInputForeground#c5d3e0
settings.textInputBackground#1a4d1a
settings.textInputBorder#1a4d1a
settings.textInputForeground#c5d3e0
sideBar.background#0a1a0a
sideBar.foreground#4d9966
sideBarSectionHeader.background#0f1f0f
sideBarSectionHeader.border#0a1a0a
sideBarSectionHeader.foreground#00ff41
sideBarTitle.foreground#00ff41
statusBar.background#0a1a0a
statusBar.border#0a1a0a
statusBar.debuggingBackground#0a1a0a
statusBar.debuggingForeground#4d9966
statusBar.foreground#4d9966
statusBar.noFolderBackground#0a1a0a
statusBar.noFolderForeground#4d9966
statusBarItem.activeBackground#1a4d1a
statusBarItem.hoverBackground#0f1f0f
statusBarItem.remoteBackground#0a1a0a
statusBarItem.remoteForeground#4d9966
tab.activeBackground#0f1f0f
tab.activeBorder#00ff41
tab.activeBorderTop#0a1a0a
tab.activeForeground#c5d3e0
tab.border#0a1a0a
tab.hoverBackground#1a4d1a
tab.hoverBorder#00ff41
tab.inactiveBackground#0a1a0a
tab.inactiveForeground#c5d3e077
tab.unfocusedActiveBackground#0f1f0f
tab.unfocusedActiveBorder#00ff4177
tab.unfocusedActiveBorderTop#0f1f0f
tab.unfocusedActiveForeground#c5d3e0
tab.unfocusedHoverBackground#0f1f0f
tab.unfocusedHoverBorder#00ff4177
tab.unfocusedInactiveForeground#c5d3e077
terminal.ansiBlack#1a4d1a
terminal.ansiBlue#00ff88
terminal.ansiBrightBlack#444a5e
terminal.ansiBrightBlue#00ff88
terminal.ansiBrightCyan#00ff88
terminal.ansiBrightGreen#66ffaa
terminal.ansiBrightMagenta#00ff41
terminal.ansiBrightRed#ff4444
terminal.ansiBrightWhite#a2aabc
terminal.ansiBrightYellow#00ff41
terminal.ansiCyan#00ff88
terminal.ansiGreen#66ffaa
terminal.ansiMagenta#00ff41
terminal.ansiRed#ff4444
terminal.ansiWhite#a2aabc
terminal.ansiYellow#00ff41
terminal.background#0a1a0a
terminal.border#0a1a0a
terminal.foreground#a2aabc
terminal.selectionBackground#4d996633
terminalCursor.background#00ff41
terminalCursor.foreground#00ff41
textBlockQuote.background#1a4d1a
textBlockQuote.border#1a4d1a
textCodeBlock.background#0a1a0a
textLink.activeForeground#00ff41
textLink.foreground#00ff41
textPreformat.foreground#c5d3e0
textSeparator.foreground#c5d3e0
titleBar.activeBackground#0a1a0a
titleBar.activeForeground#c5d3e0
titleBar.border#0a1a0a
titleBar.inactiveBackground#0a1a0a
titleBar.inactiveForeground#4d9966
tree.indentGuidesStroke#1a4d1a
walkThrough.embeddedEditorBackground#0a1a0a
welcomePage.buttonBackground#1a4d1a
welcomePage.buttonHoverBackground#1a4d1a99
widget.shadow#00030F

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
	#a2aabc	—
comment, punctuation.definition.comment	#4d996699	italic
variable, string constant.other.placeholder, source	#b3ffd9	—
constant.other.color, punctuation.definition.entity, constant.character.entity, punctuation.definition.template-expression, punctuation.section.tag.twig	#00ff41	—
invalid, invalid.illegal	#ff4444	—
keyword, storage.type, storage.modifier, constant.numeric, constant.language, support.constant, constant.character, constant.escape	#00ff41	—
punctuation, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution, meta.brace, meta.block, meta.jsx, meta.embedded.expression, meta.template.expression, meta.tag.block.any.html, string.unquoted.tag-string.nunjucks, text.html.nunjucks	#a2aabc	—
punctuation.separator.key-value.html, keyword.control, keyword.operator, constant.other.color, punctuation.definition.constant, meta.function.block.start.handlebars, meta.function.inline.other, meta.property-value, support.constant.mathematical-symbols, support.constant.vendored.property-value, punctuation.definition.keyword, punctuation.accessor, punctuation.separator.property, string.unquoted.filter-pipe	#33ff99	—
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter, support.variable.dom, meta.import, meta.export, meta.export.default, support.class.builtin, support.class.component, variable.other.object	#00ff88	—
entity.name.function, variable.function, support.function, keyword.other.special-method, meta.function-call, keyword.control.filter	#99ffcc	—
meta.block variable.other	#b3ffd9	—
variable.parameter, text.html, punctuation.section.property-list, meta.property-value.scss punctuation, meta.property-list, keyword.operator.type.annotation, variable.other.object.property	#b3ffd9	—
string, constant.other.symbol, constant.other.key, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js, punctuation.definition.string, entity.name.section.markdown, meta.attribute-selector, entity.name.import.go, storage.type.attr.nunjucks	#66ffaa	—
entity.name, support.type, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types, meta.object-literal.key	#66ffaa	—
support.type, support.class, keyword.other.debugger, entity.other.inherited-class, meta.property-name, punctuation.definition.raw.markdown, variable.graphql, variable.other.readwrite	#66ffaa	—
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name, support.type.property-name, support.variable.object.node, support.variable.object.process	#66ffaa	—
entity.name.module.js, variable.import.parameter.js	#ff4444	—
variable.language	#66ffaa	italic
entity.name.method.js	#66ffaa	italic
meta.class-method.js entity.name.function.js, variable.function.constructor	#66ffaa	—
entity.other.attribute-name	#33ff99	—
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name	#33ff99	—
entity.other.attribute-name.class, punctuation.definition.entity.css	#33ff99	—
source.sass keyword.control	#66ffaa	—
markup.inserted	#66ffaa	—
markup.deleted	#ff4444	—
markup.changed	#00ff41	—
string.regexp	#33ff99	—
constant.character.escape	#33ff99	—
url, link, uri	—	underline
meta.decorator, tag.decorator.js entity.name.tag, tag.decorator.js punctuation.definition.tag	#00ff41	—
source.js constant.other.object.key.js string.unquoted.label.js	#ff4444	italic
source.json meta.structure.dictionary.json support.type.property-name.json	#66ffaa	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#66ffaa	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#33ff99	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#66ffaa	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#33ff99	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#66ffaa	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#33ff99	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#66ffaa	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#33ff99	—
markup.italic	#ff4444	italic
markup.bold	#ff4444	bold
markup.underline	#00ff41	underline
markup.strike	#00ff41	italic
markup.quote	#66ffaa	italic
markup.raw.block	#33ff99	—
markup.table	#66ffaa	—
text.html.markdown, punctuation.definition.list_item.markdown	#a2aabc	—
text.html.markdown markup.raw.inline, text.html.markdown markup.inline.raw.string.markdown	#66ffaa	—
text.html.markdown meta.dummy.line-break	#a2aabc	—
markdown.heading, markup.heading, markup.heading entity.name, markup.heading.markdown, punctuation.definition.heading.markdown	#66ffaa	—
markup.quote, punctuation.definition.blockquote.markdown	#66ffaa	italic
string.other.link.title.markdown	#00ff41	underline
markup.raw.block.fenced.markdown	#c5d3e0	—
punctuation.definition.fenced.markdown, variable.language.fenced.markdown	#a2aabc	—
variable.language.fenced.markdown	#a2aabc
meta.separator	#a2aabc
token.info-token	#66ffaa	—
token.warn-token	#00ff41	—
token.error-token	#ff4444	—
token.debug-token	#00ff41	—
storage.type.error.go	#66ffaa	—
punctuation.other.period.go	#33ff99	—

Shiki preview

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

export interface User {
  id: string;
  name: string;
  role: "admin" | "member";
  tags: string[];
}

/**
 * Fetch user data by ID
 * @param id  
 * @returns User object or null if ID is invalid
 */
export async function fetchUser(id: string): Promise<User | null> {
  if (!id) {
    return null;
  }

  const response = await fetch(`/api/users/${id}`, {
    method: "GET",
    headers: { Accept: "application/json" },
  });

  if (!response.ok) {
    throw new Error(`HTTP ${response.status}`);
  }

  return (await response.json()) as User;
}

function greet(user: User): string {
  // Simple greeting function that uses the user's name
  return `Hello, ${user.name}!`;
}