Skip to main content
South Australia | Coding Theme
Home Theme VS Code South Australia A professional theme for Visual Studio Code featuring South Australia's iconic blue and red colour palette.
VS Code preview Full workbench mockup using this variant's colors and tokenColors.
colors Workbench UI color keys from the theme JSON colors map.
actionBar.toggledBackground #01216940 activityBar.activeBackground #0A0C1850 activityBar.activeBorder #012169 activityBar.activeFocusBorder #012169 activityBar.background #050710 activityBar.border #050710 tokenColors TextMate scopes and font styles (syntax highlighting rules).
scope foreground fontStyle comment, punctuation.definition.comment #A8B4D080 italic variable, string constant.other.placeholder #E8EDF3 — constant.other.color #012169 — invalid, invalid.illegal #E4002B — keyword, storage.type, storage.modifier
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}!`;
}
South Australia — South Australia Dark main*
0 1
Copilot
Ln 5, Col 12
Spaces: 2
UTF-8
LF
TypeScript
Dark+
activityBar.dropBorder #012169
activityBar.foreground #E8EDF3
activityBar.inactiveForeground #A8B4D080
activityBarBadge.background #012169
activityBarBadge.foreground #E8EDF3
activityBarTop.activeBackground #0A0C1850
activityBarTop.activeBorder #012169
activityBarTop.background #050710
activityBarTop.dropBorder #012169
activityBarTop.foreground #E8EDF3
activityBarTop.inactiveForeground #A8B4D080
activityErrorBadge.background #E4002B
activityErrorBadge.foreground #E8EDF3
activityWarningBadge.background #FFCC2C
activityWarningBadge.foreground #E8EDF3
agentSessionReadIndicator.foreground #012169
agentSessionSelectedBadge.border #01216950
agentSessionSelectedUnfocusedBadge.border #E8EDF350
agentStatusIndicator.background #161928
aiCustomizationManagement.sashBorder #012169
badge.background #012169
badge.foreground #E8EDF3
banner.background #012169
banner.foreground #E8EDF3
banner.iconForeground #E8EDF3
breadcrumb.activeSelectionForeground #012169
breadcrumb.background #0A0C18
breadcrumb.focusForeground #E8EDF3
breadcrumb.foreground #A8B4D0
breadcrumbPicker.background #111420
button.background #012169
button.border #01216900
button.foreground #E8EDF3
button.hoverBackground #001550
button.secondaryBackground #161928
button.secondaryBorder #01216950
button.secondaryForeground #E8EDF3
button.secondaryHoverBackground #202438
button.separator #E8EDF340
charts.blue #012169
charts.foreground #E8EDF3
charts.green #339D37
charts.lines #A8B4D080
charts.orange #7EB8DA
charts.purple #F03050
charts.red #E4002B
charts.yellow #FFCC2C
chat.avatarBackground #012169
chat.avatarForeground #E8EDF3
chat.checkpointSeparator #01216950
chat.editedFileForeground #012169
chat.inputWorkingBorderColor1 #012169
chat.inputWorkingBorderColor2 #001550
chat.inputWorkingBorderColor3 #012169
chat.linesAddedForeground #339D37CC
chat.linesRemovedForeground #E4002BCC
chat.requestBackground #161928
chat.requestBorder #01216950
chat.requestBubbleBackground #161928E6
chat.requestBubbleHoverBackground #202438E6
chat.requestCodeBorder #01216930
chat.slashCommandBackground #012169
chat.slashCommandForeground #E8EDF3
chat.thinkingShimmer #01216940
chatManagement.sashBorder #012169
checkbox.background #1A1D2A
checkbox.border #01216950
checkbox.disabled.background #1A1D2A80
checkbox.disabled.foreground #A8B4D060
checkbox.foreground #012169
checkbox.selectBackground #1A1D2A
checkbox.selectBorder #012169
commandCenter.activeBackground #E8EDF325
commandCenter.activeBorder #E8EDF350
commandCenter.activeForeground #E8EDF3
commandCenter.background #E8EDF315
commandCenter.border #E8EDF330
commandCenter.debuggingBackground #339D3730
commandCenter.foreground #E8EDF3
commandCenter.inactiveBorder #E8EDF320
commandCenter.inactiveForeground #A8B4D080
commentsView.resolvedIcon #339D37
commentsView.unresolvedIcon #FFCC2C
contrastActiveBorder #01216900
contrastBorder #01216900
debugConsole.errorForeground #E4002B
debugConsole.infoForeground #5B9BD5
debugConsole.sourceForeground #A8B4D0
debugConsole.warningForeground #FFCC2C
debugConsoleInputIcon.foreground #012169
debugExceptionWidget.background #E4002B20
debugExceptionWidget.border #E4002B80
debugIcon.breakpointCurrentStackframeForeground #FFCC2C
debugIcon.breakpointDisabledForeground #A8B4D080
debugIcon.breakpointForeground #E4002B
debugIcon.breakpointStackframeForeground #339D37
debugIcon.breakpointUnverifiedForeground #FFCC2C
debugIcon.continueForeground #339D37
debugIcon.disconnectForeground #E4002B
debugIcon.pauseForeground #FFCC2C
debugIcon.restartForeground #339D37
debugIcon.startForeground #339D37
debugIcon.stepBackForeground #012169
debugIcon.stepIntoForeground #012169
debugIcon.stepOutForeground #012169
debugIcon.stepOverForeground #012169
debugIcon.stopForeground #E4002B
debugTokenExpression.boolean #7EB8DA
debugTokenExpression.error #E4002B
debugTokenExpression.name #F03050
debugTokenExpression.number #7EB8DA
debugTokenExpression.string #6BBE27
debugTokenExpression.type #F03050
debugTokenExpression.value #6BBE27
debugToolBar.background #111420
debugView.exceptionLabelBackground #E4002B80
debugView.exceptionLabelForeground #E8EDF3
debugView.stateLabelBackground #01216950
debugView.stateLabelForeground #E8EDF3
debugView.valueChangedHighlight #01216980
descriptionForeground #A8B4D0
diffEditor.border #01216920
diffEditor.diagonalFill #01216920
diffEditor.insertedLineBackground #339D3715
diffEditor.insertedTextBackground #339D3720
diffEditor.insertedTextBorder #339D3750
diffEditor.move.border #01216980
diffEditor.moveActive.border #012169
diffEditor.removedLineBackground #E4002B15
diffEditor.removedTextBackground #E4002B20
diffEditor.removedTextBorder #E4002B50
diffEditor.unchangedCodeBackground #0A0C1880
diffEditor.unchangedRegionBackground #111420
diffEditor.unchangedRegionForeground #A8B4D080
diffEditor.unchangedRegionShadow #00000030
diffEditorGutter.insertedLineBackground #339D3730
diffEditorGutter.removedLineBackground #E4002B30
diffEditorOverview.insertedForeground #339D3780
diffEditorOverview.removedForeground #E4002B80
disabledForeground #A8B4D060
dropdown.background #1A1D2A
dropdown.border #01216950
dropdown.foreground #E8EDF3
dropdown.listBackground #111420
editor.background #0A0C18
editor.compositionBorder #012169
editor.findMatchBackground #01216980
editor.findMatchBorder #012169
editor.findMatchForeground #E8EDF3
editor.findMatchHighlightBackground #01216950
editor.findMatchHighlightBorder #01216980
editor.findMatchHighlightForeground #E8EDF3
editor.findRangeHighlightBackground #01216920
editor.findRangeHighlightBorder #01216900
editor.focusedStackFrameHighlightBackground #339D3730
editor.foldBackground #01216915
editor.foldPlaceholderForeground #A8B4D080
editor.foreground #E8EDF3
editor.hoverHighlightBackground #01216925
editor.inactiveLineHighlightBackground #1A1D2A80
editor.inactiveSelectionBackground #01216930
editor.inlineValuesBackground #01216915
editor.inlineValuesForeground #A8B4D0CC
editor.lineHighlightBackground #1A1D2A
editor.lineHighlightBorder #01216915
editor.linkedEditingBackground #01216930
editor.placeholder.foreground #A8B4D080
editor.rangeHighlightBackground #01216915
editor.rangeHighlightBorder #01216900
editor.selectionBackground #01216950
editor.selectionForeground #E8EDF3
editor.selectionHighlightBackground #01216930
editor.selectionHighlightBorder #01216950
editor.stackFrameHighlightBackground #FFCC2C30
editor.symbolHighlightBackground #01216930
editor.symbolHighlightBorder #01216950
editor.wordHighlightBackground #01216930
editor.wordHighlightBorder #01216950
editor.wordHighlightStrongBackground #01216950
editor.wordHighlightStrongBorder #01216980
editor.wordHighlightTextBackground #01216920
editor.wordHighlightTextBorder #01216940
editorActionList.background #111420
editorActionList.focusBackground #01216940
editorActionList.focusForeground #E8EDF3
editorActionList.foreground #E8EDF3
editorBracketHighlight.foreground1 #4477BB
editorBracketHighlight.foreground2 #E4002B
editorBracketHighlight.foreground3 #FFCC2C
editorBracketHighlight.foreground4 #6BBE27
editorBracketHighlight.foreground5 #5B9BD5
editorBracketHighlight.foreground6 #7EB8DA
editorBracketHighlight.unexpectedBracket.foreground #E4002B
editorBracketMatch.border #01216980
editorBracketMatch.foreground #012169
editorBracketPairGuide.activeBackground1 #4477BB80
editorBracketPairGuide.activeBackground2 #E4002B80
editorBracketPairGuide.activeBackground3 #FFCC2C80
editorBracketPairGuide.activeBackground4 #6BBE2780
editorBracketPairGuide.activeBackground5 #5B9BD580
editorBracketPairGuide.activeBackground6 #7EB8DA80
editorBracketPairGuide.background1 #4477BB40
editorBracketPairGuide.background2 #E4002B40
editorBracketPairGuide.background3 #FFCC2C40
editorBracketPairGuide.background4 #6BBE2740
editorBracketPairGuide.background5 #5B9BD540
editorBracketPairGuide.background6 #7EB8DA40
editorCodeLens.foreground #A8B4D080
editorCommentsWidget.rangeActiveBackground #01216920
editorCommentsWidget.rangeBackground #01216910
editorCommentsWidget.replyInputBackground #1A1D2A
editorCommentsWidget.resolvedBorder #339D3750
editorCommentsWidget.unresolvedBorder #FFCC2C
editorCursor.background #0A0C18
editorCursor.foreground #012169
editorError.background #E4002B15
editorError.border #E4002B00
editorError.foreground #E4002B
editorGhostText.background #01216900
editorGhostText.border #01216900
editorGhostText.foreground #01216980
editorGroup.border #01216920
editorGroup.dropBackground #01216930
editorGroup.dropIntoPromptBackground #111420
editorGroup.dropIntoPromptBorder #01216950
editorGroup.dropIntoPromptForeground #E8EDF3
editorGroup.emptyBackground #0A0C18
editorGroup.focusedEmptyBorder #01216950
editorGroupHeader.border #01216920
editorGroupHeader.noTabsBackground #0A0C18
editorGroupHeader.tabsBackground #111420
editorGroupHeader.tabsBorder #01216920
editorGutter.addedBackground #339D37
editorGutter.addedSecondaryBackground #339D3780
editorGutter.background #0A0C18
editorGutter.commentDraftGlyphForeground #01216980
editorGutter.commentGlyphForeground #012169
editorGutter.commentRangeForeground #A8B4D050
editorGutter.commentUnresolvedGlyphForeground #FFCC2C
editorGutter.deletedBackground #E4002B
editorGutter.deletedSecondaryBackground #E4002B80
editorGutter.foldingControlForeground #A8B4D080
editorGutter.itemBackground #111420
editorGutter.itemGlyphForeground #012169
editorGutter.modifiedBackground #012169
editorGutter.modifiedSecondaryBackground #01216980
editorHint.border #339D3700
editorHint.foreground #339D37
editorHoverWidget.background #111420
editorHoverWidget.border #01216950
editorHoverWidget.foreground #E8EDF3
editorHoverWidget.highlightForeground #012169
editorHoverWidget.statusBarBackground #161928
editorIndentGuide.activeBackground1 #4477BB
editorIndentGuide.activeBackground2 #E4002B
editorIndentGuide.activeBackground3 #FFCC2C
editorIndentGuide.activeBackground4 #6BBE27
editorIndentGuide.activeBackground5 #5B9BD5
editorIndentGuide.activeBackground6 #7EB8DA
editorIndentGuide.background1 #4477BB25
editorIndentGuide.background2 #E4002B25
editorIndentGuide.background3 #FFCC2C25
editorIndentGuide.background4 #6BBE2725
editorIndentGuide.background5 #5B9BD525
editorIndentGuide.background6 #7EB8DA25
editorInfo.background #5B9BD515
editorInfo.border #5B9BD500
editorInfo.foreground #5B9BD5
editorInlayHint.background #1A1D2A
editorInlayHint.foreground #A8B4D0
editorInlayHint.parameterBackground #1A1D2A
editorInlayHint.parameterForeground #A8B4D0
editorInlayHint.typeBackground #1A1D2A
editorInlayHint.typeForeground #6BBE27
editorLightBulb.foreground #FFCC2C
editorLightBulbAi.foreground #012169
editorLightBulbAutoFix.foreground #339D37
editorLineNumber.activeForeground #012169
editorLineNumber.dimmedForeground #A8B4D050
editorLineNumber.foreground #F03050
editorLink.activeForeground #012169
editorMarkerNavigation.background #111420
editorMarkerNavigationError.background #E4002B30
editorMarkerNavigationError.headerBackground #E4002B20
editorMarkerNavigationInfo.background #5B9BD530
editorMarkerNavigationInfo.headerBackground #5B9BD520
editorMarkerNavigationWarning.background #FFCC2C30
editorMarkerNavigationWarning.headerBackground #FFCC2C20
editorMinimap.inlineChatInserted #339D3740
editorMinimap.inlineChatRemoved #E4002B40
editorMultiCursor.primary.background #0A0C18
editorMultiCursor.primary.foreground #012169
editorMultiCursor.secondary.background #0A0C18
editorMultiCursor.secondary.foreground #F03050
editorOverviewRuler.addedForeground #339D37
editorOverviewRuler.background #0A0C18
editorOverviewRuler.border #01216920
editorOverviewRuler.bracketMatchForeground #01216980
editorOverviewRuler.commentDraftForeground #01216960
editorOverviewRuler.commentForeground #01216940
editorOverviewRuler.commentUnresolvedForeground #FFCC2C80
editorOverviewRuler.commonContentForeground #A8B4D050
editorOverviewRuler.currentContentForeground #339D3780
editorOverviewRuler.deletedForeground #E4002B
editorOverviewRuler.errorForeground #E4002B
editorOverviewRuler.findMatchForeground #012169CC
editorOverviewRuler.incomingContentForeground #01216980
editorOverviewRuler.infoForeground #5B9BD5
editorOverviewRuler.inlineChatInserted #339D3780
editorOverviewRuler.inlineChatRemoved #E4002B80
editorOverviewRuler.modifiedForeground #012169
editorOverviewRuler.rangeHighlightForeground #01216999
editorOverviewRuler.selectionHighlightForeground #01216999
editorOverviewRuler.warningForeground #FFCC2C
editorOverviewRuler.wordHighlightForeground #01216999
editorOverviewRuler.wordHighlightStrongForeground #012169CC
editorOverviewRuler.wordHighlightTextForeground #01216980
editorPane.background #0A0C18
editorRuler.foreground #F0305030
editorSnippetFinalTabstopHighlightBackground #339D3730
editorSnippetFinalTabstopHighlightBorder #339D3700
editorSnippetTabstopHighlightBackground #01216930
editorSnippetTabstopHighlightBorder #01216900
editorStickyScroll.background #111420
editorStickyScroll.border #01216920
editorStickyScroll.shadow #00000030
editorStickyScrollGutter.background #111420
editorStickyScrollHover.background #202438
editorSuggestWidget.background #111420
editorSuggestWidget.border #01216950
editorSuggestWidget.focusHighlightForeground #012169
editorSuggestWidget.foreground #E8EDF3
editorSuggestWidget.highlightForeground #012169
editorSuggestWidget.selectedBackground #01216950
editorSuggestWidget.selectedForeground #E8EDF3
editorSuggestWidget.selectedIconForeground #E8EDF3
editorSuggestWidgetStatus.foreground #A8B4D080
editorUnicodeHighlight.background #FFCC2C20
editorUnicodeHighlight.border #FFCC2C
editorUnnecessaryCode.border #A8B4D050
editorUnnecessaryCode.opacity #000000AA
editorWarning.background #FFCC2C15
editorWarning.border #FFCC2C00
editorWarning.foreground #FFCC2C
editorWhitespace.foreground #F0305050
editorWidget.background #111420
editorWidget.border #01216950
editorWidget.foreground #E8EDF3
editorWidget.resizeBorder #012169
errorForeground #E4002B
extensionBadge.remoteBackground #012169
extensionBadge.remoteForeground #E8EDF3
extensionButton.background #012169
extensionButton.border #01216900
extensionButton.foreground #E8EDF3
extensionButton.hoverBackground #001550
extensionButton.prominentBackground #012169
extensionButton.prominentForeground #E8EDF3
extensionButton.prominentHoverBackground #001550
extensionButton.separator #E8EDF340
extensionIcon.preReleaseForeground #012169
extensionIcon.privateForeground #A8B4D080
extensionIcon.sponsorForeground #F03050
extensionIcon.starForeground #FFCC2C
extensionIcon.verifiedForeground #339D37
focusBorder #012169
foreground #E8EDF3
gauge.background #111420
gauge.border #01216930
gauge.errorBackground #E4002B30
gauge.errorForeground #E4002B
gauge.foreground #E8EDF3
gauge.warningBackground #FFCC2C30
gauge.warningForeground #FFCC2C
git.blame.editorDecorationForeground #A8B4D060
gitDecoration.addedResourceForeground #339D37
gitDecoration.conflictingResourceForeground #FFCC2C
gitDecoration.deletedResourceForeground #E4002B
gitDecoration.ignoredResourceForeground #A8B4D080
gitDecoration.modifiedResourceForeground #012169
gitDecoration.renamedResourceForeground #012169
gitDecoration.stageDeletedResourceForeground #E4002BCC
gitDecoration.stageModifiedResourceForeground #012169CC
gitDecoration.submoduleResourceForeground #6BBE27
gitDecoration.untrackedResourceForeground #339D37
icon.foreground #012169
inlineChat.background #111420
inlineChat.border #01216950
inlineChat.foreground #E8EDF3
inlineChat.shadow #00000080
inlineChatDiff.inserted #339D3730
inlineChatDiff.removed #E4002B30
inlineChatInput.background #1A1D2A
inlineChatInput.border #01216950
inlineChatInput.focusBorder #012169
inlineChatInput.placeholderForeground #A8B4D080
inlineEdit.gutterIndicator.background #111420
inlineEdit.gutterIndicator.primaryBackground #01216920
inlineEdit.gutterIndicator.primaryBorder #012169
inlineEdit.gutterIndicator.primaryForeground #012169
inlineEdit.gutterIndicator.secondaryBackground #F0305020
inlineEdit.gutterIndicator.secondaryBorder #F03050
inlineEdit.gutterIndicator.secondaryForeground #F03050
inlineEdit.gutterIndicator.successfulBackground #339D3720
inlineEdit.gutterIndicator.successfulBorder #339D37
inlineEdit.gutterIndicator.successfulForeground #339D37
inlineEdit.modifiedBackground #01216915
inlineEdit.modifiedBorder #01216950
inlineEdit.modifiedChangedLineBackground #01216920
inlineEdit.modifiedChangedTextBackground #01216930
inlineEdit.originalBackground #E4002B10
inlineEdit.originalBorder #E4002B30
inlineEdit.originalChangedLineBackground #E4002B15
inlineEdit.originalChangedTextBackground #E4002B25
inlineEdit.tabWillAcceptModifiedBorder #339D3780
inlineEdit.tabWillAcceptOriginalBorder #E4002B50
input.background #1A1D2A
input.border #01216950
input.foreground #E8EDF3
input.placeholderForeground #A8B4D080
inputOption.activeBackground #01216940
inputOption.activeBorder #012169
inputOption.activeForeground #E8EDF3
inputOption.hoverBackground #01216920
inputValidation.errorBackground #E4002B20
inputValidation.errorBorder #E4002B
inputValidation.errorForeground #E4002B
inputValidation.infoBackground #5B9BD520
inputValidation.infoBorder #5B9BD5
inputValidation.infoForeground #5B9BD5
inputValidation.warningBackground #FFCC2C20
inputValidation.warningBorder #FFCC2C
inputValidation.warningForeground #FFCC2C
interactive.activeCodeBorder #012169
interactive.inactiveCodeBorder #01216930
keybindingLabel.background #01216920
keybindingLabel.border #01216940
keybindingLabel.bottomBorder #01216960
keybindingLabel.foreground #E8EDF3
keybindingTable.headerBackground #161928
keybindingTable.rowsBackground #0A0C1880
list.activeSelectionBackground #01216950
list.activeSelectionForeground #E8EDF3
list.activeSelectionIconForeground #E8EDF3
list.deemphasizedForeground #A8B4D080
list.dropBackground #01216930
list.dropBetweenBackground #012169
list.errorForeground #E4002B
list.filterMatchBorder #01216980
list.focusAndSelectionOutline #012169
list.focusBackground #01216940
list.focusForeground #E8EDF3
list.focusHighlightForeground #012169
list.focusOutline #01216980
list.highlightForeground #4477BB
list.hoverBackground #01216920
list.hoverForeground #E8EDF3
list.inactiveFocusBackground #01216920
list.inactiveFocusOutline #01216950
list.inactiveSelectionBackground #01216930
list.inactiveSelectionForeground #E8EDF3
list.inactiveSelectionIconForeground #E8EDF3
list.invalidItemForeground #E4002B
list.warningForeground #FFCC2C
listFilterWidget.background #1A1D2A
listFilterWidget.noMatchesOutline #E4002B
listFilterWidget.outline #012169
listFilterWidget.shadow #00000050
markdownAlert.caution.foreground #E4002B
markdownAlert.important.foreground #F03050
markdownAlert.note.foreground #5B9BD5
markdownAlert.tip.foreground #339D37
markdownAlert.warning.foreground #FFCC2C
mcpIcon.starForeground #FFCC2C
menu.background #111420
menu.border #01216920
menu.foreground #E8EDF3
menu.selectionBackground #01216950
menu.selectionBorder #01216900
menu.selectionForeground #E8EDF3
menu.separatorBackground #01216930
menubar.selectionBackground #01216950
menubar.selectionBorder #01216900
menubar.selectionForeground #E8EDF3
merge.border #01216950
merge.commonContentBackground #A8B4D020
merge.commonHeaderBackground #A8B4D050
merge.currentContentBackground #339D3720
merge.currentHeaderBackground #339D3750
merge.incomingContentBackground #01216920
merge.incomingHeaderBackground #01216950
mergeEditor.change.background #01216920
mergeEditor.change.word.background #01216940
mergeEditor.changeBase.background #A8B4D015
mergeEditor.changeBase.word.background #A8B4D030
mergeEditor.conflict.handled.minimapOverViewRuler #339D37
mergeEditor.conflict.handledFocused.border #339D37
mergeEditor.conflict.handledUnfocused.border #339D3750
mergeEditor.conflict.input1.background #339D3720
mergeEditor.conflict.input2.background #01216920
mergeEditor.conflict.unhandled.minimapOverViewRuler #FFCC2C
mergeEditor.conflict.unhandledFocused.border #FFCC2C
mergeEditor.conflict.unhandledUnfocused.border #FFCC2C80
mergeEditor.conflictingLines.background #FFCC2C20
minimap.background #0A0C18
minimap.chatEditHighlight #01216940
minimap.errorHighlight #E4002B
minimap.findMatchHighlight #01216980
minimap.foregroundOpacity #000000FF
minimap.infoHighlight #5B9BD5
minimap.selectionHighlight #01216950
minimap.selectionOccurrenceHighlight #01216940
minimap.warningHighlight #FFCC2C
minimapGutter.addedBackground #339D37
minimapGutter.deletedBackground #E4002B
minimapGutter.modifiedBackground #012169
minimapSlider.activeBackground #01216970
minimapSlider.background #01216930
minimapSlider.hoverBackground #01216950
multiDiffEditor.background #0A0C18
multiDiffEditor.border #01216920
multiDiffEditor.headerBackground #111420
notebook.cellBorderColor #01216930
notebook.cellEditorBackground #111420
notebook.cellHoverBackground #202438
notebook.cellInsertionIndicator #012169
notebook.cellStatusBarItemHoverBackground #01216930
notebook.cellToolbarSeparator #01216920
notebook.editorBackground #0A0C18
notebook.focusedCellBackground #161928
notebook.focusedCellBorder #012169
notebook.focusedEditorBorder #012169
notebook.inactiveFocusedCellBorder #01216950
notebook.inactiveSelectedCellBorder #01216930
notebook.outputContainerBackgroundColor #050710
notebook.outputContainerBorderColor #01216920
notebook.selectedCellBackground #01216920
notebook.selectedCellBorder #01216980
notebook.symbolHighlightBackground #01216930
notebookEditorOverviewRuler.runningCellForeground #012169
notebookScrollbarSlider.activeBackground #01216970
notebookScrollbarSlider.background #01216930
notebookScrollbarSlider.hoverBackground #01216950
notebookStatusErrorIcon.foreground #E4002B
notebookStatusRunningIcon.foreground #012169
notebookStatusSuccessIcon.foreground #339D37
notificationCenter.border #01216920
notificationCenterHeader.background #111420
notificationCenterHeader.foreground #E8EDF3
notificationLink.foreground #012169
notifications.background #111420
notifications.border #01216920
notifications.foreground #E8EDF3
notificationsErrorIcon.foreground #E4002B
notificationsInfoIcon.foreground #5B9BD5
notificationsWarningIcon.foreground #FFCC2C
notificationToast.border #01216920
outputView.background #111420
outputViewStickyScroll.background #111420
panel.background #111420
panel.border #01216920
panel.dropBorder #012169
panelInput.border #01216950
panelSection.border #01216920
panelSection.dropBackground #01216930
panelSectionHeader.background #11142080
panelSectionHeader.border #01216920
panelSectionHeader.foreground #012169
panelStickyScroll.background #111420
panelStickyScroll.border #01216920
panelStickyScroll.shadow #00000030
panelTitle.activeBorder #012169
panelTitle.activeForeground #012169
panelTitle.border #01216920
panelTitle.inactiveForeground #A8B4D080
panelTitleBadge.background #012169
panelTitleBadge.foreground #E8EDF3
peekView.border #012169
peekViewEditor.background #0A0C18
peekViewEditor.matchHighlightBackground #01216950
peekViewEditor.matchHighlightBorder #01216980
peekViewEditorGutter.background #0A0C18
peekViewEditorStickyScroll.background #111420
peekViewEditorStickyScrollGutter.background #111420
peekViewResult.background #111420
peekViewResult.fileForeground #E8EDF3
peekViewResult.lineForeground #A8B4D0
peekViewResult.matchHighlightBackground #01216950
peekViewResult.selectionBackground #01216950
peekViewResult.selectionForeground #E8EDF3
peekViewTitle.background #000000
peekViewTitleDescription.foreground #A8B4D0
peekViewTitleLabel.foreground #012169
pickerGroup.border #01216930
pickerGroup.foreground #012169
ports.iconRunningProcessForeground #339D37
problemsErrorIcon.foreground #E4002B
problemsInfoIcon.foreground #5B9BD5
problemsWarningIcon.foreground #FFCC2C
profileBadge.background #012169
profileBadge.foreground #E8EDF3
profiles.sashBorder #012169
progressBar.background #012169
quickInput.background #111420
quickInput.border #01216930
quickInput.foreground #E8EDF3
quickInputList.focusBackground #01216940
quickInputList.focusForeground #E8EDF3
quickInputList.focusIconForeground #E8EDF3
quickInputList.hoverBackground #202438
quickInputTitle.background #161928
radio.activeBackground #012169
radio.activeBorder #012169
radio.activeForeground #E8EDF3
radio.inactiveBackground #1A1D2A
radio.inactiveBorder #01216950
radio.inactiveForeground #A8B4D0
radio.inactiveHoverBackground #202438
sash.hoverBorder #012169
scmGraph.foreground1 #012169
scmGraph.foreground2 #F03050
scmGraph.foreground3 #6BBE27
scmGraph.foreground4 #FFCC2C
scmGraph.foreground5 #339D37
scmGraph.historyItemBaseRefColor #6BBE27
scmGraph.historyItemHoverAdditionsForeground #339D37
scmGraph.historyItemHoverDeletionsForeground #E4002B
scmGraph.historyItemHoverLabelForeground #E8EDF3
scmGraph.historyItemRefColor #012169
scmGraph.historyItemRemoteRefColor #F03050
scrollbar.background #0A0C1800
scrollbar.shadow #00000050
scrollbarSlider.activeBackground #01216970
scrollbarSlider.background #01216930
scrollbarSlider.hoverBackground #01216950
search.resultsInfoForeground #A8B4D0
searchEditor.findMatchBackground #01216940
searchEditor.findMatchBorder #01216980
searchEditor.textInputBorder #01216950
selection.background #01216950
settings.checkboxBackground #1A1D2A
settings.checkboxBorder #01216950
settings.checkboxForeground #012169
settings.dropdownBackground #1A1D2A
settings.dropdownBorder #01216950
settings.dropdownForeground #E8EDF3
settings.dropdownListBorder #01216930
settings.focusedRowBackground #01216915
settings.focusedRowBorder #01216940
settings.headerBorder #01216920
settings.headerForeground #E8EDF3
settings.modifiedItemIndicator #012169
settings.numberInputBackground #1A1D2A
settings.numberInputBorder #01216950
settings.numberInputForeground #E8EDF3
settings.rowHoverBackground #01216915
settings.sashBorder #012169
settings.settingsHeaderHoverForeground #012169
settings.textInputBackground #1A1D2A
settings.textInputBorder #01216950
settings.textInputForeground #E8EDF3
sideBar.background #111420
sideBar.border #01216920
sideBar.dropBackground #01216930
sideBar.foreground #E8EDF3
sideBarActivityBarTop.border #01216920
sideBarSectionHeader.background #11142080
sideBarSectionHeader.border #01216920
sideBarSectionHeader.foreground #012169
sideBarStickyScroll.background #111420
sideBarStickyScroll.border #01216920
sideBarStickyScroll.shadow #00000030
sideBarTitle.background #111420
sideBarTitle.border #01216920
sideBarTitle.foreground #012169
sideBySideEditor.horizontalBorder #01216920
sideBySideEditor.verticalBorder #01216920
simpleFindWidget.sashBorder #012169
statusBar.background #050710
statusBar.border #050710
statusBar.debuggingBackground #339D37
statusBar.debuggingBorder #339D3780
statusBar.debuggingForeground #E8EDF3
statusBar.focusBorder #012169
statusBar.foreground #E8EDF3
statusBar.noFolderBackground #050710
statusBar.noFolderBorder #050710
statusBar.noFolderForeground #E8EDF3
statusBarItem.activeBackground #01216950
statusBarItem.compactHoverBackground #01216940
statusBarItem.errorBackground #E4002B
statusBarItem.errorForeground #E8EDF3
statusBarItem.errorHoverBackground #E4002BCC
statusBarItem.errorHoverForeground #E8EDF3
statusBarItem.focusBorder #012169
statusBarItem.hoverBackground #01216930
statusBarItem.hoverForeground #E8EDF3
statusBarItem.offlineBackground #A8B4D080
statusBarItem.offlineForeground #E8EDF3
statusBarItem.offlineHoverBackground #A8B4D060
statusBarItem.offlineHoverForeground #E8EDF3
statusBarItem.prominentBackground #012169
statusBarItem.prominentForeground #E8EDF3
statusBarItem.prominentHoverBackground #001550
statusBarItem.prominentHoverForeground #E8EDF3
statusBarItem.remoteBackground #F03050
statusBarItem.remoteForeground #E8EDF3
statusBarItem.remoteHoverBackground #F03050CC
statusBarItem.remoteHoverForeground #E8EDF3
statusBarItem.warningBackground #FFCC2C
statusBarItem.warningForeground #050710
statusBarItem.warningHoverBackground #FFCC2CCC
statusBarItem.warningHoverForeground #050710
symbolIcon.arrayForeground #7EB8DA
symbolIcon.booleanForeground #7EB8DA
symbolIcon.classForeground #F03050
symbolIcon.colorForeground #012169
symbolIcon.constantForeground #7EB8DA
symbolIcon.constructorForeground #4D80C4
symbolIcon.enumeratorForeground #F03050
symbolIcon.enumeratorMemberForeground #7EB8DA
symbolIcon.eventForeground #FFCC2C
symbolIcon.fieldForeground #012169
symbolIcon.fileForeground #A8B4D0
symbolIcon.folderForeground #012169
symbolIcon.functionForeground #4D80C4
symbolIcon.interfaceForeground #F03050
symbolIcon.keyForeground #012169
symbolIcon.keywordForeground #F03050
symbolIcon.methodForeground #4D80C4
symbolIcon.moduleForeground #012169
symbolIcon.namespaceForeground #012169
symbolIcon.nullForeground #A8B4D080
symbolIcon.numberForeground #7EB8DA
symbolIcon.objectForeground #012169
symbolIcon.operatorForeground #4D80C4
symbolIcon.packageForeground #012169
symbolIcon.propertyForeground #E8EDF3
symbolIcon.referenceForeground #012169
symbolIcon.snippetForeground #6BBE27
symbolIcon.stringForeground #6BBE27
symbolIcon.structForeground #F03050
symbolIcon.textForeground #E8EDF3
symbolIcon.typeParameterForeground #F03050
symbolIcon.unitForeground #7EB8DA
symbolIcon.variableForeground #E8EDF3
tab.activeBackground #0A0C18
tab.activeBorder #012169
tab.activeBorderTop #01216900
tab.activeForeground #E8EDF3
tab.activeModifiedBorder #012169
tab.border #01216920
tab.dragAndDropBorder #012169
tab.hoverBackground #11142080
tab.hoverBorder #01216950
tab.hoverForeground #E8EDF3
tab.inactiveBackground #111420
tab.inactiveForeground #A8B4D080
tab.inactiveModifiedBorder #01216980
tab.lastPinnedBorder #01216940
tab.selectedBackground #0A0C18
tab.selectedBorderTop #012169
tab.selectedForeground #E8EDF3
tab.unfocusedActiveBackground #0A0C18
tab.unfocusedActiveBorder #01216980
tab.unfocusedActiveBorderTop #01216900
tab.unfocusedActiveForeground #E8EDF3CC
tab.unfocusedActiveModifiedBorder #012169CC
tab.unfocusedHoverBackground #11142060
tab.unfocusedHoverBorder #01216930
tab.unfocusedHoverForeground #E8EDF3CC
tab.unfocusedInactiveBackground #111420
tab.unfocusedInactiveForeground #A8B4D060
tab.unfocusedInactiveModifiedBorder #01216960
terminal.ansiBlack #0A0C18
terminal.ansiBlue #012169
terminal.ansiBrightBlack #78797E
terminal.ansiBrightBlue #3366AA
terminal.ansiBrightCyan #7EB8DA
terminal.ansiBrightGreen #78D65B
terminal.ansiBrightMagenta #E4002B
terminal.ansiBrightRed #FF4D5E
terminal.ansiBrightWhite #FFFFFF
terminal.ansiBrightYellow #FFE066
terminal.ansiCyan #5B9BD5
terminal.ansiGreen #6BBE27
terminal.ansiMagenta #8B1A4A
terminal.ansiRed #E4002B
terminal.ansiWhite #E8EDF3
terminal.ansiYellow #FFCC2C
terminal.background #0A0C18
terminal.border #01216920
terminal.dropBackground #01216930
terminal.findMatchBackground #01216980
terminal.findMatchBorder #012169
terminal.findMatchHighlightBackground #01216950
terminal.findMatchHighlightBorder #01216980
terminal.foreground #E8EDF3
terminal.hoverHighlightBackground #01216930
terminal.inactiveSelectionBackground #01216930
terminal.initialHintForeground #A8B4D080
terminal.selectionBackground #01216950
terminal.selectionForeground #E8EDF3
terminal.tab.activeBorder #012169
terminalCommandDecoration.defaultBackground #01216950
terminalCommandDecoration.errorBackground #E4002B80
terminalCommandDecoration.successBackground #339D3780
terminalCommandGuide.foreground #01216930
terminalCursor.background #0A0C18
terminalCursor.foreground #012169
terminalOverviewRuler.border #01216920
terminalOverviewRuler.cursorForeground #012169
terminalOverviewRuler.findMatchForeground #012169CC
terminalStickyScroll.background #111420
terminalStickyScroll.border #01216920
terminalStickyScrollHover.background #202438
terminalSymbolIcon.aliasForeground #012169
terminalSymbolIcon.argumentForeground #7EB8DA
terminalSymbolIcon.branchForeground #339D37
terminalSymbolIcon.commitForeground #012169
terminalSymbolIcon.fileForeground #A8B4D0
terminalSymbolIcon.flagForeground #FFCC2C
terminalSymbolIcon.folderForeground #012169
terminalSymbolIcon.inlineSuggestionForeground #A8B4D080
terminalSymbolIcon.methodForeground #4D80C4
terminalSymbolIcon.optionForeground #E8EDF3
terminalSymbolIcon.optionValueForeground #6BBE27
terminalSymbolIcon.pullRequestDoneForeground #339D37
terminalSymbolIcon.pullRequestForeground #012169
terminalSymbolIcon.remoteForeground #F03050
terminalSymbolIcon.stashForeground #012169
terminalSymbolIcon.symbolicLinkFileForeground #01216980
terminalSymbolIcon.symbolicLinkFolderForeground #01216980
terminalSymbolIcon.symbolText #E8EDF3
terminalSymbolIcon.tagForeground #F03050
testing.coverCountBadgeBackground #012169
testing.coverCountBadgeForeground #E8EDF3
testing.coveredBackground #339D3715
testing.coveredBorder #339D3740
testing.coveredGutterBackground #339D3750
testing.iconErrored #E4002B
testing.iconErrored.retired #E4002B60
testing.iconFailed #E4002B
testing.iconFailed.retired #E4002B60
testing.iconPassed #339D37
testing.iconPassed.retired #339D3760
testing.iconQueued #FFCC2C
testing.iconQueued.retired #FFCC2C60
testing.iconSkipped #A8B4D080
testing.iconSkipped.retired #A8B4D050
testing.iconUnset #A8B4D080
testing.iconUnset.retired #A8B4D050
testing.message.error.badgeBackground #E4002B
testing.message.error.badgeBorder #E4002B80
testing.message.error.badgeForeground #E8EDF3
testing.message.error.lineBackground #E4002B15
testing.message.info.decorationForeground #5B9BD5
testing.message.info.lineBackground #5B9BD515
testing.messagePeekBorder #5B9BD5
testing.messagePeekHeaderBackground #5B9BD520
testing.peekBorder #E4002B
testing.peekHeaderBackground #E4002B20
testing.runAction #339D37
testing.uncoveredBackground #E4002B15
testing.uncoveredBorder #E4002B40
testing.uncoveredBranchBackground #E4002B30
testing.uncoveredGutterBackground #E4002B50
textBlockQuote.background #161928
textBlockQuote.border #01216980
textCodeBlock.background #1A1D2A
textLink.activeForeground #012169
textLink.foreground #012169CC
textPreformat.background #1A1D2A
textPreformat.border #01216930
textPreformat.foreground #6BBE27
textSeparator.foreground #01216930
titleBar.activeBackground #050710
titleBar.activeForeground #E8EDF3
titleBar.border #050710
titleBar.inactiveBackground #050710
titleBar.inactiveForeground #A8B4D080
toolbar.activeBackground #01216940
toolbar.hoverBackground #01216930
toolbar.hoverOutline #01216900
tree.inactiveIndentGuidesStroke #01216920
tree.indentGuidesStroke #01216940
tree.tableColumnsBorder #01216920
tree.tableOddRowsBackground #0A0C1850
walkThrough.embeddedEditorBackground #111420
walkthrough.stepTitle.foreground #E8EDF3
welcomePage.background #0A0C18
welcomePage.progress.background #1A1D2A
welcomePage.progress.foreground #012169
welcomePage.tileBackground #111420
welcomePage.tileBorder #01216920
welcomePage.tileHoverBackground #202438
widget.border #01216930
widget.shadow #00000050
window.activeBorder #01216900
window.inactiveBorder #01216900 keyword.control, constant.other.color, punctuation, meta.tag, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution #4D80C4 —
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter #F03050 —
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method #4D80C4 —
meta.block variable.other #E8EDF3 —
support.other.variable, string.other.link #E8EDF3 —
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other #7EB8DA —
string, constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js #6BBE27 —
entity.name, support.type, support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types #4D80C4 —
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name #4D80C4 —
entity.name.module.js, variable.import.parameter.js, variable.other.class.js #E8EDF3 —
variable.language #F03050 italic
entity.name.method.js #4D80C4 italic
meta.class-method.js entity.name.function.js, variable.function.constructor #4D80C4 —
entity.other.attribute-name #F03050 —
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name #4D80C4 italic
entity.other.attribute-name.class #4D80C4 —
source.sass keyword.control #4D80C4 —
constant.character.escape #6BBE27 —
*url*, *link*, *uri* — underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js #4D80C4 italic
source.js constant.other.object.key.js string.unquoted.label.js #E8EDF3 italic
source.json meta.structure.dictionary.json support.type.property-name.json #012169 —
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json #F03050 —
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json #6BBE27 —
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json #7EB8DA —
text.html.markdown, punctuation.definition.list_item.markdown #E8EDF3 —
text.html.markdown markup.inline.raw.markdown #F03050 —
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown #4D80C4 —
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown #012169 —
markup.italic #F03050 italic
markup.bold, markup.bold string #F03050 bold
markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold string #F03050 bold
markup.underline #6BBE27 underline
markup.quote punctuation.definition.blockquote.markdown #5B9BD5 —
string.other.link.title.markdown #4D80C4 —
string.other.link.description.title.markdown #F03050 —
constant.other.reference.link.markdown #6BBE27 —
markup.raw.block.fenced.markdown #E8EDF3 —
punctuation.definition.fenced.markdown #E8EDF3 —
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end #E8EDF3 —
variable.language.fenced.markdown #4D80C4 —
meta.separator #012169 bold
Open Editors fetchUser.ts index.ts README.md My-Project src components fetchUser.ts Button.tsx Modal.tsx hooks utils index.ts public package.json tsconfig.json README.md Outline fetchUser.ts
index.ts
README.md
src components fetchUser.ts fetchUser 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
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 $
31
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}!`;
}