Boring Theme

Name: Boring Theme
Author: Markus Eliasson

Publisher: Markus EliassonThemes in package: 1

A light, mostly, black and white team with strong focus on readability and less distractions

Open in VS Code GitHub

VS Code preview

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

Boring Theme — Boring

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.

editor.lineHighlightBackground#E6E6E6
editorCursor.foreground#4F1091
editorError.foreground#EA2446
editorLineNumber.activeForeground#1F1F1E
editorLineNumber.foreground#1F1F1E
editorWarning.foreground#FE7803
editorWhitespace.foreground#CECECF

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
constant.numeric, constant.character.numeric	#1F1F1E
text	#1F1F1E
comment	#BD689B	italic
string	#4F1091
markup.heading.markdown	#1F1F1E	bold
markup.italic.markdown	#1F1F1E	italic
markup.bold.markdown	#1F1F1E	bold
markup.inline.raw.string.markdown	#BD689B
entity.name.class, meta.class entity.name.type.class, entity.other.inherited-class, entity.name.function, entity.name.type, meta.function-call entity.name.function, meta.method.declaration storage.type, support.function, support.class, support.type.primitive	#1F1F1E	bold
entity.name.tag.html, entity.other.attribute-name.html, entity.name.tag.pug, entity.other.attribute-name.tag.pug	#1F1F1E	bold
string.quoted.double.html, string.quoted.pug	#4F1091
support.type.property-name.json	#1F1F1E	bold
string.quoted.double.json punctuation.definition.string.json, meta.structure.dictionary.value.json string.quoted.double	#4F1091
meta.structure.dictionary.json meta.structure.dictionary.value constant.language, constant.numeric.json	#1F1F1E
entity.name.tag.css, entity.name.tag.less, entity.other.attribute-name.id, entity.other.attribute-name.id.less, entity.other.attribute-name.class, entity.other.attribute-name.class.less	#1F1F1E	bold
meta.constructor.argument.css, meta.constructor.argument.less, meta.constructor.argument.sass, keyword.other.unit.px.css, entity.other.attribute-name.class.mixin.css, variable.other.less	#1F1F1E

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