Skip to main content
Home Theme VS Code Minimal Dark for VSCode After 5 years Minimal Dark is back, now for VSCode!
VS Code preview Full workbench mockup using this variant's colors and tokenColors.
colors Workbench UI color keys from the theme JSON colors map.
activityBar.activeBackground #00000000 activityBar.background #47484b activityBar.border #00000000 activityBar.foreground #adb9bd activityBar.inactiveForeground #ffffff7e activityBarBadge.background #3c3f41 tokenColors TextMate scopes and font styles (syntax highlighting rules).
scope foreground fontStyle punctuation.definition.delayed.unison,punctuation.definition.list.begin.unison,punctuation.definition.list.end.unison,punctuation.definition.ability.begin.unison,punctuation.definition.ability.end.unison,punctuation.operator.assignment.as.unison,punctuation.separator.pipe.unison,punctuation.separator.delimiter.unison,punctuation.definition.hash.unison #1d8597 — variable.other.generic-type.haskell #367599 — storage.type.haskell #12c3bf — support.variable.magic.python
Shiki preview TypeScript sample highlighted with this variant's colors and tokenColors.
Minimal Dark for VSCode — Minimal Dark
activityBarBadge.foreground #ffffff
badge.background #4d4d4d
badge.foreground #ffffff
breadcrumb.activeSelectionForeground #ffffff
breadcrumb.background #3c3f41
breadcrumb.focusForeground #ffffff
breadcrumb.foreground #adb9bd
button.background #367599
button.foreground #ffffff
button.hoverBackground #1177bb
button.secondaryBackground #313131
button.secondaryForeground #ffffff
button.secondaryHoverBackground #2a2d2e
checkbox.background #3c3f41
checkbox.border #ff000000
checkbox.foreground #adb9bd
debugExceptionWidget.background #313131
debugExceptionWidget.border #313131
debugToolBar.background #313131
debugToolBar.border #313131
diffEditor.border #00000000
diffEditor.insertedTextBackground #0095841c
diffEditor.insertedTextBorder #00000000
diffEditor.removedTextBackground #e3000024
dropdown.background #3c3f41
dropdown.border #ff000000
dropdown.foreground #adb9bd
editor.background #3c3f41
editor.findMatchBackground #515c6a
editor.findMatchBorder #74879f
editor.findMatchHighlightBackground #ea5c0055
editor.findMatchHighlightBorder #ffffff00
editor.findRangeHighlightBackground #3a3d4166
editor.findRangeHighlightBorder #ffffff00
editor.foldBackground #264f784d
editor.foreground #999999
editor.hoverHighlightBackground #264f7840
editor.inactiveSelectionBackground #3a3d41
editor.lineHighlightBackground #00000000
editor.lineHighlightBorder #00000000
editor.rangeHighlightBackground #ffffff0b
editor.rangeHighlightBorder #ffffff00
editor.selectionBackground #000000ab
editor.selectionHighlightBackground #add6ff26
editor.selectionHighlightBorder #495F77
editor.wordHighlightBackground #343739
editor.wordHighlightBorder #343739
editor.wordHighlightStrongBackground #004972b8
editorBracketMatch.background #0064001a
editorBracketMatch.border #888888
editorCodeLens.foreground #999999
editorCursor.background #000000
editorCursor.foreground #ffffff
editorError.background #B73A3400
editorError.border #ffffff00
editorError.foreground #f48771
editorGroup.border #444444
editorGroup.emptyBackground #3c3f41
editorGroupHeader.border #00000000
editorGroupHeader.tabsBackground #3c3f41
editorGroupHeader.tabsBorder #00000000
editorGutter.addedBackground #587c0c
editorGutter.background #3c3f41
editorGutter.commentRangeForeground #c5c5c5
editorGutter.deletedBackground #94151b
editorGutter.foldingControlForeground #c5c5c5
editorGutter.modifiedBackground #0c7d9d
editorHoverWidget.background #252526
editorHoverWidget.border #454545
editorHoverWidget.foreground #cccccc
editorIndentGuide.activeBackground #707070
editorIndentGuide.background #404040
editorInfo.background #4490BF00
editorInfo.border #4490BF00
editorInfo.foreground #75beff
editorLineNumber.activeForeground #ffffff
editorLineNumber.foreground #656565
editorLink.activeForeground #4e94ce
editorMarkerNavigation.background #37373d
editorMarkerNavigationError.background #e37000
editorMarkerNavigationInfo.background #00c8e9
editorMarkerNavigationWarning.background #c5c300
editorOverviewRuler.background #25252500
editorOverviewRuler.border #7f7f7f4d
editorRuler.foreground #5a5a5a
editorSuggestWidget.background #313131
editorSuggestWidget.border #313131
editorSuggestWidget.foreground #adb9bd
editorSuggestWidget.highlightForeground #3492c7
editorSuggestWidget.selectedBackground #2a2d2e
editorWarning.background #A9904000
editorWarning.border #ffffff00
editorWarning.foreground #cca700
editorWhitespace.foreground #e3e4e229
editorWidget.background #313131
editorWidget.foreground #adb9bd
editorWidget.resizeBorder #5F5F5F
focusBorder #00000000
foreground #cccccc
gitDecoration.addedResourceForeground #81b88b
gitDecoration.conflictingResourceForeground #6c6cc4
gitDecoration.deletedResourceForeground #c74e39
gitDecoration.ignoredResourceForeground #8c8c8c
gitDecoration.modifiedResourceForeground #e2c08d
gitDecoration.stageDeletedResourceForeground #c74e39
gitDecoration.stageModifiedResourceForeground #e2c08d
gitDecoration.submoduleResourceForeground #8db9e2
gitDecoration.untrackedResourceForeground #73c991
icon.foreground #cccccc
input.background #3c3f41
input.border #ff000000
input.foreground #adb9bd
input.placeholderForeground #adb9bd6a
inputOption.activeBackground #367599
inputOption.activeBorder #00000000
inputOption.activeForeground #ffffff
list.activeSelectionBackground #313131
list.activeSelectionForeground #8cd7f9
list.dropBackground #383b3d
list.focusBackground #062f4a
list.focusForeground #cccccc
list.highlightForeground #0097fb
list.hoverBackground #2a2d2e
list.hoverForeground #cccccc
list.inactiveSelectionBackground #343739
list.inactiveSelectionForeground #a2cde5
listFilterWidget.background #653723
listFilterWidget.noMatchesOutline #be1100
listFilterWidget.outline #00000000
menu.background #3c3f41
menu.border #00000000
menu.foreground #adb9bd
menu.selectionBackground #37373d
menu.selectionBorder #06060600
menu.selectionForeground #a2cde5
menu.separatorBackground #adb9bd
menubar.selectionBackground #ffffff1a
menubar.selectionBorder #00000000
menubar.selectionForeground #cccccc
merge.commonContentBackground #1d1d1d
merge.commonHeaderBackground #282828
merge.currentContentBackground #004f46
merge.currentHeaderBackground #006d60
merge.incomingContentBackground #28384B
merge.incomingHeaderBackground #395F8F
minimap.background #3c3f41
minimap.errorHighlight #f48771
minimap.findMatchHighlight #515c6a
minimap.selectionHighlight #000000ab
minimap.warningHighlight #cca700
minimapGutter.addedBackground #587c0c
minimapGutter.deletedBackground #94151b
minimapGutter.modifiedBackground #0c7d9d
notificationCenter.border #313131
notificationCenterHeader.background #313131
notificationCenterHeader.foreground #ffffff
notifications.background #313131
notifications.border #666666
notifications.foreground #adb9bd
notificationsErrorIcon.foreground #e37000
notificationsInfoIcon.foreground #a2cde5
notificationsWarningIcon.foreground #c5c300
notificationToast.border #313131
panel.background #313131
panel.border #80808059
panelSection.border #80808059
panelTitle.activeBorder #e7e7e7
panelTitle.activeForeground #e7e7e7
panelTitle.inactiveForeground #e7e7e799
peekView.border #007acc
peekViewEditor.background #001f33
peekViewEditor.matchHighlightBackground #ff8f0099
peekViewEditor.matchHighlightBorder #ee931e
peekViewEditorGutter.background #001f33
peekViewResult.background #252526
peekViewResult.fileForeground #ffffff
peekViewResult.lineForeground #bbbbbb
peekViewResult.matchHighlightBackground #ea5c004d
peekViewResult.selectionBackground #3399ff33
peekViewResult.selectionForeground #ffffff
peekViewTitle.background #1e1e1e
peekViewTitleDescription.foreground #ccccccb3
peekViewTitleLabel.foreground #ffffff
pickerGroup.border #3492c7
pickerGroup.foreground #3492c7
progressBar.background #313131
scrollbar.shadow #00000000
scrollbarSlider.activeBackground #2a2d2e
scrollbarSlider.background #313131
scrollbarSlider.hoverBackground #2a2d2e
selection.background #313131
settings.focusedRowBackground #ffffff07
settings.headerForeground #cccccc
sideBar.background #3c3f41
sideBar.border #3c3f41
sideBar.dropBackground #383b3d
sideBar.foreground #adb9bd
sideBarSectionHeader.background #00000000
sideBarSectionHeader.border #00000000
sideBarSectionHeader.foreground #adb9bd
sideBarTitle.foreground #ffffff
statusBar.background #1c1c1e
statusBar.debuggingBackground #e37000
statusBar.debuggingForeground #ffffff
statusBar.foreground #ffffff
statusBar.noFolderBackground #552e56
statusBar.noFolderForeground #ffffff
statusBarItem.activeBackground #FFFFFF25
statusBarItem.hoverBackground #ffffff1f
statusBarItem.remoteBackground #16825d
statusBarItem.remoteForeground #ffffff
tab.activeBackground #37373d
tab.activeBorder #31313100
tab.activeBorderTop #00000000
tab.activeForeground #a2cde5
tab.border #00000000
tab.hoverBackground #2a2d2e
tab.hoverBorder #00000000
tab.inactiveBackground #3c3f41
tab.inactiveForeground #adb9bd
terminal.ansiBlack #000000
terminal.ansiBlue #2472c8
terminal.ansiBrightBlack #666666
terminal.ansiBrightBlue #3b8eea
terminal.ansiBrightCyan #29b8db
terminal.ansiBrightGreen #23d18b
terminal.ansiBrightMagenta #d670d6
terminal.ansiBrightRed #f14c4c
terminal.ansiBrightWhite #e5e5e5
terminal.ansiBrightYellow #f5f543
terminal.ansiCyan #11a8cd
terminal.ansiGreen #0dbc79
terminal.ansiMagenta #bc3fbc
terminal.ansiRed #cd3131
terminal.ansiWhite #e5e5e5
terminal.ansiYellow #e5e510
terminal.border #80808059
terminal.foreground #cccccc
terminal.selectionBackground #ffffff40
terminalCursor.background #1b1b1b
terminalCursor.foreground #ffffff
textLink.foreground #3794ff
titleBar.activeBackground #3c3f41
titleBar.activeForeground #cccccc
titleBar.border #00000000
titleBar.inactiveBackground #3c3c3c99
titleBar.inactiveForeground #cccccc99
tree.indentGuidesStroke #585858
walkThrough.embeddedEditorBackground #00000050
widget.shadow #0000005c #1d8597
punctuation.separator.period.python,punctuation.separator.element.python,punctuation.parenthesis.begin.python,punctuation.parenthesis.end.python #999999 —
variable.parameter.function.language.special.self.python #baa376 —
storage.modifier.lifetime.rust #999999 —
support.function.std.rust #3492c7 —
entity.name.lifetime.rust #baa376 —
variable.language.rust #1d8597 —
support.constant.edge #367599 —
constant.other.character-class.regexp #1d8597 —
keyword.operator.quantifier.regexp #12c3bf —
punctuation.definition.string.begin,punctuation.definition.string.end #8db0c4 —
variable.parameter.function #999999 —
comment markup.link #656565 —
markup.changed.diff #baa376 —
meta.diff.header.from-file,meta.diff.header.to-file,punctuation.definition.from-file.diff,punctuation.definition.to-file.diff #3492c7 —
markup.inserted.diff #8db0c4 —
markup.deleted.diff #1d8597 —
meta.function.c,meta.function.cpp #1d8597 —
punctuation.section.block.begin.bracket.curly.cpp,punctuation.section.block.end.bracket.curly.cpp,punctuation.terminator.statement.c,punctuation.section.block.begin.bracket.curly.c,punctuation.section.block.end.bracket.curly.c,punctuation.section.parens.begin.bracket.round.c,punctuation.section.parens.end.bracket.round.c,punctuation.section.parameters.begin.bracket.round.c,punctuation.section.parameters.end.bracket.round.c #999999 —
punctuation.separator.key-value #999999 —
keyword.operator.expression.import #3492c7 —
support.constant.math #baa376 —
support.constant.property.math #12c3bf —
variable.other.constant #baa376 —
storage.type.annotation.java, storage.type.object.array.java #baa376 —
punctuation.section.block.begin.java,punctuation.section.block.end.java,punctuation.definition.method-parameters.begin.java,punctuation.definition.method-parameters.end.java,meta.method.identifier.java,punctuation.section.method.begin.java,punctuation.section.method.end.java,punctuation.terminator.java,punctuation.section.class.begin.java,punctuation.section.class.end.java,punctuation.section.inner-class.begin.java,punctuation.section.inner-class.end.java,meta.method-call.java,punctuation.section.class.begin.bracket.curly.java,punctuation.section.class.end.bracket.curly.java,punctuation.section.method.begin.bracket.curly.java,punctuation.section.method.end.bracket.curly.java,punctuation.separator.period.java,punctuation.bracket.angle.java,punctuation.definition.annotation.java,meta.method.body.java #999999 —
storage.modifier.import.java,storage.type.java,storage.type.generic.java #baa376 —
keyword.operator.instanceof.java #367599 —
meta.definition.variable.name.java #1d8597 —
keyword.operator.logical #ffffff —
keyword.operator.bitwise #ffffff —
keyword.operator.channel #ffffff —
support.constant.property-value.scss,support.constant.property-value.css #12c3bf —
keyword.operator.css,keyword.operator.scss,keyword.operator.less #ffffff —
support.constant.color.w3c-standard-color-name.css,support.constant.color.w3c-standard-color-name.scss #12c3bf —
punctuation.separator.list.comma.css #999999 —
support.constant.color.w3c-standard-color-name.css #12c3bf —
support.type.vendored.property-name.css #ffffff —
support.module.node,support.type.object.module,support.module.node #baa376 —
entity.name.type.module #baa376 —
variable.other.readwrite,meta.object-literal.key,support.variable.property,support.variable.object.process,support.variable.object.node #1d8597 —
support.constant.json #12c3bf —
keyword.operator.expression.instanceof, keyword.operator.new, keyword.operator.ternary, keyword.operator.optional, keyword.operator.expression.keyof #367599 —
support.type.object.console #1d8597 —
support.variable.property.process #12c3bf —
entity.name.function,support.function.console #3492c7 —
keyword.operator.misc.rust #999999 —
keyword.operator.sigil.rust #367599 —
keyword.operator.delete #367599 —
support.type.object.dom #ffffff —
support.variable.dom,support.variable.property.dom #1d8597 —
keyword.operator.arithmetic,keyword.operator.comparison,keyword.operator.decrement,keyword.operator.increment,keyword.operator.relational #ffffff —
keyword.operator.assignment.c,keyword.operator.comparison.c,keyword.operator.c,keyword.operator.increment.c,keyword.operator.decrement.c,keyword.operator.bitwise.shift.c,keyword.operator.assignment.cpp,keyword.operator.comparison.cpp,keyword.operator.cpp,keyword.operator.increment.cpp,keyword.operator.decrement.cpp,keyword.operator.bitwise.shift.cpp #367599 —
punctuation.separator.delimiter #999999 —
punctuation.separator.c,punctuation.separator.cpp #367599 —
support.type.posix-reserved.c,support.type.posix-reserved.cpp #ffffff —
keyword.operator.sizeof.c,keyword.operator.sizeof.cpp #367599 —
variable.parameter.function.language.python #12c3bf —
support.type.python #ffffff —
keyword.operator.logical.python #367599 —
variable.parameter.function.python #12c3bf —
punctuation.definition.arguments.begin.python,punctuation.definition.arguments.end.python,punctuation.separator.arguments.python,punctuation.definition.list.begin.python,punctuation.definition.list.end.python #999999 —
meta.function-call.generic.python #3492c7 —
constant.character.format.placeholder.other.python #12c3bf —
keyword.operator.assignment.compound #367599 —
keyword.operator.assignment.compound.js,keyword.operator.assignment.compound.ts #ffffff —
entity.name.namespace #baa376 —
variable.language #baa376 —
token.variable.parameter.java #999999 —
import.storage.java #baa376 —
token.package.keyword #367599 —
entity.name.function, meta.require, support.function.any-method, variable.function #3492c7 —
entity.name.type.namespace #baa376 —
support.class, entity.name.type.class #baa376 —
entity.name.class.identifier.namespace.type #baa376 —
entity.name.class, variable.other.class.js, variable.other.class.ts #baa376 —
variable.other.class.php #1d8597 —
control.elements, keyword.operator.less #12c3bf —
keyword.other.special-method #3492c7 —
keyword.operator.expression.delete,keyword.operator.expression.in,keyword.operator.expression.of,keyword.operator.expression.instanceof,keyword.operator.new,keyword.operator.expression.typeof,keyword.operator.expression.void #367599 —
token.storage.type.java #baa376 —
support.type.property-name #999999 —
support.constant.property-value #999999 —
support.constant.font-name #12c3bf —
entity.other.inherited-class #baa376 —
constant.other.symbol #ffffff —
punctuation.definition.constant #12c3bf —
entity.other.attribute-name #12c3bf —
entity.other.attribute-name.id #3492c7 normal
entity.other.attribute-name.class.css #12c3bf normal
markup.heading punctuation.definition.heading, entity.name.section #3492c7 —
keyword.other.unit #1d8597 —
markup.bold,todo.bold #12c3bf —
punctuation.definition.bold #baa376 —
markup.italic, punctuation.definition.italic,todo.emphasis #367599 —
entity.name.section.markdown #1d8597 —
punctuation.definition.heading.markdown #1d8597 —
punctuation.definition.list.begin.markdown #1d8597 —
markup.heading.setext #999999 —
punctuation.definition.bold.markdown #12c3bf —
markup.inline.raw.markdown #8db0c4 —
markup.inline.raw.string.markdown #8db0c4 —
punctuation.definition.list.markdown #1d8597 —
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown, punctuation.definition.metadata.markdown #1d8597 —
beginning.punctuation.definition.list.markdown #1d8597 —
punctuation.definition.metadata.markdown #1d8597 —
markup.underline.link.markdown,markup.underline.link.image.markdown #367599 —
string.other.link.title.markdown,string.other.link.description.markdown #3492c7 —
constant.character.escape #ffffff —
punctuation.section.embedded, variable.interpolation #1d8597 —
punctuation.section.embedded.begin,punctuation.section.embedded.end #367599 —
invalid.illegal.bad-ampersand.html #999999 —
invalid.deprecated #ffffff —
invalid.unimplemented #ffffff —
source.json meta.structure.dictionary.json > string.quoted.json #1d8597 —
source.json meta.structure.dictionary.json > string.quoted.json > punctuation.string #1d8597 —
source.json meta.structure.dictionary.json > value.json > string.quoted.json,source.json meta.structure.array.json > value.json > string.quoted.json,source.json meta.structure.dictionary.json > value.json > string.quoted.json > punctuation,source.json meta.structure.array.json > value.json > string.quoted.json > punctuation #8db0c4 —
source.json meta.structure.dictionary.json > constant.language.json,source.json meta.structure.array.json > constant.language.json #ffffff —
support.type.property-name.json #1d8597 —
support.type.property-name.json punctuation #1d8597 —
text.html.laravel-blade source.php.embedded.line.html entity.name.tag.laravel-blade #367599 —
text.html.laravel-blade source.php.embedded.line.html support.constant.laravel-blade #367599 —
support.other.namespace.use.php,support.other.namespace.use-as.php,support.other.namespace.php,entity.other.alias.php,meta.interface.php #baa376 —
keyword.operator.error-control.php #367599 —
keyword.operator.type.php #367599 —
punctuation.section.array.begin.php #999999 —
punctuation.section.array.end.php #999999 —
invalid.illegal.non-null-typehinted.php #f44747 —
storage.type.php,meta.other.type.phpdoc.php,keyword.other.type.php,keyword.other.array.phpdoc.php #baa376 —
meta.function-call.php,meta.function-call.object.php,meta.function-call.static.php #3492c7 —
punctuation.definition.parameters.begin.bracket.round.php,punctuation.definition.parameters.end.bracket.round.php,punctuation.separator.delimiter.php,punctuation.section.scope.begin.php,punctuation.section.scope.end.php,punctuation.terminator.expression.php,punctuation.definition.arguments.begin.bracket.round.php,punctuation.definition.arguments.end.bracket.round.php,punctuation.definition.storage-type.begin.bracket.round.php,punctuation.definition.storage-type.end.bracket.round.php,punctuation.definition.array.begin.bracket.round.php,punctuation.definition.array.end.bracket.round.php,punctuation.definition.begin.bracket.round.php,punctuation.definition.end.bracket.round.php,punctuation.definition.begin.bracket.curly.php,punctuation.definition.end.bracket.curly.php,punctuation.definition.section.switch-block.end.bracket.curly.php,punctuation.definition.section.switch-block.start.bracket.curly.php,punctuation.definition.section.switch-block.begin.bracket.curly.php,punctuation.definition.section.switch-block.end.bracket.curly.php #999999 —
support.constant.core.rust #12c3bf —
support.constant.ext.php,support.constant.std.php,support.constant.core.php,support.constant.parser-token.php #12c3bf —
entity.name.goto-label.php,support.other.php #3492c7 —
keyword.operator.logical.php,keyword.operator.bitwise.php,keyword.operator.arithmetic.php #ffffff —
keyword.operator.regexp.php #367599 —
keyword.operator.comparison.php #ffffff —
keyword.operator.heredoc.php,keyword.operator.nowdoc.php #367599 —
meta.function.decorator.python #3492c7 —
support.token.decorator.python,meta.function.decorator.identifier.python #ffffff —
function.parameter #999999 —
function.parameter.ruby, function.parameter.cs #999999 —
constant.language.symbol.ruby #ffffff —
inline-color-decoration rgb-value #12c3bf —
support.type.primitive.ts,support.type.builtin.ts,support.type.primitive.tsx,support.type.builtin.tsx #baa376 —
block.scope.end,block.scope.begin #999999 —
entity.name.variable.local.cs #1d8597 —
token.error-token #f44747 —
token.debug-token #367599 —
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded #367599 —
meta.template.expression #999999 —
keyword.operator.module #367599 —
support.type.type.flowtype #3492c7 —
support.type.primitive #baa376 —
meta.property.object #1d8597 —
variable.parameter.function.js #1d8597 —
keyword.other.template.begin #8db0c4 —
keyword.other.template.end #8db0c4 —
keyword.other.substitution.begin #8db0c4 —
keyword.other.substitution.end #8db0c4 —
keyword.operator.assignment #ffffff —
keyword.operator.assignment.go #baa376 —
keyword.operator.arithmetic.go, keyword.operator.address.go #367599 —
entity.name.package.go #baa376 —
support.type.prelude.elm #ffffff —
support.constant.elm #12c3bf —
punctuation.quasi.element #367599 —
constant.character.entity #1d8597 —
entity.other.attribute-name.pseudo-element, entity.other.attribute-name.pseudo-class #ffffff —
entity.global.clojure #baa376 —
meta.symbol.clojure #1d8597 —
constant.keyword.clojure #ffffff —
meta.arguments.coffee, variable.parameter.function.coffee #1d8597 —
meta.scope.prerequisites.makefile #1d8597 —
storage.modifier.import.groovy #baa376 —
meta.method.groovy #3492c7 —
meta.definition.variable.name.groovy #1d8597 —
meta.definition.class.inherited.classes.groovy #8db0c4 —
support.variable.semantic.hlsl #baa376 —
support.type.texture.hlsl, support.type.sampler.hlsl, support.type.object.hlsl, support.type.object.rw.hlsl, support.type.fx.hlsl, support.type.object.hlsl #367599 —
text.variable, text.bracketed #1d8597 —
support.type.swift, support.type.vb.asp #baa376 —
entity.name.function.xi #baa376 —
entity.name.class.xi #ffffff —
constant.character.character-class.regexp.xi #1d8597 —
constant.regexp.xi #367599 —
keyword.control.xi #ffffff —
beginning.punctuation.definition.quote.markdown.xi #8db0c4 —
beginning.punctuation.definition.list.markdown.xi #656565 —
constant.character.xi #3492c7 —
constant.other.color.rgb-value.xi #ffffff —
punctuation.definition.tag.xi #656565 —
entity.name.label.cs, entity.name.scope-resolution.function.call, entity.name.scope-resolution.function.definition #baa376 —
entity.name.label.cs, markup.heading.setext.1.markdown, markup.heading.setext.2.markdown #1d8597 —
meta.brace.square #999999 —
comment, punctuation.definition.comment #656565 italic
markup.quote.markdown #656565 —
punctuation.definition.block.sequence.item.yaml #999999 —
constant.language.symbol.elixir #ffffff —
entity.other.attribute-name.js,entity.other.attribute-name.ts,entity.other.attribute-name.jsx,entity.other.attribute-name.tsx,variable.parameter,variable.language.super — italic
comment.line.double-slash,comment.block.documentation — italic
keyword.control.import.python,keyword.control.flow.python — italic
markup.italic.markdown — italic
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 } !` ;
}
fetchUser.ts
index.ts
README.md
src
components
fetchUser.ts
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...
main*
Button.tsx
31
~/my-project
$
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 } !` ;
}
Minimal Dark for VSCode | Coding Theme