Ben's Lab

Publisher: Ben's LabThemes in package: 1

Ben's personal playground for coding style

Open in VS Code

VS Code preview

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

Loading...

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.background#2F0606
activityBar.foreground#FFD166
editor.background#3A0D0D
editor.foreground#F5EDE2
editor.lineHighlightBackground#4A1010AA
editor.selectionBackground#6E1E1E88
editor.selectionHighlightBackground#55111155
editorBracketMatch.background#FFD16633
editorBracketMatch.border#FFD166
editorCursor.foreground#FFD166
editorGutter.background#3A0D0D
sideBar.background#2B0505
sideBar.foreground#F5EDE2
statusBar.background#1F0303
statusBar.foreground#FFD166
tab.activeBackground#3A0D0D
tab.activeForeground#FFD166
tab.inactiveBackground#2B0505
tab.inactiveForeground#F5EDE2

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment	#B07777	italic
keyword	#FF6F61	bold
string	#FF9FA3	—
variable	#F5EDE2	—
function	#FFB380	bold
constant	#FFD166	—
type	#FF8C61	italic
storage	#FF6F61	—
operator	#FFB380	—
number	#FFDD99	—
support.function	#9C88FF	—
entity.name.class	#61FFCB	—
entity.name.type	#FF61C3	—

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

Ben's Lab by Ben's Lab - VS Code Theme