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 Italic

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#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
storage, keyword, markup.italic, markup.deleted, markup.heading, storage.type.ts, storage.type.js, support.function, token.error-token, constant.language, entity.name.section, meta.preprocessor.keyword, meta.property-value.color, support.type.property-name, meta.property-value.numeric, meta.property-value.keyword, entity.other.attribute-name.html, support.constant.property-value.color, support.constant.property-value.numeric, support.constant.property-value.keyword	—	italic

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