Green Screen

Name: Green Screen
Author: mattseddon

Publisher: mattseddonThemes in package: 1

A green screen theme for VS Code

GitHub

VS Code preview

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

Green Screen — Green Screen

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.border#114411
activityBar.foreground#66ff66
activityBarBadge.background#44bb44
activityBarBadge.foreground#010b01
badge.background#449944
badge.foreground#010b01
button.background#449944
button.foreground#010b01
button.hoverBackground#66ff66
contrastActiveBorder#00000000
contrastBorder#00000000
descriptionForeground#339933
dropdown.background#010b01
dropdown.border#114411
dropdown.foreground#44bb44
editor.background#010b01
editor.findMatchBackground#114411
editor.findMatchHighlightBackground#114411
editor.foreground#44bb44
editor.hoverHighlightBackground#114411
editor.inactiveSelectionBackground#114411
editor.lineHighlightBackground#00000000
editor.lineHighlightBorder#00000000
editor.selectionBackground#114411
editor.selectionHighlightBackground#114411
editorBracketHighlight.foreground1#00eaff
editorBracketHighlight.foreground2#cca700
editorBracketHighlight.foreground3#66ff66
editorBracketMatch.background#00000000
editorBracketMatch.border#226622
editorCodeLens.foreground#44bb44
editorCursor.foreground#66ff66
editorError.foreground#ff1767
editorGroup.border#114411
editorGroup.dropBackground#010b01
editorGutter.addedBackground#226622
editorGutter.deletedBackground#226622
editorGutter.modifiedBackground#226622
editorHoverWidget.background#021002
editorHoverWidget.border#114411
editorLineNumber.foreground#226622
editorLink.activeForeground#66ff66
editorRuler.foreground#114411
editorSuggestWidget.background#021002
editorSuggestWidget.border#114411
editorSuggestWidget.foreground#44bb44
editorSuggestWidget.selectedBackground#114411
editorWarning.foreground#cca700
editorWidget.background#021002
editorWidget.border#114411
extensionButton.prominentBackground#66ff66
extensionButton.prominentForeground#010b01
extensionButton.prominentHoverBackground#66ff66
foreground#338833
gitDecoration.addedResourceForeground#0adb8b
gitDecoration.conflictingResourceForeground#44bb44
gitDecoration.deletedResourceForeground#66ff66
gitDecoration.ignoredResourceForeground#226622
gitDecoration.modifiedResourceForeground#00eaff
gitDecoration.stageDeletedResourceForeground#66ff66
gitDecoration.stageModifiedResourceForeground#cca700
gitDecoration.submoduleResourceForeground#226622
gitDecoration.untrackedResourceForeground#0adb8b
input.background#010b01
input.border#114411
input.foreground#44bb44
input.placeholderForeground#226622
list.activeSelectionBackground#226622
list.dropBackground#114411
list.focusBackground#114411
list.highlightForeground#66ff66
list.hoverBackground#226622
list.inactiveFocusBackground#114411
list.inactiveSelectionBackground#226622
panel.background#010b01
panel.border#114411
panelTitle.activeForeground#44bb44
panelTitle.inactiveForeground#339933
peekView.border#114411
peekViewEditor.background#010b01
peekViewEditor.matchHighlightBackground#114411
peekViewEditorGutter.background#010801
peekViewResult.background#010b01
peekViewResult.fileForeground#44bb44
peekViewResult.lineForeground#44bb44
peekViewResult.matchHighlightBackground#114411
peekViewResult.selectionBackground#114411
peekViewResult.selectionForeground#66ff66
peekViewTitle.background#66ff66
peekViewTitleDescription.foreground#66ff66
peekViewTitleLabel.foreground#66ff66
scrollbar.shadow#00000000
scrollbarSlider.activeBackground#226622
scrollbarSlider.background#226622
scrollbarSlider.hoverBackground#339933
selection.background#226622
sideBar.background#010b01
sideBar.border#114411
sideBar.dropBackground#114411
sideBar.foreground#44bb44
sideBarSectionHeader.background#124212
sideBarSectionHeader.foreground#44bb44
sideBarTitle.foreground#66ff66
statusBar.background#010b01
statusBar.debuggingBackground#114411
statusBar.foreground#66ff66
statusBar.noFolderBackground#010b01
tab.activeBackground#114411
tab.activeForeground#66ff66
tab.border#114411
tab.inactiveBackground#010b01
tab.inactiveForeground#66ff66
terminal.ansiBlack#010b01
terminal.ansiBlue#114411
terminal.ansiBrightBlack#226622
terminal.ansiBrightBlue#44bb44
terminal.ansiBrightCyan#44bb44
terminal.ansiBrightGreen#44bb44
terminal.ansiBrightMagenta#44bb44
terminal.ansiBrightRed#ff1767
terminal.ansiBrightWhite#66ff66
terminal.ansiBrightYellow#0adb8b
terminal.ansiCyan#0adb8b
terminal.ansiGreen#44bb44
terminal.ansiMagenta#226622
terminal.ansiRed#ff1767
terminal.ansiWhite#44bb44
terminal.ansiYellow#0adb8b
terminal.background#040600
terminal.foreground#44bb44
terminalCursor.foreground#66ff66
textBlockQuote.background#021002
textBlockQuote.border#114411
textCodeBlock.background#021002
textLink.activeForeground#66ff66
textLink.foreground#44bb44
textPreformat.foreground#66ff66
textSeparator.foreground#66ff66
walkThrough.embeddedEditorBackground#010b01
widget.shadow#00000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
emphasis	#66FF66	—
strong	#66FF66	bold
meta.diff.header	#66FF66	—
comment	#226622	—
constant.language	#66FF66	—
constant.numeric	#66FF66	—
constant.regexp	#66FF66	—
entity.name.tag	—	bold
entity.name.selector	#66FF66	—
entity.other.attribute-name	#66FF66	—
entity.other.attribute-name.class.css, entity.other.attribute-name.class.mixin.css, entity.other.attribute-name.parent-selector.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css, entity.other.attribute-name.attribute.scss, entity.other.attribute-name.scss	#66FF66	—
entity.other.attribute-name.id.css, source.css.less entity.other.attribute-name.id	#66FF66	—
invalid	#66FF66	bold
markup.underline	—	underline
markup.bold	#66FF66	bold
markup.heading	#66FF66	bold
markup.italic	#66FF66	—
markup.list	#66FF66	—
markup.list.numbered	#66FF66	—
markup.list.numbered	#66FF66	—
markup.quote	#226622	—
markup.raw	#226622	—
markup.inline.raw	#226622	—
markup.inserted	#44BB44	underline
markup.deleted	#66FF66	underline
markup.changed	—	underline
beginning.punctuation.definition.quote.markdown, beginning.punctuation.definition.list.markdown	#66FF66	—
markup.inline.raw	#226622	—
meta.selector	#66FF66	—
punctuation.definition.tag	#226622	—
meta.preprocessor	#66FF66	bold
meta.preprocessor.string	#66FF66	—
meta.preprocessor.numeric	#66FF66	—
meta.structure.dictionary.key.python	#66FF66	—
storage, storage.type, storage.modifier	#44BB44	—
string	#66FF66	—
string.comment.buffered.block.jade, string.quoted.jade, string.interpolated.jade, string.unquoted.plain.in.yaml, string.unquoted.plain.out.yaml, string.unquoted.block.yaml, string.quoted.single.yaml, string.quoted.double.xml, string.quoted.single.xml, string.unquoted.cdata.xml, string.quoted.double.html, string.quoted.single.html, string.unquoted.html, string.quoted.single.handlebars, string.quoted.double.handlebars	#66FF66	underline
string.regexp	#66FF66	—
punctuation.definition.template-expression.begin.js, punctuation.definition.template-expression.begin.ts, punctuation.definition.template-expression.end.ts, punctuation.definition.template-expression.end.js	#66FF66	underline
support.constant.property-value, support.constant.font-name, support.constant.media-type, support.constant.media, constant.other.color.rgb-value, constant.other.rgb-value, support.constant.color	—	—
support.type.vendored.property-name, support.type.property-name, variable.css, variable.scss, variable.other.less	—	—
support.type.property-name.json	#66FF66	—
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php	—	—
support.function.git-rebase	#66FF66	bold underline
constant.sha.git-rebase	#226622	—
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java	#44BB44	—
variable.language	#226622	—
keyword, keyword.control	#44BB44	bold
keyword.operator	—	—
keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.logical.python, keyword.other.unit	#44BB44	bold
entity.name.function, support.function, support.constant.handlebars	#66FF66	—
meta.return-type, support.class, support.type, entity.name.type, entity.name.class, storage.type.cs, storage.type.generic.cs, storage.type.modifier.cs, storage.type.variable.cs, storage.type.annotation.java, storage.type.generic.java, storage.type.java, storage.type.object.array.java, storage.type.primitive.array.java, storage.type.primitive.java, storage.type.token.java, storage.type.groovy, storage.type.annotation.groovy, storage.type.parameters.groovy, storage.type.generic.groovy, storage.type.object.array.groovy, storage.type.primitive.array.groovy, storage.type.primitive.groovy	#66FF66	—
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json	#66FF66	—
entity.other.inherited-class	—	bold
variable, meta.definition.variable.name, support.variable	—	—
meta.object-literal.key, meta.object-literal.key entity.name.function	—	bold
support.constant.property-value, support.constant.font-name, support.constant.media-type, support.constant.media, constant.other.color.rgb-value, constant.other.rgb-value, support.constant.color	#66FF66	—
token.info-token	#6796E6	—
token.warn-token	#CD9731	—
token.error-token	#F44747	—
token.debug-token	#B267E6	—

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}!`;
}