Alley Cat

Name: Alley Cat
Author: pixel rain

Publisher: pixel rainThemes in package: 1

A simple color theme with an attempt to be both minimal and easy on eyes. It was inspired by Darcula Dracula, Foxy and SynthWave '84 themes.

Open in VS Code GitHub

VS Code preview

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

Alley Cat — Alley Cat

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.activeBorder#cdd1d1
activityBar.background#3b3e40
activityBar.border#282a36
activityBar.foreground#ddebeb
activityBar.inactiveForeground#afb1b3
activityBarBadge.background#2c2e2f
breadcrumb.background#3b3e40
breadcrumb.foreground#afb1b3
contrastBorder#3b3e40
editor.background#282a36
editor.findMatchBackground#2651a1
editor.findMatchHighlightBackground#00000000
editor.findMatchHighlightBorder#afb1b3
editor.foldBackground#00000000
editor.foreground#f8f8f2
editor.lineHighlightBackground#424450
editor.selectionBackground#2651a1
editor.selectionHighlightBackground#00000000
editor.selectionHighlightBorder#afb1b3
editor.wordHighlightBackground#00000000
editor.wordHighlightStrongBackground#00000000
editorBracketMatch.background#2f65ca
editorBracketMatch.border#afb1b3
editorGroupHeader.tabsBackground#3b3e40
editorWarning.foreground#50fa7b
editorWhitespace.foreground#797c81
errorForeground#ff5555
menu.foreground#ddebeb
sideBar.background#3b3e40
sideBar.border#282a36
sideBarSectionHeader.background#3b3e40
statusBar.background#3b3e40
statusBar.border#323232
statusBar.debuggingBackground#3b3e40
statusBar.foreground#ddebeb
statusBar.noFolderBackground#3b3e40
statusBarItem.remoteBackground#3b3e40
tab.activeBackground#4e5254
tab.activeBorder#afb1b3
tab.activeForeground#c1d2d2
tab.border#3b3e40
tab.inactiveBackground#3b3e40
tab.inactiveForeground#afb1b3

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#999c9e	—
string	#50fa7b	—
invalid	#ff5555	—
support.class, entity.other.attribute-name.class, entity.name.function, entity.name.method, entity.name.type, meta.class-method entity.name.function, variable.function.constructor, meta.function-call, variable.function, support.function, keyword.other.special-method, entity.other.attribute-name.id, entity.other.inherited-class	#07f2ee	—
variable, string constant.other.placeholder, punctuation, punctuation.definition.tag, punctuation.section.embedded, constant.other.color, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end, source.sass keyword.control, text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown, meta.block variable.other, support.type, entity.name.tag.reference, meta.tag	#f8f8f2	—
support.class.component, storage.modifier, storage.type, entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter, entity.name.module, variable.import.parameter, variable.other.class, markdown.heading, markup.heading \| markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown, meta.object-literal.key, 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, keyword	#fede5d	—
keyword.control, constant.other.color, punctuation.separator.inheritance.php, punctuation.definition.tag.html, keyword.other.template, keyword.other.substitution, support.other.variable, string.other.link, invalid, invalid.illegal, markup.deleted, source constant.other.object.key string.unquoted.label, constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other, markup.underline, 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, text.html.markdown markup.inline.raw.markdown, text.html.markdown, punctuation.definition.list_item.markdown, variable.language.this, meta.property-value, markup.italic	#ff79c6	—
entity.other.attribute-name, variable.language, constant.other.symbol, constant.other.key, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key string.unquoted.label, entity.name, support.type, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types, text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name, constant.other.reference.link.markdown, markup.inserted, markup.changed, string.regexp, constant.character.escape, tag.decorator entity.name.tag, tag.decorator punctuation.definition.tag, support.variable.property, source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json, source.json meta.structure.dictionary.json support.type.property-name.json, variable.other.property	#d0dddd	—

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