Mirror

Name: Mirror
Author: Aubrey Kuseli

Publisher: Aubrey KuseliThemes in package: 2

A sleek, modern VSCode theme with light/dark modes. Features vibrant purple accents, optimized syntax highlighting, and reduced eye strain for long coding sessions.

GitHub

Color themes

VS Code preview

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

Mirror — Mirror Light

fetchUser.ts

index.ts

README.md

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Light+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.background#f8fafc
activityBar.border#e2e8f0
activityBar.foreground#334155
activityBarBadge.background#7c3aed
activityBarBadge.foreground#ffffff
button.background#7c3aed
button.foreground#ffffff
editor.background#ffffff
editor.findMatchBackground#7c3aed40
editor.findMatchHighlightBackground#7c3aed30
editor.foreground#1e293b
editor.lineHighlightBackground#f1f5f9
editor.selectionBackground#7c3aed20
editor.selectionHighlightBackground#7c3aed15
editorBracketMatch.background#7c3aed20
editorBracketMatch.border#7c3aed
editorCursor.foreground#7c3aed
editorGutter.addedBackground#34d399
editorGutter.background#ffffff
editorGutter.deletedBackground#ef4444
editorGutter.modifiedBackground#7c3aed
editorLineNumber.activeForeground#7c3aed
editorLineNumber.foreground#94a3b8
input.background#ffffff
input.border#e2e8f0
input.foreground#1e293b
sideBar.background#f1f5f9
sideBar.border#e2e8f0
sideBar.foreground#334155
statusBar.background#e2e8f0
statusBar.border#e2e8f0
statusBar.foreground#1e293b
tab.activeBackground#ffffff
tab.activeBorder#ffffff
tab.activeBorderTop#7c3aed
tab.activeForeground#1e293b
tab.inactiveBackground#f1f5f9
tab.inactiveForeground#94a3b8
terminal.background#ffffff
terminal.foreground#1e293b
terminalCursor.foreground#7c3aed

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#94a3b8	italic
string, string.quoted	#a78bfa	—
keyword, keyword.control, keyword.operator	#7c3aed	bold
entity.name.function, support.function	#22d3ee	—
variable, variable.parameter	#1e293b	—
constant.numeric	#f59e0b	—
entity.name.type, support.type	#60a5fa	—

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