McDLT

Name: McDLT
Author: WaitingForGuacamole

Publisher: WaitingForGuacamoleThemes in package: 2

A VS Code dark theme that's both warm and cool, like the McDLT

GitHub

Color themes

VS Code preview

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

McDLT — McDLT

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.background#183050
activityBar.border#183050
activityBar.dropBackground#18305040
activityBar.foreground#d6d6ae
activityBarBadge.background#183050
activityBarBadge.foreground#d6d6ae
badge.background#183050
badge.foreground#d6d6ae
breadcrumb.activeSelectionForeground#ffffce
breadcrumb.background#090910
breadcrumb.foreground#d6d6ae
breadcrumbPicker.background#1d2535
button.background#183050
button.foreground#d6d6ae
button.hoverBackground#151c28
checkbox.border#909079
checkbox.foreground#ffffce
debugTokenExpression.boolean#daae76
debugTokenExpression.error#f03e3e
debugTokenExpression.name#b2dffa
debugTokenExpression.number#daae76
debugTokenExpression.string#daae76
debugTokenExpression.value#daae76
diffEditor.insertedTextBackground#37b24d25
diffEditor.removedTextBackground#f03e3e25
dropdown.background#090910
dropdown.border#909079
dropdown.foreground#ffffce
dropdown.listBackground#1d2535
editor.background#040404
editor.findMatchBackground#7080b080
editor.findMatchHighlightBackground#7080b080
editor.findRangeHighlightBackground#7080b080
editor.foreground#ffffce
editor.hoverHighlightBackground#183050
editor.inactiveSelectionBackground#1866af25
editor.lineHighlightBackground#2b3b4b
editor.selectionBackground#22436e
editor.selectionForeground#d6d6ae
editor.selectionHighlightBackground#1866af80
editorBracketMatch.background#1866af25
editorBracketMatch.border#1866af50
editorCursor.foreground#d6d6ae
editorError.foreground#f03e3e
editorGroup.border#183050
editorGroup.dropBackground#183050
editorGroup.emptyBackground#1d2535
editorGroupHeader.noTabsBackground#1d2535
editorGroupHeader.tabsBackground#1d2535
editorGroupHeader.tabsBorder#183050
editorGutter.addedBackground#8ce99a
editorGutter.modifiedBackground#ffe066
editorHoverWidget.background#22436e
editorHoverWidget.border#909079
editorHoverWidget.foreground#ffffce
editorIndentGuide.background#ffffce25
editorInfo.foreground#1866af
editorLineNumber.activeForeground#d6d6ae
editorLineNumber.foreground#909079
editorLink.activeForeground#1866af
editorOverviewRuler.addedForeground#8ce99a
editorOverviewRuler.border#909079
editorOverviewRuler.deletedForeground#ffa8a8
editorOverviewRuler.errorForeground#f03e3e
editorOverviewRuler.findMatchForeground#7080b080
editorOverviewRuler.infoForeground#1866af
editorOverviewRuler.rangeHighlightForeground#7080b080
editorOverviewRuler.selectionHighlightForeground#7080b080
editorOverviewRuler.warningForeground#f59f00
editorSuggestWidget.background#1d2535
editorSuggestWidget.border#909079
editorSuggestWidget.foreground#ffffce
editorSuggestWidget.selectedBackground#22436e
editorWarning.foreground#37b24d
editorWidget.background#22436e
editorWidget.border#909079
editorWidget.foreground#ffffce
errorForeground#f03e3e
extensionButton.prominentBackground#37b24d
extensionButton.prominentForeground#ffffce
extensionButton.prominentHoverBackground#2b8a3e
focusBorder#90907975
foreground#ffffce
gitDecoration.deletedResourceForeground#ffa8a8
gitDecoration.ignoredResourceForeground#ffffce75
gitDecoration.modifiedResourceForeground#ffe066
gitDecoration.untrackedResourceForeground#8ce99a
input.background#1d2535
input.border#909079
input.foreground#d6d6ae
input.placeholderForeground#ffffce50
inputOption.activeBorder#909079
inputValidation.errorBackground#22436e
inputValidation.errorBorder#909079
inputValidation.infoBackground#22436e
inputValidation.infoBorder#909079
inputValidation.warningBackground#22436e
inputValidation.warningBorder#909079
list.activeSelectionBackground#22436e
list.activeSelectionForeground#ffffce
list.dropBackground#183050
list.focusForeground#d6d6ae
list.highlightForeground#ffffce
list.hoverBackground#22436e
list.hoverForeground#ffffce
list.inactiveSelectionBackground#22436e
menu.background#1d2535
menu.foreground#d6d6ae
menu.selectionBackground#22436e
menu.selectionForeground#ffffce
menubar.selectionBackground#22436e
menubar.selectionForeground#ffffce
panel.background#090910
panel.border#183050
panelTitle.activeBorder#909079
panelTitle.activeForeground#d6d6ae
panelTitle.inactiveForeground#909079
peekView.border#909079
peekViewEditor.background#183050
peekViewEditor.matchHighlightBackground#22436e
peekViewEditor.matchHighlightBorder#909079
peekViewEditorGutter.background#090910
peekViewResult.background#183050
peekViewResult.fileForeground#d6d6ae
peekViewResult.lineForeground#d6d6ae
peekViewResult.matchHighlightBackground#22436e
peekViewTitle.background#183050
peekViewTitleDescription.foreground#ffffce
peekViewTitleLabel.foreground#d6d6ae
pickerGroup.border#909079
pickerGroup.foreground#a2b0cd
progressBar.background#1866af
scrollbar.shadow#000000
scrollbarSlider.activeBackground#c0d0f0d0
scrollbarSlider.background#c0d0f0d0
scrollbarSlider.hoverBackground#c0d0f0d0
selection.background#1866af50
settings.textInputBorder#909079
settings.textInputForeground#ffffce
sideBar.background#090910
sideBar.border#183050
sideBar.foreground#d6d6ae
sideBarSectionHeader.background#1d2535
sideBarSectionHeader.foreground#d6d6ae
sideBarTitle.foreground#ffffce
statusBar.background#183050
statusBar.debuggingBackground#22436e
statusBar.debuggingForeground#ffffce
statusBar.foreground#d6d6ae
statusBar.noFolderBackground#22436e
statusBar.noFolderForeground#ffffce
statusBarItem.hoverBackground#ffffce25
tab.activeBackground#090910
tab.activeForeground#ffffce
tab.border#48483c
tab.inactiveBackground#183050
tab.inactiveForeground#909079
tab.unfocusedActiveForeground#909079
tab.unfocusedInactiveForeground#909079
terminal.ansiBlue#1862ab
terminal.ansiBrightBlue#1866af
terminal.ansiBrightCyan#1098ad
terminal.ansiBrightGreen#37b24d
terminal.ansiBrightMagenta#ae3ec9
terminal.ansiBrightRed#f03e3e
terminal.ansiBrightYellow#ffe066
terminal.ansiCyan#0b7285
terminal.ansiGreen#2b8a3e
terminal.ansiMagenta#862e9c
terminal.ansiRed#c92a2a
terminal.ansiYellow#ffe066
terminal.foreground#a2b0cd
titleBar.activeBackground#183050
titleBar.activeForeground#d6d6ae
titleBar.inactiveBackground#183050
titleBar.inactiveForeground#909079
welcomePage.buttonBackground#183050
welcomePage.buttonHoverBackground#151c28
widget.shadow#090910

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
—	#bdae9d	—
meta.scriptblock.powershell	#bdae9d	—
comment	#d6d6aeb0	italic
constant	#daae76	—
entity	#72c3fc
function, support.function.powershell, entity.name.function.powershell	#43fafa
keyword	#b2dffa
storage	#b2dffa
string, string.quoted.double.powershell	#daae76
Number, constant.numeric.integer.powershell	#daae76
support	#ffffce
variable, support.variable.automatic.powershell	#ffffce	—
invalid.deprecated	#f03e3e	italic underline
invalid.illegal	#a0a0a0	—
entity.other.attribute-name	#d6d6ae	—
entity.name.tag, punctuation.definition.tag.begin, punctuation.definition.tag.end	#37A8ED	—
meta.property-group support.constant.property-value.css, meta.property-value support.constant.property-value.css	#daae76	—

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