Retro Poster Theme

Name: Retro Poster Theme
Author: csyasin

Publisher: csyasinThemes in package: 2

Retro Poster theme for VS Code

Open in VS Code

Color themes

VS Code preview

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

Retro Poster Theme — Retro Poster

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
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}!`;
}

Problems1

Output

Debug Console

Terminal

Ports

~/my-project $ pnpm dev
▲ Next.js ready on http://localhost:3000
✓ compiled client and server successfully in 412ms
wait - compiling /theme/vscode...
~/my-project $

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#22201d
activityBar.dropBackground#ffffff20
activityBar.foreground#598E79
activityBar.inactiveForeground#5f5f5f
badge.background#E07D2B
breadcrumbPicker.background#22201d
editor.background#22201d
editor.foreground#B09F89
editor.inactiveSelectionBackground#3a3d41
editor.lineHighlightBackground#ffffff20
editor.selectionBackground#ffffff20
editor.selectionHighlightBackground#ffffff20
editor.wordHighlightBackground#ffffff20
editor.wordHighlightStrongBackground#ffffff20
editorGroup.border#111111
editorGroupHeader.tabsBackground#22201d
editorGroupHeader.tabsBorder#111111
editorHoverWidget.background#22201d
editorLineNumber.activeForeground#B09F89
editorLineNumber.foreground#5f5f5f
editorOverviewRuler.border#00000000
editorSuggestWidget.background#22201d
editorWidget.background#22201d
focusBorder#598E7950
foreground#d8d2c7
list.activeSelectionBackground#393939
list.focusBackground#393939
list.inactiveSelectionBackground#393939
notifications.background#22201d
notifications.border#598E79
panel.border#598E79
peekViewResult.background#22201d
sideBar.background#22201d
sideBar.border#111111
sideBarSectionHeader.background#22201d
statusBar.background#22201d
statusBar.debuggingBackground#222222
statusBar.foreground#5f5f5f
statusBar.noFolderBackground#222222
tab.activeBorder#598E79
tab.activeBorderTop#598E79
tab.activeForeground#ffffff
tab.border#111111
tab.inactiveBackground#22201d
tab.inactiveForeground#5f5f5f

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
brace, paren, tag.xml, bracket, invalid, tag.html, delimiter, meta.diff, meta.brace, entity.name, delimiter.tag, string.link.md, constant.other, punctuation.tag, meta.preprocessor, constant.character, invalid.deprecated, meta.property-value, entity.name.type.md, entity.name.function, beginning.punctuation, support.function.json, entity.name.tag.table, meta.property-name.css, string.quoted.double.json, support.type.property-name, entity.other.attribute-name, entity.other.inherited-class, meta.structure.dictionary.json, punctuation.separator.key-value, entity.other.attribute-name.html, punctuation.definition.heading.md, punctuation.definition.metadata.md	#B09F89	—
string, meta.preprocessor, keyword.other.unit, meta.property-value, string.other.link.title, string.quoted.double.json, string.other.link.description, meta.structure.dictionary.json, support.constant.property-value, meta.structure.dictionary.value.json, support.constant.color.w3c-standard-color-name	#598E79	—
meta.ptr, markup.raw, markup.link, support.type, meta.pointer, meta.address, storage.type, support.class, markup.fenced, meta.selector, meta.array.cxx, entity.name.tag, support.constant, meta.link.inline, token.warn-token, keyword.operator, meta.image.inline, constant.language, markup.inline.raw, entity.name.tag.css, variable.language.this, variable.other.makefile, meta.template.expression, meta.property-value.color, variable.language.makefile, meta.property-value.numeric, entity.other.attribute-name, support.constant.property-value.color, support.constant.property-value.numeric	#E07D2B	—
storage, keyword, markup.deleted, markup.heading, storage.type.ts, storage.type.js, token.error-token, constant.language, entity.name.section, meta.preprocessor.keyword, meta.property-value.color, meta.property-value.numeric, meta.property-value.keyword, support.constant.property-value.color, support.constant.property-value.numeric, support.constant.property-value.keyword	#C54429	—
comment, constant.language.null, constant.language.undefined	#5f5f5f	—
constant.numeric, constant.language.nan, constant.language.boolean, constant.language.infinity	#547F96	—
markup.italic	—	italic