Skip to main content
Home Theme VS Code Cool Cowboy Theme A dark theme blending muted cool and warm colors, creating a balanced and comfortable coding environment inspired by Western aesthetics.
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 #564f6480 activityBar.activeBackground #564f64c0 activityBar.activeBorder #918a9f activityBar.activeFocusBorder #00000000 activityBar.background #000000 activityBar.border #3c3746 tokenColors TextMate scopes and font styles (syntax highlighting rules).
scope foreground fontStyle emphasis — italic support.class.component, entity.name.type.class.component, support.class.component.tsx, support.class.component.jsx, entity.name.type.class.component, entity.other.inherited-class.component, meta.class.component #8fabc8 — strong — bold header #7790A8 — comment, punctuation.definition.comment, string.comment.buffered.block.pug, string.quoted.docstring.multi.python
Shiki preview TypeScript sample highlighted with this variant's colors and tokenColors.
Cool Cowboy Theme — Cool Cowboy Theme (High Contrast) Cool Cowboy Theme | Coding Theme
activityBar.dropBorder #918a9f
activityBar.foreground #e1dfe5
activityBar.inactiveForeground #564f64
activityBarBadge.background #918a9f
activityBarBadge.foreground #000000
activityBarTop.activeBackground #564f641f
activityBarTop.activeBorder #00000000
activityBarTop.background #000000
activityBarTop.dropBorder #918a9f
activityBarTop.foreground #e1dfe5
activityBarTop.inactiveForeground #746b84
activityErrorBadge.background #000000
activityErrorBadge.foreground #fed9b7
activityWarningBadge.background #000000
activityWarningBadge.foreground #dfc299
badge.background #918a9f
badge.foreground #000000
banner.background #a8a4c8
banner.foreground #000000
banner.iconForeground #000000
breadcrumb.activeSelectionForeground #e1dfe5
breadcrumb.background #000000
breadcrumb.focusForeground #e1dfe5
breadcrumb.foreground #746b84
breadcrumbPicker.background #000000
button.background #749392
button.border #00000000
button.foreground #000000
button.hoverBackground #8bafae
button.secondaryBackground #564f64c0
button.secondaryForeground #e1dfe5
button.secondaryHoverBackground #564f6480
button.separator #749392
charts.blue #ff0000
charts.foreground #ff0000
charts.green #ff0000
charts.lines #ff0000
charts.orange #ff0000
charts.purple #ff0000
charts.red #ff0000
charts.yellow #ff0000
chat.avatarBackground #00000000
chat.avatarForeground #746b84
chat.requestBackground #111111
chat.requestBorder #3c3746
chat.slashCommandBackground #000000
chat.slashCommandForeground #918a9f
checkbox.background #000000
checkbox.border #918a9f
checkbox.foreground #aba6b6
checkbox.selectBackground #000000
checkbox.selectBorder #918a9f
commandCenter.activeBackground #564f6480
commandCenter.activeBorder #564f64
commandCenter.activeForeground #e1dfe5
commandCenter.background #111111
commandCenter.border #3c3746
commandCenter.debuggingBackground #111111
commandCenter.foreground #918a9f
commandCenter.inactiveBorder #3c3746
commandCenter.inactiveForeground #746b84
commentsView.resolvedIcon #8fabc8
commentsView.unresolvedIcon #dfc299
contrastActiveBorder #00000000
contrastBorder #00000000
debugConsole.errorForeground #fed9b7
debugConsole.infoForeground #8fabc8
debugConsole.sourceForeground #a8a4c8
debugConsole.warningForeground #dfc299
debugConsoleInputIcon.foreground #746b84
debugExceptionWidget.background #a25a634d
debugExceptionWidget.border #a25a63
debugIcon.breakpointCurrentStackframeForeground #dfc299
debugIcon.breakpointDisabledForeground #564f64
debugIcon.breakpointForeground #fed9b7
debugIcon.breakpointStackframeForeground #746b84
debugIcon.breakpointUnverifiedForeground #746b84
debugIcon.continueForeground #a8a4c8
debugIcon.disconnectForeground #a8a4c8
debugIcon.pauseForeground #a8a4c8
debugIcon.restartForeground #8fabc8
debugIcon.startForeground #8fabc8
debugIcon.stepBackForeground #a8a4c8
debugIcon.stepIntoForeground #a8a4c8
debugIcon.stepOutForeground #a8a4c8
debugIcon.stepOverForeground #a8a4c8
debugIcon.stopForeground #fed9b7
debugTokenExpression.boolean #a8a4c8
debugTokenExpression.error #fed9b7
debugTokenExpression.name #8bafae
debugTokenExpression.number #dfc299
debugTokenExpression.string #8fabc8
debugTokenExpression.type #d1bab6
debugTokenExpression.value #8fabc8
debugToolBar.background #000000
debugToolBar.border #3c3746
debugView.exceptionLabelBackground #a25a63
debugView.exceptionLabelForeground #000000
debugView.stateLabelBackground #111111
debugView.stateLabelForeground #e1dfe5
debugView.valueChangedHighlight #8d88b680
descriptionForeground #e1dfe5
diffEditor.border #00000000
diffEditor.diagonalFill #111111
diffEditor.insertedLineBackground #363b2b4d
diffEditor.insertedTextBackground #363b2be6
diffEditor.insertedTextBorder #00000000
diffEditor.move.border #3c3746
diffEditor.moveActive.border #564f64
diffEditor.removedLineBackground #572c324d
diffEditor.removedTextBackground #572c32e6
diffEditor.removedTextBorder #00000000
diffEditor.unchangedCodeBackground #00000000
diffEditor.unchangedRegionBackground #00000000
diffEditor.unchangedRegionForeground #746b84
diffEditor.unchangedRegionShadow #564f64
diffEditorGutter.insertedLineBackground #363b2b4d
diffEditorGutter.removedLineBackground #572c324d
diffEditorOverview.insertedForeground #363b2be6
diffEditorOverview.removedForeground #572c32e6
disabledForeground #564f64
dropdown.background #111111
dropdown.border #3c3746
dropdown.foreground #e1dfe5
dropdown.listBackground #111111
editor.background #000000
editor.findMatchBackground #00000000
editor.findMatchBorder #bfa481
editor.findMatchForeground #8bafae
editor.findMatchHighlightBackground #564f64c0
editor.findMatchHighlightBorder #749392
editor.findMatchHighlightForeground #eedeca
editor.findRangeHighlightBackground #111111
editor.findRangeHighlightBorder #00000000
editor.focusedStackFrameHighlightBackground #564f64c0
editor.foldBackground #564f641f
editor.foldPlaceholderForeground #746b84
editor.foreground #e1dfe5
editor.hoverHighlightBackground #564f64c0
editor.inactiveSelectionBackground #111111
editor.inlineValuesBackground #00000000
editor.inlineValuesForeground #918a9f
editor.lineHighlightBackground #111111
editor.lineHighlightBorder #00000000
editor.linkedEditingBackground #564f6480
editor.placeholder.foreground #918a9f
editor.rangeHighlightBackground #564f64c0
editor.rangeHighlightBorder #00000000
editor.selectionBackground #564f6480
editor.selectionForeground #ffffff
editor.selectionHighlightBackground #00000000
editor.selectionHighlightBorder #8fabc8
editor.snippetFinalTabstopHighlightBackground #00000000
editor.snippetFinalTabstopHighlightBorder #564f64
editor.snippetTabstopHighlightBackground #564f641f
editor.snippetTabstopHighlightBorder #00000000
editor.stackFrameHighlightBackground #564f6480
editor.symbolHighlightBackground #00000000
editor.symbolHighlightBorder #00000000
editor.wordHighlightBackground #00000000
editor.wordHighlightBorder #a8a4c8
editor.wordHighlightStrongBackground #00000000
editor.wordHighlightStrongBorder #8fabc8
editor.wordHighlightTextBackground #00000000
editor.wordHighlightTextBorder #00000000
editorActionList.background #000000
editorActionList.focusBackground #564f64c0
editorActionList.focusForeground #e1dfe5
editorActionList.foreground #918a9f
editorBracketHighlight.foreground1 #746b84
editorBracketHighlight.foreground2 #fed9b7
editorBracketHighlight.foreground3 #d1bab6
editorBracketHighlight.foreground4 #dfc299
editorBracketHighlight.foreground5 #8fabc8
editorBracketHighlight.foreground6 #8fabc8
editorBracketHighlight.unexpectedBracket.foreground #a25a63
editorBracketMatch.background #000000
editorBracketMatch.border #564f64
editorBracketPairGuide.activeBackground1 #e1dfe500
editorBracketPairGuide.activeBackground2 #e1dfe500
editorBracketPairGuide.activeBackground3 #e1dfe500
editorBracketPairGuide.activeBackground4 #e1dfe500
editorBracketPairGuide.activeBackground5 #e1dfe500
editorBracketPairGuide.activeBackground6 #e1dfe500
editorBracketPairGuide.background1 #e1dfe500
editorBracketPairGuide.background2 #e1dfe500
editorBracketPairGuide.background3 #e1dfe500
editorBracketPairGuide.background4 #e1dfe500
editorBracketPairGuide.background5 #e1dfe500
editorBracketPairGuide.background6 #e1dfe500
editorCodeLens.foreground #918a9f
editorCommentsWidget.rangeActiveBackground #564f64c0
editorCommentsWidget.rangeBackground #564f641f
editorCommentsWidget.replyInputBackground #111111
editorCommentsWidget.resolvedBorder #708b91
editorCommentsWidget.unresolvedBorder #bfa481
editorCursor.background #000000
editorCursor.foreground #aba6b6
editorError.background #00000000
editorError.border #00000000
editorError.foreground #a25a63
editorGhostText.background #00000000
editorGhostText.border #00000000
editorGhostText.foreground #918a9f
editorGroup.border #3c3746
editorGroup.dropBackground #564f64c0
editorGroup.dropIntoPromptBackground #111111
editorGroup.dropIntoPromptBorder #3c3746
editorGroup.dropIntoPromptForeground #918a9f
editorGroup.emptyBackground #000000
editorGroup.focusedEmptyBorder #564f64
editorGroupHeader.border #00000000
editorGroupHeader.noTabsBackground #000000
editorGroupHeader.tabsBackground #000000
editorGroupHeader.tabsBorder #3c3746
editorGutter.addedBackground #8fabc8
editorGutter.background #00000000
editorGutter.commentGlyphForeground #000000
editorGutter.commentRangeForeground #564f64c0
editorGutter.commentUnresolvedGlyphForeground #000000
editorGutter.deletedBackground #fed9b7
editorGutter.foldingControlForeground #918a9f
editorGutter.modifiedBackground #dfc299
editorHint.border #00000000
editorHint.foreground #708b91
editorHoverWidget.background #000000
editorHoverWidget.border #3c3746
editorHoverWidget.foreground #e1dfe5
editorHoverWidget.highlightForeground #e1dfe5
editorHoverWidget.statusBarBackground #000000
editorIndentGuide.activeBackground1 #564f64
editorIndentGuide.activeBackground2 #564f64
editorIndentGuide.activeBackground3 #564f64
editorIndentGuide.activeBackground4 #564f64
editorIndentGuide.activeBackground5 #564f64
editorIndentGuide.activeBackground6 #564f64
editorIndentGuide.background1 #3c374680
editorIndentGuide.background2 #3c374680
editorIndentGuide.background3 #3c374680
editorIndentGuide.background4 #3c374680
editorIndentGuide.background5 #3c374680
editorIndentGuide.background6 #3c374680
editorInfo.background #00000000
editorInfo.border #00000000
editorInfo.foreground #7790a8
editorInlayHint.background #00000000
editorInlayHint.foreground #564f64
editorInlayHint.parameterBackground #00000000
editorInlayHint.parameterForeground #564f64
editorInlayHint.typeBackground #00000000
editorInlayHint.typeForeground #564f64
editorLightBulb.foreground #dfc299
editorLightBulbAi.foreground #dfc299
editorLightBulbAutoFix.foreground #dfc299
editorLineNumber.activeForeground #e1dfe5
editorLineNumber.dimmedForeground #918a9f
editorLineNumber.foreground #564f64
editorLink.activeForeground #e1dfe5
editorMarkerNavigation.background #000000
editorMarkerNavigationError.background #a25a63
editorMarkerNavigationError.headerBackground #a25a631f
editorMarkerNavigationInfo.background #7790a8
editorMarkerNavigationInfo.headerBackground #7790a81f
editorMarkerNavigationWarning.background #bfa481
editorMarkerNavigationWarning.headerBackground #bfa4811f
editorMultiCursor.primary.background #000000
editorMultiCursor.primary.foreground #aba6b6
editorMultiCursor.secondary.background #000000
editorMultiCursor.secondary.foreground #aba6b6
editorOverviewRuler.addedForeground #708b9180
editorOverviewRuler.background #00000000
editorOverviewRuler.border #000000
editorOverviewRuler.bracketMatchForeground #746b84
editorOverviewRuler.commentForeground #708b914d
editorOverviewRuler.commentUnresolvedForeground #bfa4814d
editorOverviewRuler.commonContentForeground #00000000
editorOverviewRuler.currentContentForeground #8d88b64d
editorOverviewRuler.deletedForeground #a25a6380
editorOverviewRuler.errorForeground #a25a63
editorOverviewRuler.findMatchForeground #bfa481
editorOverviewRuler.incomingContentForeground #7493924d
editorOverviewRuler.infoForeground #7790a8
editorOverviewRuler.inlineChatInserted #708b91
editorOverviewRuler.inlineChatRemoved #a25a63
editorOverviewRuler.modifiedForeground #bfa481
editorOverviewRuler.rangeHighlightForeground #7790a8
editorOverviewRuler.selectionHighlightForeground #8bafae
editorOverviewRuler.warningForeground #bfa481
editorOverviewRuler.wordHighlightForeground #746b84
editorOverviewRuler.wordHighlightStrongForeground #746b84
editorOverviewRuler.wordHighlightTextForeground #a8a4c8
editorPane.background #000000
editorRuler.foreground #564f64
editorStickyScroll.background #000000
editorStickyScroll.border #00000000
editorStickyScroll.shadow #121017
editorStickyScrollHover.background #564f64c0
editorSuggestWidget.background #000000
editorSuggestWidget.border #3c3746
editorSuggestWidget.focusHighlightForeground #8fabc8
editorSuggestWidget.foreground #e1dfe5
editorSuggestWidget.highlightForeground #7790a8
editorSuggestWidget.selectedBackground #564f64c0
editorSuggestWidget.selectedForeground #e1dfe5
editorSuggestWidget.selectedIconForeground #aba6b6
editorSuggestWidgetStatus.foreground #746b84
editorUnicodeHighlight.background #000000
editorUnicodeHighlight.border #3c3746
editorUnnecessaryCode.border #00000000
editorUnnecessaryCode.opacity #e1dfe580
editorWarning.background #00000000
editorWarning.border #00000000
editorWarning.foreground #bfa481
editorWatermark.foreground #918a9f
editorWhitespace.foreground #564f64
editorWidget.background #111111
editorWidget.border #564f64
editorWidget.foreground #918a9f
editorWidget.resizeBorder #3c3746
errorForeground #fed9b7
extensionBadge.remoteBackground #918a9f
extensionBadge.remoteForeground #000000
extensionButton.background #749392
extensionButton.foreground #000000
extensionButton.hoverBackground #8bafae
extensionButton.prominentBackground #749392
extensionButton.prominentForeground #000000
extensionButton.prominentHoverBackground #8bafae
extensionButton.separator #564f64
extensionIcon.preReleaseForeground #a8a4c8
extensionIcon.sponsorForeground #fed9b7
extensionIcon.starForeground #564f64
extensionIcon.verifiedForeground #8fabc8
focusBorder #564f64
foreground #e1dfe5
gitDecoration.addedResourceForeground #708b91
gitDecoration.conflictingResourceForeground #8d88b6
gitDecoration.deletedResourceForeground #a25a63
gitDecoration.ignoredResourceForeground #564f64
gitDecoration.modifiedResourceForeground #bfa481
gitDecoration.renamedResourceForeground #bfa481
gitDecoration.stageDeletedResourceForeground #a25a63
gitDecoration.stageModifiedResourceForeground #bfa481
gitDecoration.submoduleResourceForeground #746b84
gitDecoration.untrackedResourceForeground #708b91
icon.foreground #aba6b6
inlineChat.background #111111
inlineChat.border #3c3746
inlineChat.foreground #e1dfe5
inlineChat.shadow #121017
inlineChatDiff.inserted #363b2bb3
inlineChatDiff.removed #572c32b3
inlineChatInput.background #111111
inlineChatInput.border #3c3746
inlineChatInput.focusBorder #564f64
inlineChatInput.placeholderForeground #746b84
input.background #111111
input.border #3c3746
input.foreground #e1dfe5
input.placeholderForeground #746b84
inputOption.activeBackground #749392
inputOption.activeBorder #00000000
inputOption.activeForeground #000000
inputOption.hoverBackground #564f6480
inputValidation.errorBackground #111111
inputValidation.errorBorder #fed9b7
inputValidation.errorForeground #fed9b7
inputValidation.infoBackground #111111
inputValidation.infoBorder #918a9f
inputValidation.infoForeground #918a9f
inputValidation.warningBackground #111111
inputValidation.warningBorder #dfc299
inputValidation.warningForeground #dfc299
interactive.activeCodeBorder #564f64
interactive.inactiveCodeBorder #3c3746
keybindingLabel.background #000000
keybindingLabel.border #111111
keybindingLabel.bottomBorder #3c3746
keybindingLabel.foreground #918a9f
keybindingTable.headerBackground #00000000
keybindingTable.rowsBackground #00000000
list.activeSelectionBackground #564f64c0
list.activeSelectionForeground #e1dfe5
list.activeSelectionIconForeground #aba6b6
list.deemphasizedForeground #746b84
list.dropBackground #564f64c0
list.dropBetweenBackground #564f64
list.errorForeground #fed9b7
list.filterMatchBackground #564f64b3
list.filterMatchBorder #00000000
list.focusAndSelectionOutline #00000000
list.focusBackground #564f6480
list.focusForeground #e1dfe5
list.focusHighlightForeground #8fabc8
list.focusOutline #00000000
list.highlightForeground #8fabc8
list.hoverBackground #564f64c0
list.hoverForeground #e1dfe5
list.inactiveFocusBackground #564f6480
list.inactiveFocusOutline #00000000
list.inactiveSelectionBackground #564f64c0
list.inactiveSelectionForeground #e1dfe5
list.inactiveSelectionIconForeground #aba6b6
list.invalidItemForeground #a25a63
list.warningForeground #dfc299
listFilterWidget.background #111111
listFilterWidget.noMatchesOutline #fed9b7
listFilterWidget.outline #3c3746
listFilterWidget.shadow #121017
menu.background #111111
menu.border #3c3746
menu.foreground #e1dfe5
menu.selectionBackground #564f64c0
menu.selectionBorder #00000000
menu.selectionForeground #e1dfe5
menu.separatorBackground #3c3746
menubar.selectionBackground #564f64c0
menubar.selectionBorder #00000000
menubar.selectionForeground #e1dfe5
merge.border #00000000
merge.commonContentBackground #00000000
merge.commonHeaderBackground #00000000
merge.currentContentBackground #8d88b61f
merge.currentHeaderBackground #8d88b64d
merge.incomingContentBackground #7493921f
merge.incomingHeaderBackground #7493924d
mergeEditor.change.background #000000
mergeEditor.change.word.background #111111
mergeEditor.changeBase.background #00000000
mergeEditor.changeBase.word.background #00000000
mergeEditor.conflict.handled.minimapOverViewRuler #8fabc8
mergeEditor.conflict.handledFocused.border #8fabc8
mergeEditor.conflict.handledUnfocused.border #8fabc8
mergeEditor.conflict.input1.background #00000000
mergeEditor.conflict.input2.background #00000000
mergeEditor.conflict.unhandled.minimapOverViewRuler #fed9b7
mergeEditor.conflict.unhandledFocused.border #fed9b7
mergeEditor.conflict.unhandledUnfocused.border #fed9b7
mergeEditor.conflictingLines.background #000000
minimap.background #00000000
minimap.errorHighlight #a25a63
minimap.findMatchHighlight #bfa481
minimap.foregroundOpacity #000000e6
minimap.infoHighlight #7790a8
minimap.selectionHighlight #564f64b3
minimap.selectionOccurrenceHighlight #564f64b3
minimap.warningHighlight #bfa481
minimapGutter.addedBackground #708b91
minimapGutter.deletedBackground #a25a63
minimapGutter.modifiedBackground #bfa481
minimapSlider.activeBackground #564f64b3
minimapSlider.background #564f6480
minimapSlider.hoverBackground #564f64b3
multiDiffEditor.background #111111
multiDiffEditor.border #3c3746
multiDiffEditor.headerBackground #111111
notebook.cellBorderColor #3c3746
notebook.cellEditorBackground #000000
notebook.cellHoverBackground #564f64c0
notebook.cellInsertionIndicator #918a9f
notebook.cellStatusBarItemHoverBackground #564f64c0
notebook.cellToolbarSeparator #3c3746
notebook.editorBackground #000000
notebook.focusedCellBackground #00000000
notebook.focusedCellBorder #3c3746
notebook.focusedEditorBorder #564f64
notebook.inactiveFocusedCellBorder #3c3746
notebook.inactiveSelectedCellBorder #3c3746
notebook.outputContainerBackgroundColor #00000000
notebook.outputContainerBorderColor #3c3746
notebook.selectedCellBackground #00000000
notebook.selectedCellBorder #564f64
notebook.symbolHighlightBackground #00000000
notebookEditorOverviewRuler.runningCellForeground #bfa481
notebookScrollbarSlider.activeBackground #564f6480
notebookScrollbarSlider.background #564f64c0
notebookScrollbarSlider.hoverBackground #564f6480
notebookStatusErrorIcon.foreground #fed9b7
notebookStatusRunningIcon.foreground #dfc299
notebookStatusSuccessIcon.foreground #8fabc8
notificationCenter.border #3c3746
notificationCenterHeader.background #000000
notificationCenterHeader.foreground #e1dfe5
notificationLink.foreground #7790a8
notifications.background #000000
notifications.border #3c3746
notifications.foreground #e1dfe5
notificationsErrorIcon.foreground #fed9b7
notificationsInfoIcon.foreground #8fabc8
notificationsWarningIcon.foreground #dfc299
notificationToast.border #3c3746
outputView.background #000000
outputViewStickyScroll.background #000000
panel.background #000000
panel.border #3c3746
panel.dropBorder #564f64
panelInput.border #564f64
panelSection.border #3c3746
panelSection.dropBackground #564f64c0
panelSectionHeader.background #000000
panelSectionHeader.border #3c3746
panelSectionHeader.foreground #e1dfe5
panelStickyScroll.background #000000
panelStickyScroll.border #00000000
panelStickyScroll.shadow #121017
panelTitle.activeBorder #918a9f
panelTitle.activeForeground #e1dfe5
panelTitle.inactiveForeground #746b84
peekView.border #3c3746
peekViewEditor.background #000000
peekViewEditor.matchHighlightBackground #564f64c0
peekViewEditor.matchHighlightBorder #00000000
peekViewEditorGutter.background #000000
peekViewEditorStickyScroll.background #000000
peekViewResult.background #111111
peekViewResult.fileForeground #918a9f
peekViewResult.lineForeground #746b84
peekViewResult.matchHighlightBackground #564f64c0
peekViewResult.selectionBackground #564f64c0
peekViewResult.selectionForeground #e1dfe5
peekViewTitle.background #000000
peekViewTitleDescription.foreground #918a9f
peekViewTitleLabel.foreground #e1dfe5
pickerGroup.border #3c3746
pickerGroup.foreground #918a9f
ports.iconRunningProcessForeground #dfc299
problemsErrorIcon.foreground #fed9b7
problemsInfoIcon.foreground #8fabc8
problemsWarningIcon.foreground #dfc299
profileBadge.background #918a9f
profileBadge.foreground #000000
profiles.sashBorder #3c3746
progressBar.background #8bafae
quickInput.background #111111
quickInput.foreground #918a9f
quickInputList.focusBackground #564f64c0
quickInputList.focusForeground #e1dfe5
quickInputList.focusIconForeground #aba6b6
quickInputTitle.background #000000
radio.activeBackground #000000
radio.activeBorder #918a9f
radio.activeForeground #aba6b6
radio.inactiveBackground #000000
radio.inactiveBorder #564f64
radio.inactiveForeground #000000
radio.inactiveHoverBackground #564f641f
sash.hoverBorder #918a9f
scmGraph.foreground1 #7790a8
scmGraph.foreground2 #708b91
scmGraph.foreground3 #8d88b6
scmGraph.foreground4 #be76a3
scmGraph.foreground5 #749392
scmGraph.historyItemBaseRefColor #564f64
scmGraph.historyItemHoverAdditionsForeground #8fabc8
scmGraph.historyItemHoverDefaultLabelBackground #749392
scmGraph.historyItemHoverDefaultLabelForeground #e1dfe5
scmGraph.historyItemHoverDeletionsForeground #fed9b7
scmGraph.historyItemHoverLabelForeground #e1dfe5
scmGraph.historyItemRefColor #564f64
scmGraph.historyItemRemoteRefColor #708b91
scrollbar.shadow #121017
scrollbarSlider.activeBackground #564f6480
scrollbarSlider.background #564f64c0
scrollbarSlider.hoverBackground #564f6480
search.resultsInfoForeground #918a9f
searchEditor.findMatchBackground #564f64c0
searchEditor.findMatchBorder #fed9b7
searchEditor.textInputBorder #3c3746
selection.background #564f64c0
settings.checkboxBackground #000000
settings.checkboxBorder #918a9f
settings.checkboxForeground #aba6b6
settings.dropdownBackground #111111
settings.dropdownBorder #3c3746
settings.dropdownForeground #e1dfe5
settings.dropdownListBorder #3c3746
settings.focusedRowBackground #564f64c0
settings.focusedRowBorder #00000000
settings.headerBorder #3c3746
settings.headerForeground #e1dfe5
settings.modifiedItemIndicator #dfc299
settings.numberInputBackground #111111
settings.numberInputBorder #3c3746
settings.numberInputForeground #e1dfe5
settings.rowHoverBackground #564f641f
settings.sashBorder #3c3746
settings.settingsHeaderHoverForeground #918a9f
settings.textInputBackground #111111
settings.textInputBorder #3c3746
settings.textInputForeground #e1dfe5
sideBar.background #000000
sideBar.border #3c3746
sideBar.dropBackground #564f64c0
sideBar.foreground #918a9f
sideBarActivityBarTop.border #3c3746
sideBarSectionHeader.background #111111
sideBarSectionHeader.border #00000000
sideBarSectionHeader.foreground #918a9f
sideBarStickyScroll.background #000000
sideBarStickyScroll.border #00000000
sideBarStickyScroll.shadow #121017
sideBarTitle.background #000000
sideBarTitle.foreground #918a9f
sideBySideEditor.horizontalBorder #3c3746
sideBySideEditor.verticalBorder #3c3746
simpleFindWidget.sashBorder #3c3746
statusBar.background #000000
statusBar.border #3c3746
statusBar.debuggingBackground #8d88b6
statusBar.debuggingBorder #3c3746
statusBar.debuggingForeground #000000
statusBar.focusBorder #3c3746
statusBar.foreground #918a9f
statusBar.noFolderBackground #000000
statusBar.noFolderBorder #3c3746
statusBar.noFolderForeground #918a9f
statusBarItem.activeBackground #564f64c0
statusBarItem.compactHoverBackground #564f64b3
statusBarItem.errorBackground #fed9b7
statusBarItem.errorForeground #000000
statusBarItem.errorHoverBackground #cd9ca1
statusBarItem.errorHoverForeground #000000
statusBarItem.focusBorder #3c3746
statusBarItem.hoverBackground #564f6480
statusBarItem.hoverForeground #e1dfe5
statusBarItem.offlineBackground #dfc299
statusBarItem.offlineForeground #000000
statusBarItem.offlineHoverBackground #eedeca
statusBarItem.offlineHoverForeground #000000
statusBarItem.prominentBackground #8d88b6
statusBarItem.prominentForeground #000000
statusBarItem.prominentHoverBackground #a8a4c8
statusBarItem.prominentHoverForeground #000000
statusBarItem.remoteBackground #111111
statusBarItem.remoteForeground #918a9f
statusBarItem.remoteHoverBackground #564f6480
statusBarItem.remoteHoverForeground #e1dfe5
statusBarItem.warningBackground #dfc299
statusBarItem.warningForeground #000000
statusBarItem.warningHoverBackground #eedeca
statusBarItem.warningHoverForeground #000000
symbolIcon.arrayForeground #564f64
symbolIcon.booleanForeground #564f64
symbolIcon.classForeground #564f64
symbolIcon.colorForeground #564f64
symbolIcon.constantForeground #564f64
symbolIcon.constructorForeground #564f64
symbolIcon.enumeratorForeground #564f64
symbolIcon.enumeratorMemberForeground #564f64
symbolIcon.eventForeground #564f64
symbolIcon.fieldForeground #564f64
symbolIcon.fileForeground #564f64
symbolIcon.folderForeground #564f64
symbolIcon.functionForeground #564f64
symbolIcon.interfaceForeground #564f64
symbolIcon.keyForeground #564f64
symbolIcon.keywordForeground #564f64
symbolIcon.methodForeground #564f64
symbolIcon.moduleForeground #564f64
symbolIcon.namespaceForeground #564f64
symbolIcon.nullForeground #564f64
symbolIcon.numberForeground #564f64
symbolIcon.objectForeground #564f64
symbolIcon.operatorForeground #564f64
symbolIcon.packageForeground #564f64
symbolIcon.propertyForeground #564f64
symbolIcon.referenceForeground #564f64
symbolIcon.snippetForeground #564f64
symbolIcon.stringForeground #564f64
symbolIcon.structForeground #564f64
symbolIcon.textForeground #564f64
symbolIcon.typeParameterForeground #564f64
symbolIcon.unitForeground #564f64
symbolIcon.variableForeground #564f64
tab.activeBackground #564f64c0
tab.activeBorder #918a9f
tab.activeBorderTop #00000000
tab.activeForeground #e1dfe5
tab.activeModifiedBorder #00000000
tab.border #00000000
tab.dragAndDropBorder #918a9f
tab.hoverBackground #564f6480
tab.hoverBorder #564f64
tab.hoverForeground #918a9f
tab.inactiveBackground #000000
tab.inactiveForeground #746b84
tab.inactiveModifiedBorder #00000000
tab.lastPinnedBorder #564f64
tab.selectedBackground #564f64c0
tab.selectedBorderTop #00000000
tab.selectedForeground #e1dfe5
tab.unfocusedActiveBackground #564f64c0
tab.unfocusedActiveBorder #564f64
tab.unfocusedActiveBorderTop #00000000
tab.unfocusedActiveForeground #746b84
tab.unfocusedActiveModifiedBorder #00000000
tab.unfocusedHoverBackground #564f6480
tab.unfocusedHoverBorder #564f64
tab.unfocusedHoverForeground #918a9f
tab.unfocusedInactiveBackground #000000
tab.unfocusedInactiveForeground #564f64
tab.unfocusedInactiveModifiedBorder #00000000
terminal.ansiBlack #1d1a23
terminal.ansiBlue #7790a8
terminal.ansiBrightBlack #746b84
terminal.ansiBrightBlue #6c9edd
terminal.ansiBrightCyan #4eb1b1
terminal.ansiBrightGreen #6bc46d
terminal.ansiBrightMagenta #a48ade
terminal.ansiBrightRed #e16f6f
terminal.ansiBrightWhite #e1dfe5
terminal.ansiBrightYellow #f0bf5e
terminal.ansiCyan #2c8585
terminal.ansiGreen #708b91
terminal.ansiMagenta #8d88b6
terminal.ansiRed #a25a63
terminal.ansiWhite #918a9f
terminal.ansiYellow #bfa481
terminal.background #000000
terminal.border #3c3746
terminal.dropBackground #564f64c0
terminal.findMatchBackground #a8a4c84d
terminal.findMatchBorder #fed9b7
terminal.findMatchHighlightBackground #564f6480
terminal.findMatchHighlightBorder #a8a4c8
terminal.foreground #e1dfe5
terminal.hoverHighlightBackground #564f64c0
terminal.inactiveSelectionBackground #564f64c0
terminal.initialHintForeground #918a9f
terminal.selectionBackground #564f64c0
terminal.tab.activeBorder #918a9f
terminalCommandDecoration.defaultBackground #111111
terminalCommandDecoration.errorBackground #a25a63
terminalCommandDecoration.successBackground #708b91
terminalCommandGuide.foreground #749392
terminalCursor.background #111111
terminalCursor.foreground #918a9f
terminalOverviewRuler.border #00000000
terminalOverviewRuler.cursorForeground #564f6480
terminalOverviewRuler.findMatchForeground #bfa481
terminalStickyScroll.background #000000
terminalStickyScroll.border #00000000
terminalStickyScrollHover.background #564f64c0
testing.coverCountBadgeBackground #918a9f
testing.coverCountBadgeForeground #000000
testing.coveredBackground #363b2b4d
testing.coveredBorder #00000000
testing.coveredGutterBackground #363b2b4d
testing.iconErrored #fed9b7
testing.iconErrored.retired #fed9b7
testing.iconFailed #fed9b7
testing.iconFailed.retired #fed9b7
testing.iconPassed #8fabc8
testing.iconPassed.retired #8fabc8
testing.iconQueued #a8a4c8
testing.iconQueued.retired #a8a4c8
testing.iconSkipped #dfc299
testing.iconSkipped.retired #dfc299
testing.iconUnset #746b84
testing.iconUnset.retired #746b84
testing.message.error.decorationForeground #fed9b7
testing.message.error.lineBackground #fed9b7
testing.message.info.decorationForeground #8fabc8
testing.message.info.lineBackground #8fabc8
testing.messagePeekBorder #3c3746
testing.messagePeekHeaderBackground #00000000
testing.peekBorder #3c3746
testing.peekHeaderBackground #00000000
testing.runAction #8fabc8
testing.uncoveredBackground #572c324d
testing.uncoveredBorder #00000000
testing.uncoveredBranchBackground #572c324d
testing.uncoveredGutterBackground #572c324d
textBlockQuote.background #111111
textBlockQuote.border #3c3746
textCodeBlock.background #111111
textLink.activeForeground #8fabc8
textLink.foreground #7790a8
textPreformat.background #111111
textPreformat.foreground #e5afa9
textSeparator.foreground #564f64
titleBar.activeBackground #000000
titleBar.activeForeground #918a9f
titleBar.border #3c3746
titleBar.inactiveBackground #000000
titleBar.inactiveForeground #918a9f
toolbar.activeBackground #564f6480
toolbar.hoverBackground #564f6480
toolbar.hoverOutline #00000000
tree.inactiveIndentGuidesStroke #3c3746
tree.indentGuidesStroke #564f64
tree.tableColumnsBorder #3c3746
tree.tableOddRowsBackground #00000000
walkThrough.embeddedEditorBackground #000000
walkthrough.stepTitle.foreground #e1dfe5
welcomePage.background #000000
welcomePage.progress.background #564f64c0
welcomePage.progress.foreground #8fabc8
welcomePage.tileBackground #564f64c0
welcomePage.tileBorder #00000000
welcomePage.tileHoverBackground #564f6480
widget.border #3c3746
widget.shadow #121017
window.activeBorder #00000000
window.inactiveBorder #00000000 #746B84
constant, support.constant, variable.arguments #E1DFE5 —
constant.rgb-value #E1DFE5 —
entity.name.selector #8BAFAE —
entity.name.tag, punctuation.tag #fed9b7 —
invalid, invalid.illegal #A25A63 —
invalid.deprecated #8D88B6 —
meta.preprocessor #d1bab6 —
meta.preprocessor.string #8fabc8 —
meta.preprocessor.numeric #8fabc8 —
storage, storage.type.function, keyword.control #8D88B6 —
support.type.property-name #749392 —
keyword.control.module #8BAFAE —
keyword.control.less #DFC299 —
keyword.operator.new #918A9F —
keyword.other.unit #918A9F —
support.function.git-rebase #749392 —
constant.sha.git-rebase #8fabc8 —
meta.type.name, meta.return.type, meta.return-type, meta.cast, meta.type.annotation, support.type, storage.type.cs, variable.class #DFC299 —
variable.this, support.variable #A8A4C8 —
entity.name, entity.static, entity.name.class.static.function, entity.name.function, entity.name.class, entity.name.type #E1DFE5 —
entity.function, entity.name.function.static #8BAFAE —
entity.name.function.function-call #8BAFAE —
support.function.builtin #918A9F —
entity.name.method, entity.name.method.function-call, entity.name.static.function-call #749392 —
meta.parameter.type.variable, variable.parameter, variable.name, variable.other, variable, string.constant.other.placeholder #8FABC8 —
storage.type.class #fed9b7 —
punctuation, attribute_value, meta.tag.other #746B84 —
punctuation.quoted #E1DFE5 —
punctuation.quasi #fed9b7 —
*url*, *link*, *uri* — underline
source.python, meta.function-call.arguments #8FABC8 —
meta.function.python, entity.name.function.python #DFC299 —
storage.type.function.python, storage.modifier.declaration, storage.type.class.python #fed9b7 —
meta.function-call.generic #E1DFE5 —
entity.name.function.decorator #DFC299 bold
support.type.exception.python #918A9F —
entity.name.command.shell, entity.name.function.call.shell #DFC299 —
keyword.operator.logical #746B84 —
punctuation.definition.logical-expression #d1bab6 —
string.inperpolated.dollar.shell #d1bab6 —
string.interpolated.dollar.shell, string.interpolated.backtick.shell #8BAFAE —
string.unquoted.argument.shell #E1DFE5 —
keyword.control.directive #8BAFAE —
support.function.C99 #DFC299 —
meta.function.cs, entity.name.function.cs, entity.name.type.namespace.cs #8fabc8 —
keyword.other.using.cs, entity.name.variable.field.cs, entity.name.variable.local.cs, variable.other.readwrite.cs #8BAFAE —
keyword.other.this.cs, keyword.other.base.cs #A8A4C8 —
meta.scope.prerequisites #DFC299 —
entity.name.function.target #8fabc8 bold
storage.modifier.import.java, storage.modifier.package.java #918A9F —
keyword.other.import.java, keyword.other.package.java #8BAFAE —
storage.type.java #DFC299 —
storage.type.annotation #8FABC8 bold
keyword.other.documentation.javadoc #8BAFAE —
comment.block.javadoc variable.parameter.java #8fabc8 bold
source.java variable.other.object, source.java variable.other.definition.java #E1DFE5 —
meta.function-parameters.lisp #DFC299 —
markup.underline — underline
string.other.link.title.markdown #E1DFE5 —
markup.underline.link #A8A4C8 —
markup.heading.markdown, entity.name.section.markdown #e5afa9 —
support.function.text.markdown.notes.wiki-link.title, string.other.link #d1bab6 —
markup.italic #DFC299 italic
markup.strikethrough.markdown, punctuation.definition.strikethrough.markdown #746B84 —
markup.inline.raw, markup.fenced_code.block #8fabc8 —
text.markdown.notes.tag #8FABC8 —
punctuation.definition.list.begin.markdown, markup.quote.markdown, punctuation.definition.heading.markdown, punctuation.definition.wiki-link, punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown, punctuation.definition.metadata.markdown, punctuation.definition.italic.markdown, punctuation.definition.bold.markdown #746B84 —
keyword.control.mermaid #A8A4C8 —
entity.name.type.class.mermaid #DFC299 —
storage.type.mermaid #8BAFAE —
entity.name.function.mermaid #d1bab6 —
punctuation.parenthesis.open.mermaid #8fabc8 —
string.quoted.double.json #E1DFE5 —
source.json meta.structure.dictionary.json support.type.property-name.json #fed9b7 —
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json #d1bab6 —
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 #DFC299 —
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 #8fabc8 —
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 meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json #8FABC8 —
string.quoted.double.scss #d1bab6 —
entity.other.attribute-name.class.css #DFC299 —
entity.name.tag.css #8fabc8 —
entity.name.tag.reference.scss, entity.name.tag.wildcard.scss, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.parent-selector-suffix.css, punctuation.definition.entity.css, source.css.scss, entity.name.tag.custom.scss #8BAFAE —
variable.css, variable.scss #8FABC8 —
support.type.property-name.css, meta.property-name.scss, support.type.property-name.media.css, source.css.scss #A8A4C8 —
source.css support.function.transform, source.css support.function.timing-function, source.css support.function.misc, punctuation.definition.keyword.scss, keyword.control.at-rule.media.scss, keyword.control.at-rule.mixin.scss, keyword.control.else.scss, keyword.control.if.scss, keyword.control.content.scss, keyword.operator.logical.scss #e5afa9 —
punctuation.definition.tag #746B84 —
text.html punctuation.tag #fed9b7 —
string.quoted.double.html, string.quoted.double.xml, string.quoted.double.js #e5afa9 —
entity.other.attribute-name, entity.other.attribute-name.html #A8A4C8 —
entity.other.attribute-name.class.pug #DFC299 —
meta.directive.vue #8BAFAE —
source.js, source.ts #918A9F —
entity.name.type.class.js #DFC299 —
variable.other.property.js #8BAFAE —
meta.object-literal.key.js #E1DFE5 —
punctuation.definition.block.tag.jsdoc, storage.type.class.jsdoc #8D88B6 —
entity.name.type.instance.jsdoc #918A9F —
variable.other.jsdoc #7790A8 —
source.go storage.type #DFC299 —
source.go entity.name.import #8fabc8 —
source.go keyword.package, source.go keyword.import #8BAFAE —
source.go keyword.interface, source.go keyword.struct #8FABC8 —
source.go entity.name.type #E1DFE5 —
source.go entity.name.function #A8A4C8 —
keyword.control.cucumber.table #8FABC8 —
source.reason string.double, source.reason string.regexp #8fabc8 —
source.reason keyword.control.less #8BAFAE —
source.reason entity.name.function #8FABC8 —
source.reason support.property-value, source.reason entity.name.filename #d1bab6 —
source.powershell variable.other.member.powershell #d1bab6 —
source.powershell support.function.powershell #DFC299 —
source.powershell support.function.attribute.powershell #918A9F —
source.powershell meta.hashtable.assignment.powershell variable.other.readwrite.powershell #d1bab6 —
token.error-token #F44747 —
token.debug-token #B267E6 —
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 } ! ` ;
}
Ln 5, Col 12
Spaces: 2
UTF-8
LF
TypeScript
Dark+
fetchUser.ts
index.ts
README.md
src
components
fetchUser.ts
Button.tsx
Modal.tsx
hooks
utils
index.ts
public
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
31
32
33
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 $
package.json
tsconfig.json
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 } ! ` ;
}