Developer's Dojo

Name: Developer's Dojo
Author: Andrew Jay Chambers

Publisher: Andrew Jay ChambersThemes in package: 1

Open in VS Code GitHub

VS Code preview

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

Developer's Dojo — Developer's Dojo

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.activeBackground#00000000
activityBar.activeBorder#14EE80
activityBar.background#080E1F
activityBar.border#102C5C
activityBar.foreground#00E0FF
activityBar.inactiveForeground#2860AA
activityBarBadge.background#001127
activityBarBadge.foreground#14EE80
badge.background#001127
badge.foreground#14EE80
breadcrumb.activeSelectionForeground#14EE80
breadcrumb.background#0A2855
breadcrumb.focusForeground#14EE80
breadcrumb.foreground#00E0FFc4
breadcrumbPicker.background#030920
button.background#088010
button.border#205AA0
checkbox.background#080100
checkbox.border#00E0FF64
checkbox.foreground#00E0FF
contrastActiveBorder#00000000
contrastBorder#00E0FF4c
debugConsole.warningForeground#ffff00
debugIcon.breakpointCurrentStackframeForeground#8842ff
debugIcon.breakpointDisabledForeground#848484
debugIcon.breakpointForeground#FF7400
debugIcon.breakpointStackframeForeground#dddddd
debugIcon.breakpointUnverifiedForeground#848484
debugIcon.continueForeground#14EE80
debugIcon.disconnectForeground#ff1020
debugIcon.pauseForeground#FF7400
debugIcon.restartForeground#4090FF
debugIcon.startForeground#14EE80
debugIcon.stepBackForeground#28CCFF
debugIcon.stepIntoForeground#28CCFF
debugIcon.stepOutForeground#28CCFF
debugIcon.stepOverForeground#28CCFF
debugIcon.stopForeground#ff1020
debugToolBar.background#100830
debugToolBar.border#dddddd
dropdown.background#080100
dropdown.border#4470cc
dropdown.foreground#00E0FF
editor.background#0D1528
editor.findMatchBackground#002048
editor.findMatchBorder#2bb444
editor.findMatchHighlightBackground#002048
editor.findMatchHighlightBorder#004072
editor.findRangeHighlightBackground#3a3d4166
editor.foldBackground#3060ff1b
editor.foreground#c4d0dd
editor.hoverHighlightBackground#004444
editor.inactiveSelectionBackground#3a3d41
editor.lineHighlightBackground#001c40
editor.lineHighlightBorder#000000
editor.selectionBackground#005474
editor.selectionForeground#dddddd
editor.selectionHighlightBackground#040a4d
editor.selectionHighlightBorder#2bb444
editor.snippetFinalTabstopHighlightBackground#64e540
editor.snippetFinalTabstopHighlightBorder#64e540
editor.snippetTabstopHighlightBackground#00000088
editor.snippetTabstopHighlightBorder#64e540
editor.wordHighlightBorder#64e540
editorBracketHighlight.foreground1#9090FF
editorBracketHighlight.foreground2#08E0A0
editorBracketHighlight.foreground3#0CCCFF
editorBracketHighlight.foreground4#08E0A0
editorBracketHighlight.foreground5#9090FF
editorBracketHighlight.foreground6#0CCCFF
editorBracketHighlight.unexpectedBracket.foreground#ff4040
editorCodeLens.foreground#cccccc
editorCursor.background#ffffff
editorCursor.foreground#14EE80
editorError.background#ff000080
editorError.border#ff1C2C
editorError.foreground#ff1C2C
editorGroup.border#102C5C
editorGroupHeader.border#000
editorGroupHeader.tabsBackground#080E1F
editorGroupHeader.tabsBorder#203C7A
editorGutter.addedBackground#10d8b8
editorGutter.commentRangeForeground#2c6e9c
editorGutter.deletedBackground#e02090
editorGutter.foldingControlForeground#14EE80
editorGutter.modifiedBackground#70E020
editorHoverWidget.background#061730
editorHoverWidget.border#1480d4
editorHoverWidget.foreground#dddddd
editorHoverWidget.highlightForeground#38afe4
editorHoverWidget.statusBarBackground#021c44
editorIndentGuide.activeBackground#2bb444
editorIndentGuide.background#030c20
editorInfo.foreground#14EE80
editorInlayHint.background#00000040
editorInlayHint.foreground#14EE80
editorInlayHint.parameterBackground#00000040
editorInlayHint.parameterForeground#14EE80
editorInlayHint.typeBackground#00000040
editorInlayHint.typeForeground#14EE80
editorLightBulb.foreground#14EE80
editorLightBulbAutoFix.foreground#14EE80
editorLineNumber.activeForeground#C2F0FF
editorLineNumber.foreground#186CCCEE
editorMarkerNavigationError.background#ff1C2C
editorMarkerNavigationError.headerBackground#ff1C2C
editorMarkerNavigationWarning.background#ffff00
editorMarkerNavigationWarning.headerBackground#00000060
editorOverviewRuler.addedForeground#10d8b8
editorOverviewRuler.background#010101
editorOverviewRuler.border#010101
editorOverviewRuler.bracketMatchForeground#a0a0a0
editorOverviewRuler.commonContentForeground#103864
editorOverviewRuler.currentContentForeground#40c8ae80
editorOverviewRuler.deletedForeground#e02090
editorOverviewRuler.errorForeground#ff1C2Ccc
editorOverviewRuler.findMatchForeground#d186167e
editorOverviewRuler.incomingContentForeground#40a6ff80
editorOverviewRuler.infoForeground#14EE80
editorOverviewRuler.modifiedForeground#70E020
editorOverviewRuler.rangeHighlightForeground#007acc99
editorOverviewRuler.selectionHighlightForeground#dddddd
editorOverviewRuler.warningForeground#ffff00
editorOverviewRuler.wordHighlightForeground#a0a0a0cc
editorOverviewRuler.wordHighlightStrongForeground#c0a0c0cc
editorRuler.foreground#2080C41A
editorSuggestWidget.background#061730
editorSuggestWidget.border#109cec
editorSuggestWidget.focusHighlightForeground#70f824de
editorSuggestWidget.foreground#d0d0d0
editorSuggestWidget.highlightForeground#0ddfff
editorSuggestWidget.selectedBackground#0f8fec4c
editorSuggestWidget.selectedForeground#08ffe8
editorSuggestWidget.selectedIconForeground#12f2ff
editorWarning.background#00000060
editorWarning.foreground#ffff00
editorWhitespace.foreground#ff680030
editorWidget.background#061730
editorWidget.border#205AA0
editorWidget.foreground#c0c0c0
editorWidget.resizeBorder#1a4074
errorForeground#ff1C2C
extensionBadge.remoteBackground#b2b5bc
extensionBadge.remoteForeground#14EE80
extensionButton.prominentBackground#4470cc
extensionButton.prominentForeground#dddddd
extensionIcon.starForeground#FFC400
focusBorder#0050aa
foreground#dcdaee
gitDecoration.addedResourceForeground#F59030
gitDecoration.conflictingResourceForeground#ff1020
gitDecoration.deletedResourceForeground#e02090
gitDecoration.ignoredResourceForeground#2c6e9c
gitDecoration.modifiedResourceForeground#70E020
gitDecoration.renamedResourceForeground#10d8b8
gitDecoration.stageDeletedResourceForeground#ff2030
gitDecoration.stageModifiedResourceForeground#F59030
gitDecoration.untrackedResourceForeground#10d8b8
icon.foreground#FF7400
input.background#0E0A08
input.border#b0e0ff23
input.foreground#ECEEF4
input.placeholderForeground#2064cc
inputOption.activeBackground#00E0FF
inputOption.activeBorder#14EE80
inputOption.activeForeground#000000
inputValidation.errorBackground#ff1C2C4c
inputValidation.errorBorder#ff1C2C
inputValidation.warningBackground#00000060
inputValidation.warningBorder#b89500
issues.open#22863a
keybindingLabel.background#103864
keybindingLabel.border#103864
keybindingTable.headerBackground#103864
keybindingTable.rowsBackground#103864
list.activeSelectionBackground#003090
list.activeSelectionForeground#14EE80
list.activeSelectionIconForeground#14EE80
list.deemphasizedForeground#103864
list.dropBackground#383b3d
list.errorForeground#ff1C2C
list.filterMatchBorder#14EE80
list.focusBackground#242090
list.focusForeground#14EE80
list.focusHighlightForeground#38afe4
list.focusOutline#20AAA0
list.highlightForeground#38afe4
list.hoverBackground#003090
list.hoverForeground#14EE80
list.inactiveFocusBackground#80ffcc2d
list.inactiveFocusOutline#103864
list.inactiveSelectionBackground#002e64
list.inactiveSelectionForeground#cccccc
list.inactiveSelectionIconForeground#14EE80
list.invalidItemForeground#ff1C2C
list.warningForeground#ffff00
listFilterWidget.background#180008
listFilterWidget.noMatchesOutline#ff1C2C
listFilterWidget.outline#2bb444
menu.background#061730
menu.border#205AA0
menu.foreground#dddddd
menu.selectionBackground#0A5064
menu.selectionForeground#dddddd
menu.separatorBackground#b2b5bc
menubar.selectionBackground#ffffff1a
menubar.selectionForeground#b4b8c2
merge.commonContentBackground#103864
merge.commonHeaderBackground#103864
minimap.errorHighlight#ff1C2Ccc
minimap.selectionOccurrenceHighlight#103864
minimap.warningHighlight#ffff00
minimapGutter.addedBackground#10d8b8
minimapGutter.deletedBackground#e02090
minimapGutter.modifiedBackground#70E020
notebook.cellBorderColor#205AA0
notebook.cellStatusBarItemHoverBackground#103864
notebook.cellToolbarSeparator#103864
notebook.inactiveFocusedCellBorder#205AA0
notebook.selectedCellBackground#205AA0
notebook.selectedCellBorder#205AA0
notebookStatusErrorIcon.foreground#ff1C2C
notificationsErrorIcon.foreground#ff1C2C
notificationsWarningIcon.foreground#ffff00
panel.background#080E1F
panel.border#5dddee60
panel.dropBorder#103864
panelInput.border#206499
panelSection.border#000000
panelSection.dropBackground#4cff0070
panelSectionHeader.background#002e64
panelSectionHeader.border#000000
panelSectionHeader.foreground#3296ff
panelTitle.activeBorder#00DD24
panelTitle.activeForeground#FFFFFF
panelTitle.inactiveForeground#777777
peekView.border#2080ff
peekViewEditor.background#001d32
peekViewEditor.matchHighlightBackground#208000
peekViewEditor.matchHighlightBorder#505050
peekViewEditorGutter.background#001d32
peekViewResult.background#000424
peekViewResult.fileForeground#ffffff
peekViewResult.lineForeground#b2b5bc
peekViewResult.matchHighlightBackground#ea5c004d
peekViewResult.selectionBackground#3399ff33
peekViewResult.selectionForeground#ffffff
peekViewTitle.background#70d4441a
peekViewTitleDescription.foreground#ccccccb3
peekViewTitleLabel.foreground#ffffff
pickerGroup.border#103864
ports.iconRunningProcessForeground#dddddd
problemsErrorIcon.foreground#ff1C2C
problemsInfoIcon.foreground#30d430
problemsWarningIcon.foreground#ddff00
quickInput.background#071C40
quickInput.foreground#20D0C4
remoteHub.decorations.addedForegroundColor#10d8b8
remoteHub.decorations.deletedForegroundColor#e02090
remoteHub.decorations.incomingAddedForegroundColor#10d8b8
remoteHub.decorations.incomingDeletedForegroundColor#e02090
remoteHub.decorations.incomingModifiedForegroundColor#70E020
remoteHub.decorations.incomingRenamedForegroundColor#10d8b8
remoteHub.decorations.modifiedForegroundColor#70E020
remoteHub.decorations.workspaceRepositoriesView.hasUncommittedChangesForegroundColor#70E020
scrollbar.shadow#180000
scrollbarSlider.activeBackground#dddddd
scrollbarSlider.background#1050B0
scrollbarSlider.hoverBackground#FF7400
searchEditor.textInputBorder#205AA0
selection.background#105000
settings.checkboxBorder#205AA0
settings.dropdownBorder#205AA0
settings.headerForeground#b2b5bc
settings.modifiedItemIndicator#70E020
settings.numberInputBorder#205AA0
settings.textInputBorder#205AA0
sideBar.background#0A2855
sideBar.border#102C5C
sideBar.foreground#b2b5bc
sideBarSectionHeader.background#001025
sideBarSectionHeader.border#EEFF8840
sideBarSectionHeader.foreground#b2b5bc
sideBarTitle.foreground#00EE70
statusBar.background#001127
statusBar.border#A0E8FF40
statusBar.debuggingBackground#205AA0
statusBar.debuggingBorder#205AA0
statusBar.debuggingForeground#dddddd
statusBar.foreground#E8ECFF
statusBar.noFolderBackground#3e4070
statusBar.noFolderBorder#205AA0
statusBarItem.errorBackground#ff1C2C4c
statusBarItem.errorForeground#ff1C2C
statusBarItem.remoteBackground#38880c
statusBarItem.remoteForeground#ffffff
statusBarItem.warningBackground#00000060
statusBarItem.warningForeground#ffffff
symbolIcon.arrayForeground#14EE80
symbolIcon.booleanForeground#14EE80
symbolIcon.classForeground#FF7400
symbolIcon.colorForeground#14EE80
symbolIcon.constantForeground#14EE80
symbolIcon.constructorForeground#14EE80
symbolIcon.enumeratorForeground#FF7400
symbolIcon.enumeratorMemberForeground#FF7400
symbolIcon.eventForeground#FF7400
symbolIcon.fieldForeground#FF7400
symbolIcon.fileForeground#14EE80
symbolIcon.folderForeground#14EE80
symbolIcon.functionForeground#14EE80
symbolIcon.interfaceForeground#FF7400
symbolIcon.keyForeground#14EE80
symbolIcon.keywordForeground#14EE80
symbolIcon.methodForeground#14EE80
symbolIcon.moduleForeground#14EE80
symbolIcon.namespaceForeground#14EE80
symbolIcon.nullForeground#FF7400
symbolIcon.numberForeground#14EE80
symbolIcon.objectForeground#14EE80
symbolIcon.operatorForeground#14EE80
symbolIcon.packageForeground#14EE80
symbolIcon.propertyForeground#14EE80
symbolIcon.referenceForeground#FF7400
symbolIcon.snippetForeground#14EE80
symbolIcon.stringForeground#14EE80
symbolIcon.structForeground#14EE80
symbolIcon.textForeground#FF7400
symbolIcon.typeParameterForeground#14EE80
symbolIcon.unitForeground#14EE80
symbolIcon.variableForeground#75beff
tab.activeBackground#0A2855
tab.activeBorder#0A2855
tab.activeBorderTop#14EE80
tab.activeForeground#20e4ff
tab.activeModifiedBorder#70E020
tab.border#102C5C
tab.inactiveBackground#080E1F
tab.inactiveModifiedBorder#70E020aa
tab.lastPinnedBorder#102C5C
tab.unfocusedActiveBackground#0A2855
tab.unfocusedActiveBorder#0A2855
tab.unfocusedActiveBorderTop#14EE80
tab.unfocusedInactiveBackground#030920
terminal.ansiBlack#000000
terminal.ansiBlue#3060ff
terminal.ansiBrightBlack#1c1e2e
terminal.ansiBrightBlue#00B0ff
terminal.ansiBrightCyan#00fff0
terminal.ansiBrightGreen#00d800
terminal.ansiBrightMagenta#ff30dd
terminal.ansiBrightRed#FF4C12
terminal.ansiBrightWhite#ffffff
terminal.ansiBrightYellow#EECC44
terminal.ansiCyan#24bcd8
terminal.ansiGreen#40cc40
terminal.ansiMagenta#ff99ee
terminal.ansiRed#FF7400
terminal.ansiWhite#d8d8d8
terminal.ansiYellow#d49420
terminal.background#0A2855
terminal.border#000C20
terminal.foreground#ECEEF4
terminal.selectionBackground#081a2d
terminal.tab.activeBorder#0050ff
terminalCursor.background#ffffff
terminalCursor.foreground#14EE80
testing.iconErrored#ff1C2C
testing.iconFailed#ff1C2C
testing.iconPassed#80ff40
testing.iconQueued#00aa00
testing.iconSkipped#2c6e9c
testing.iconUnset#2c6e9c
testing.message.error.decorationForeground#ff1C2C
testing.message.error.lineBackground#ff1C2C4c
testing.message.info.decorationForeground#c4d0dd80
textBlockQuote.background#0d1018
textBlockQuote.border#385280
textCodeBlock.background#000090
textLink.activeForeground#888888
textLink.foreground#3794ff
textPreformat.foreground#14EE80
textSeparator.foreground#ffffff2e
titleBar.activeBackground#041333
titleBar.activeForeground#cecece
titleBar.border#003060
titleBar.inactiveBackground#003064
toolbar.activeBackground#205AA0
toolbar.hoverBackground#4470cc
toolbar.hoverOutline#dddddd
tree.indentGuidesStroke#00cc00
welcomePage.tileBackground#11141d
welcomePage.tileShadow#180000
widget.shadow#180000
window.activeBorder#14EE80

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
token.info-token	#00C4A4	—
token.warn-token	#E50000	—
token.error-token	#F50000	—
token.debug-token	#650000	—
markup.heading	#A77CFF	bold
invalid.illegal	#F50000	bold underline
source, text	#A0AAD0	—
comment, punctuation.definition.comment	#0C6E9C
punctuation, meta.brace	#2C8CFF
source keyword, source storage, string punctuation.definition.string, meta.preprocessor punctuation.definition.string, meta.preprocessor punctuation.definition	#2C8CFF	bold
source keyword, source keyword.other, source keyword.control, source meta.scope.recipe, source keyword.operator.new, source support.type.property-name, source punctuation.definition.string, source punctuation.definition.string source.css-ignored-vscode	#2C8CFF	italic bold
storage.type.modifier.access.control	#2C8CFF	bold underline
source keyword.operator, keyword.operator.bitwise.shift, source entity.name.operator, source storage.modifier.reference, source entity.name.function.operator.member, meta.preprocessor punctuation.definition, markup.underline.link, punctuation.accessor, keyword.operator.logical, keyword.operator.ternary, keyword.operator.increment, keyword.operator.decrement, entity.other.document.begin, keyword.operator.arithmetic, keyword.operator.arithmetic, keyword.operator.assignment, keyword.operator.comparison, punctuation.separator.key-value, punctuation.separator.dot-access, punctuation.separator.colon.case, punctuation.definition.directive, keyword.operator.assignment.compound, punctuation.separator.pointer-access, punctuation.separator.scope-resolution, punctuation.separator.key-value.editorconfig	#FF40C4
source entity.name.namespace	#AC87FF
source support.class, source support.type.object, source variable.other.object, source entity.type, source entity.class, source entity.name.class, source entity.name.type.class, source entity.type, source entity.name.type, source entity.name.type.class	#07CCAC
source entity.name.tag, source entity.name.function, source entity.name.function.call, source entity.name.function.method, source entity.name.function.target, source entity.name.function.definition.special.constructor	#1CC0F1	—
variable.language.this	—	italic
meta.class.body.js meta.function.method.js entity.name.function.method.js	#1CC0F1	underline
source entity.name.function.call, source entity.name.function.method, source entity.name.function.target, source entity.name.function.definition.special.constructor	#1CC0F1
constant.numeric	#6ACC24
string, source.makefile, entity.source.cmake, meta.scope.prerequisites	#50BC70	italic
string.quoted.double.json	#7CC096	—
string.quoted.double source	#5000E0	italic
variable.language, constant.language, constant.boolean, constant.null, constant.nan, variable.other.macro, entity.name.function.preprocessor, string.quoted.other.lt-gt	#F47238	italic
constant	#F47238
entity.other.attribute-name, punctuation.separator.key-value.html	#30C400
variable.parameter	#D0A234	italic
variable.property, variable.other.property, variable.other.makefile	#A5ACC4	—
source.json meta meta meta meta meta meta meta meta meta meta meta string support.type.property-name	#15BEEE
source.json meta meta meta meta meta meta meta meta meta string support.type.property-name	#A77CFF
source.json meta meta meta meta meta meta meta string support.type.property-name	#04C0B4
source.json meta meta meta meta meta string support.type.property-name	#15BEEE
source.json meta meta meta string support.type.property-name	#A77CFF
source.json meta string support.type.property-name	#04C0B4
markup.italic	—	italic
markup.bold	—	bold
markup.bold.markdown markup.italic.markdown, markup.italic.markdown markup.bold.markdown	—	italic bold
markup punctuation, text.html punctuation, markup.inline.raw.string	#049CFF
meta.separator.markdown, string.other.link.description	#FF40B0	—
heading entity.name.section	#6CC848
heading.1 entity.name.section, heading.2 entity.name.section	#6CC848	underline
heading.3 entity.name.section, heading.4 entity.name.section	#6CC848
heading.1 entity.name.section markup.bold, heading.2 entity.name.section markup.bold	#6CC848	bold underline
heading.1 entity.name.section markup.italic, heading.2 entity.name.section markup.italic	#6CC848	italic underline
heading.1 entity.name.section markup.bold markup.italic, heading.2 entity.name.section markup.bold markup.italic	#6CC848	italic bold underline
heading.3 entity.name.section markup.bold, heading.4 entity.name.section markup.bold	#6CC848	bold
heading.3 entity.name.section markup.italic, heading.4 entity.name.section markup.italic	#6CC848	italic
heading.1 entity.name.section markup.bold markup.italic, heading.2 entity.name.section markup.bold markup.italic	#6CC848	italic bold
heading.3 entity.name.section markup.bold markup.italic, heading.4 entity.name.section markup.bold markup.italic	#6CC848	italic bold
storage.type.class.doxygen, comment.block storage.type, comment.block storage.type.class	#07CCACA0
comment.block variable.parameter	#D5000D80	italic

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