Minimal Themes

Name: Minimal Themes
Author: Amir Majdi

Publisher: Amir MajdiThemes in package: 2

Minimal, distraction free & focus oriented themes for your environment.

GitHub

Color themes

VS Code preview

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

Minimal Themes — Minimal

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#222222
activityBar.background#222222
activityBar.foreground#ffffffde
activityBarBadge.background#2E2E2E
activityBarBadge.foreground#ffffff99
badge.background#2E2E2E
badge.foreground#ffffffde
breadcrumb.activeSelectionForeground#ffffffde
breadcrumb.focusForeground#ffffff99
breadcrumb.foreground#ffffff61
breadcrumbPicker.background#222222
button.background#ffffff99
button.foreground#222222
button.hoverBackground#ffffffde
commandCenter.activeForeground#ffffff
commandCenter.border#222222
commandCenter.foreground#ffffff
commandCenter.inactiveForeground#ffffff99
debugExceptionWidget.background#222222
debugExceptionWidget.border#222222
debugToolBar.background#272727
debugToolBar.border#222222
diffEditor.insertedTextBackground#B5BD6861
diffEditor.removedTextBackground#e2909061
dropdown.background#272727
dropdown.border#222222
dropdown.foreground#ffffffde
dropdown.listBackground#272727
editor.background#222222
editor.findMatchBackground#353535
editor.findMatchBorder#222222
editor.findMatchHighlightBackground#222222
editor.findMatchHighlightBorder#222222
editor.findRangeHighlightBackground#222222
editor.findRangeHighlightBorder#222222
editor.foreground#ffffffde
editor.hoverHighlightBackground#27272799
editor.lineHighlightBackground#27272761
editor.selectionBackground#353535
editor.selectionHighlightBackground#272727
editorCursor.background#222222
editorCursor.foreground#ffffffde
editorError.foreground#e29090
editorGroup.border#222222
editorGroup.dropBackground#2E2E2E
editorGroupHeader.tabsBackground#222222
editorGutter.addedBackground#B5BD68
editorGutter.background#222222
editorGutter.deletedBackground#e29090
editorGutter.modifiedBackground#f7df9b
editorHoverWidget.background#222222
editorHoverWidget.border#222222
editorIndentGuide.activeBackground#666666
editorIndentGuide.background#444444
editorInfo.foreground#81A2BE
editorLineNumber.foreground#333333
editorLink.activeForeground#81A2BE
editorOverviewRuler.addedForeground#B5BD68
editorOverviewRuler.deletedForeground#e29090
editorOverviewRuler.errorForeground#e29090
editorOverviewRuler.findMatchForeground#27272761
editorOverviewRuler.infoForeground#81A2BE
editorOverviewRuler.modifiedForeground#f7df9b
editorOverviewRuler.rangeHighlightForeground#27272761
editorOverviewRuler.selectionHighlightForeground#27272761
editorOverviewRuler.warningForeground#f7df9b
editorOverviewRuler.wordHighlightForeground#27272761
editorOverviewRuler.wordHighlightStrongForeground#27272761
editorRuler.foreground#272727
editorSuggestWidget.background#222222
editorSuggestWidget.border#222222
editorSuggestWidget.foreground#ffffffde
editorSuggestWidget.highlightForeground#ffffff61
editorSuggestWidget.selectedBackground#2E2E2E
editorWarning.foreground#f7df9b
editorWidget.background#222222
editorWidget.border#222222
editorWidget.foreground#ffffffde
editorWidget.resizeBorder#222222
errorForeground#e29090
extensionButton.prominentBackground#ffffff99
extensionButton.prominentForeground#222222
extensionButton.prominentHoverBackground#ffffffde
focusBorder#222222
foreground#ffffffde
gitDecoration.deletedResourceForeground#e29090
gitDecoration.modifiedResourceForeground#f7df9b
gitDecoration.untrackedResourceForeground#a8d8af
icon.foreground#ffffffde
input.background#272727
input.border#222222
input.foreground#ffffffde
input.placeholderForeground#ffffff61
inputOption.activeBackground#2E2E2E
inputOption.activeBorder#222222
inputValidation.errorBackground#e29090
inputValidation.errorBorder#e29090
inputValidation.errorForeground#ffffffde
inputValidation.infoBackground#81A2BE
inputValidation.infoBorder#81A2BE
inputValidation.infoForeground#ffffffde
inputValidation.warningBackground#f7df9b
inputValidation.warningBorder#f7df9b
inputValidation.warningForeground#ffffffde
list.activeSelectionBackground#272727
list.activeSelectionForeground#ffffffde
list.errorForeground#e29090
list.filterMatchBackground#353535
list.filterMatchBorder#353535
list.focusBackground#272727
list.focusForeground#ffffffde
list.highlightForeground#ffffff99
list.hoverBackground#272727
list.hoverForeground#ffffffde
list.inactiveSelectionBackground#2c2c2c
list.inactiveSelectionForeground#ffffffde
list.invalidItemForeground#e29090
list.warningForeground#f7df9b
listFilterWidget.background#81A2BE
listFilterWidget.noMatchesOutline#81A2BE
listFilterWidget.outline#81A2BE
minimap.findMatchHighlight#81A2BE
minimap.selectionHighlight#ffffffde
panel.background#222222
panel.border#222222
panelTitle.activeForeground#ffffffde
panelTitle.inactiveForeground#ffffff61
scrollbar.shadow#00000061
scrollbarSlider.activeBackground#27272761
scrollbarSlider.background#272727de
scrollbarSlider.hoverBackground#27272799
selection.background#ffffffde
sideBar.background#222222
sideBar.border#222222
sideBar.foreground#ffffff99
sideBarSectionHeader.background#222222
sideBarSectionHeader.foreground#ffffffde
sideBarTitle.foreground#ffffff28
statusBar.background#272727
statusBar.border#222222
statusBar.debuggingBackground#272727
statusBar.debuggingBorder#f7df9b
statusBar.debuggingForeground#ffffffde
statusBar.foreground#ffffffde
statusBar.noFolderBackground#272727
statusBar.noFolderBorder#222222
statusBar.noFolderForeground#ffffffde
tab.activeBackground#272727
tab.activeForeground#ffffffde
tab.border#222222
tab.hoverBackground#353535
tab.inactiveBackground#222222
tab.inactiveForeground#ffffff61
terminal.ansiBlack#222222
terminal.ansiBlue#81A2BE
terminal.ansiBrightBlack#222222
terminal.ansiBrightBlue#81A2BE
terminal.ansiBrightCyan#8ABEB7
terminal.ansiBrightGreen#B5BD68
terminal.ansiBrightMagenta#B294BB
terminal.ansiBrightRed#e29090
terminal.ansiBrightWhite#ffffffde
terminal.ansiBrightYellow#f7df9b
terminal.ansiCyan#8ABEB7
terminal.ansiGreen#B5BD68
terminal.ansiMagenta#B294BB
terminal.ansiRed#e29090
terminal.ansiWhite#ffffffde
terminal.ansiYellow#f7df9b
textLink.activeForeground#81A2BE
textLink.foreground#81A2BE
titleBar.activeBackground#222222
titleBar.activeForeground#ffffff
titleBar.inactiveForeground#ffffff99
widget.shadow#00000061
window.activeBorder#222222
window.inactiveBorder#222222

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#6A6A6A	—
string, constant.other.symbol, string.template	#A7C7E7	—
constant.numeric, constant.language, variable.other.constant	#FFF1A8	—
keyword, storage, storage.type, storage.modifier	#D6B3FF	—
entity.name.type, support.type, support.class, entity.other.inherited-class	#F6A5C0	—
entity.name.function, meta.function-call, support.function, variable.function	#B7E4C7	—
variable.other.property, meta.property-name, entity.other.attribute-name, entity.name.tag	#D6B3FF	—
variable, meta.definition.variable.name, variable.parameter	#FFFFFF	—

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