GitHub Theme Minimal

Name: GitHub Theme Minimal
Author: Adrian Avram

Publisher: Adrian AvramThemes in package: 6

GitHub theme for VS Code, but modified for simplicity

Open in VS Code GitHub

Color themes

VS Code preview

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

GitHub Theme Minimal — GitHub Darker Default

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

Problems1

Output

Debug Console

Terminal

Ports

~/my-project $ pnpm dev
▲ Next.js ready on http://localhost:3000
✓ compiled client and server successfully in 412ms
wait - compiling /theme/vscode...
~/my-project

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#f78166
activityBar.background#0d1117
activityBar.border#30363d
activityBar.foreground#c9d1d9
activityBar.inactiveForeground#8b949e
activityBarBadge.background#1f6feb
activityBarBadge.foreground#f0f6fc
badge.background#0d419d
badge.foreground#79c0ff
breadcrumb.activeSelectionForeground#8b949e
breadcrumb.focusForeground#c9d1d9
breadcrumb.foreground#8b949e
breadcrumbPicker.background#1c2128
button.background#238636
button.foreground#ffffff
button.hoverBackground#2ea043
button.secondaryBackground#292e34
button.secondaryForeground#c9d1d9
button.secondaryHoverBackground#30363d
checkbox.background#161b22
checkbox.border#30363d
debugToolBar.background#1c2128
descriptionForeground#8b949e
diffEditor.insertedTextBackground#2ea04333
diffEditor.removedTextBackground#da363333
dropdown.background#1c2128
dropdown.border#30363d
dropdown.foreground#c9d1d9
dropdown.listBackground#1c2128
editor.background#0d1117
editor.findMatchBackground#ffd33d44
editor.findMatchHighlightBackground#ffd33d22
editor.focusedStackFrameHighlightBackground#3FB95025
editor.foldBackground#6e76811a
editor.foreground#c9d1d9
editor.inactiveSelectionBackground#3392FF22
editor.lineHighlightBackground#161b22
editor.linkedEditingBackground#3392FF22
editor.selectionBackground#3392FF44
editor.selectionHighlightBackground#17E5E633
editor.selectionHighlightBorder#17E5E600
editor.stackFrameHighlightBackground#D2992225
editor.wordHighlightBackground#17E5E600
editor.wordHighlightBorder#17E5E699
editor.wordHighlightStrongBackground#17E5E600
editor.wordHighlightStrongBorder#17E5E666
editorBracketMatch.background#17E5E650
editorBracketMatch.border#17E5E600
editorCursor.foreground#79c0ff
editorGroup.border#30363d
editorGroupHeader.tabsBackground#0D1117
editorGroupHeader.tabsBorder#30363d
editorGutter.addedBackground#196c2e
editorGutter.deletedBackground#b62324
editorGutter.modifiedBackground#9e6a03
editorIndentGuide.activeBackground#30363d
editorIndentGuide.background#21262d
editorLineNumber.activeForeground#c9d1d9
editorLineNumber.foreground#8b949e
editorOverviewRuler.border#010409
editorWhitespace.foreground#484f58
editorWidget.background#1c2128
errorForeground#f85149
focusBorder#388bfd
foreground#c9d1d9
gitDecoration.addedResourceForeground#56d364
gitDecoration.conflictingResourceForeground#e3b341
gitDecoration.deletedResourceForeground#f85149
gitDecoration.ignoredResourceForeground#484f58
gitDecoration.modifiedResourceForeground#e3b341
gitDecoration.submoduleResourceForeground#8b949e
gitDecoration.untrackedResourceForeground#56d364
input.background#0d1117
input.border#21262d
input.foreground#c9d1d9
input.placeholderForeground#484f58
list.activeSelectionBackground#21262d
list.activeSelectionForeground#c9d1d9
list.focusBackground#21262d
list.focusForeground#f0f6fc
list.highlightForeground#388bfd
list.hoverBackground#161b22
list.hoverForeground#c9d1d9
list.inactiveFocusBackground#161b22
list.inactiveSelectionBackground#161b22
list.inactiveSelectionForeground#c9d1d9
notificationCenterHeader.background#0d1117
notificationCenterHeader.foreground#6e7681
notifications.background#161b22
notifications.border#30363d
notifications.foreground#8b949e
notificationsErrorIcon.foreground#f85149
notificationsInfoIcon.foreground#58a6ff
notificationsWarningIcon.foreground#f0883e
panel.background#0D1117
panel.border#30363d
panelInput.border#30363d
panelTitle.activeBorder#f78166
panelTitle.activeForeground#c9d1d9
panelTitle.inactiveForeground#8b949e
peekViewEditor.background#0d111788
peekViewEditor.matchHighlightBackground#ffd33d33
peekViewResult.background#0d1117
peekViewResult.matchHighlightBackground#ffd33d33
pickerGroup.border#21262d
pickerGroup.foreground#8b949e
progressBar.background#1f6feb
quickInput.background#0d1117
quickInput.foreground#c9d1d9
scrollbar.shadow#0008
scrollbarSlider.activeBackground#484F5888
scrollbarSlider.background#484F5833
scrollbarSlider.hoverBackground#484F5844
settings.headerForeground#8b949e
settings.modifiedItemIndicator#9e6a03
sideBar.background#0D1117
sideBar.border#30363d
sideBar.foreground#c9d1d9
sideBarSectionHeader.background#0D1117
sideBarSectionHeader.border#30363d
sideBarSectionHeader.foreground#c9d1d9
sideBarTitle.foreground#c9d1d9
statusBar.background#0d1117
statusBar.border#30363d
statusBar.debuggingBackground#da3633
statusBar.debuggingForeground#f0f6fc
statusBar.foreground#8b949e
statusBar.noFolderBackground#0d1117
statusBarItem.prominentBackground#161b22
tab.activeBackground#0d1117
tab.activeBorder#0d1117
tab.activeBorderTop#f78166
tab.activeForeground#c9d1d9
tab.border#30363d
tab.hoverBackground#0d1117
tab.inactiveBackground#0D1117
tab.inactiveForeground#8b949e
tab.unfocusedActiveBorder#0d1117
tab.unfocusedActiveBorderTop#30363d
tab.unfocusedHoverBackground#161b22
terminal.ansiBlack#484f58
terminal.ansiBlue#58a6ff
terminal.ansiBrightBlack#6e7681
terminal.ansiBrightBlue#79c0ff
terminal.ansiBrightCyan#56d4dd
terminal.ansiBrightGreen#56d364
terminal.ansiBrightMagenta#d2a8ff
terminal.ansiBrightRed#ffa198
terminal.ansiBrightWhite#f0f6fc
terminal.ansiBrightYellow#e3b341
terminal.ansiCyan#39c5cf
terminal.ansiGreen#3fb950
terminal.ansiMagenta#bc8cff
terminal.ansiRed#ff7b72
terminal.ansiWhite#b1bac4
terminal.ansiYellow#d29922
terminal.foreground#8b949e
textBlockQuote.background#0D1117
textBlockQuote.border#3b434b
textCodeBlock.background#f0f6fc26
textLink.activeForeground#58a6ff
textLink.foreground#58a6ff
textPreformat.foreground#8b949e
textSeparator.foreground#21262d
titleBar.activeBackground#0d1117
titleBar.activeForeground#8b949e
titleBar.border#30363d
titleBar.inactiveBackground#0D1117
titleBar.inactiveForeground#8b949e
tree.indentGuidesStroke#21262d
welcomePage.buttonBackground#21262d
welcomePage.buttonHoverBackground#30363d

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment, string.comment	#8b949e	—
constant, entity.name.constant, variable.other.constant, variable.language, entity	#79c0ff	—
entity.name, meta.export.default, meta.definition.variable	#ffa657	—
variable.parameter.function, meta.jsx.children, meta.block, meta.tag.attributes, entity.name.constant, meta.object.member, meta.embedded.expression	#c9d1d9	—
entity.name.function	#d2a8ff	—
entity.name.tag, support.class.component	#7ee787	—
keyword	#ff7b72	—
storage, storage.type	#ff7b72	—
storage.modifier.package, storage.modifier.import, storage.type.java	#c9d1d9	—
string, punctuation.definition.string, string punctuation.section.embedded source	#a5d6ff	—
support	#79c0ff	—
meta.property-name	#79c0ff	—
variable	#ffa657	—
variable.other	#c9d1d9	—
invalid.broken	#ffa198	italic
invalid.deprecated	#ffa198	italic
invalid.illegal	#ffa198	italic
invalid.unimplemented	#ffa198	italic
carriage-return	#0d1117	italic underline
message.error	#ffa198	—
string source	#c9d1d9	—
string variable	#79c0ff	—
source.regexp, string.regexp	#a5d6ff	—
string.regexp.character-class, string.regexp constant.character.escape, string.regexp source.ruby.embedded, string.regexp string.regexp.arbitrary-repitition	#a5d6ff	—
string.regexp constant.character.escape	#7ee787	bold
support.constant	#79c0ff	—
support.variable	#79c0ff	—
meta.module-reference	#79c0ff	—
punctuation.definition.list.begin.markdown	#ffa657	—
markup.heading, markup.heading entity.name	#79c0ff	bold
markup.quote	#7ee787	—
markup.italic	#c9d1d9	italic
markup.bold	#c9d1d9	bold
markup.raw	#79c0ff	—
markup.deleted, meta.diff.header.from-file, punctuation.definition.deleted	#ffa198	—
markup.inserted, meta.diff.header.to-file, punctuation.definition.inserted	#7ee787	—
markup.changed, punctuation.definition.changed	#ffa657	—
markup.ignored, markup.untracked	#161b22	—
meta.diff.range	#d2a8ff	bold
meta.diff.header	#79c0ff	—
meta.separator	#79c0ff	bold
meta.output	#79c0ff	—
brackethighlighter.tag, brackethighlighter.curly, brackethighlighter.round, brackethighlighter.square, brackethighlighter.angle, brackethighlighter.quote	#8b949e	—
brackethighlighter.unmatched	#ffa198	—
constant.other.reference.link, string.other.link	#a5d6ff	underline

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