Andromeda Dark Theme

Name: Andromeda Dark Theme
Author: apoorvkhare07

Publisher: apoorvkhare07Themes in package: 1

Dark theme for vs-code optimized to please the eyes.

GitHub

VS Code preview

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

Andromeda Dark Theme — Andromeda

fetchUser.ts

index.ts

README.md

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Dark+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBackground#141414
activityBar.activeBorder#303030
activityBar.background#303030
activityBar.dropBackground#ffffff1f
activityBar.foreground#ffffff
activityBar.inactiveForeground#aaaaaa
activityBarBadge.background#cab076
activityBarBadge.foreground#111111
badge.background#cab076
badge.foreground#111111
breadcrumb.activeSelectionForeground#ffffff
breadcrumb.background#1a1a1a
breadcrumb.focusForeground#ffffff
breadcrumb.foreground#b6b6b6
breadcrumbPicker.background#252526
button.background#3b7ab4
button.foreground#ffffff
button.hoverBackground#196ebd
checkbox.background#3c3c3c
checkbox.border#3c3c3c
checkbox.foreground#f0f0f0
debugExceptionWidget.background#420b0d
debugExceptionWidget.border#a31515
debugIcon.breakpointCurrentStackframeForeground#ffcc00
debugIcon.breakpointDisabledForeground#848484
debugIcon.breakpointForeground#e51400
debugIcon.breakpointStackframeForeground#89d185
debugIcon.breakpointUnverifiedForeground#848484
debugIcon.continueForeground#75beff
debugIcon.disconnectForeground#f48771
debugIcon.pauseForeground#75beff
debugIcon.restartForeground#89d185
debugIcon.startForeground#89d185
debugIcon.stepBackForeground#75beff
debugIcon.stepIntoForeground#75beff
debugIcon.stepOutForeground#75beff
debugIcon.stepOverForeground#75beff
debugIcon.stopForeground#f48771
debugTokenExpression.boolean#4e94ce
debugTokenExpression.error#f48771
debugTokenExpression.name#c586c0
debugTokenExpression.number#b5cea8
debugTokenExpression.string#ce9178
debugTokenExpression.value#cccccc99
debugToolBar.background#333333
debugView.exceptionLabelBackground#6c2022
debugView.exceptionLabelForeground#ffffff
debugView.stateLabelBackground#88888844
debugView.stateLabelForeground#ffffff
debugView.valueChangedHighlight#569cd6
descriptionForeground#ffffffb3
diffEditor.border#333333
diffEditor.diagonalFill#cccccc33
diffEditor.insertedTextBackground#92d19244
diffEditor.removedTextBackground#f2777a44
dropdown.background#3c3c3c
dropdown.border#3c3c3c
dropdown.foreground#f0f0f0
editor.background#0a0a0a
editor.findMatchBackground#333232
editor.findMatchBorder#d1d1d1
editor.findMatchHighlightBackground#525252
editor.findRangeHighlightBackground#3a3d4166
editor.findRangeHighlightBorder#66666699
editor.focusedStackFrameHighlightBackground#7abd7a4d
editor.foldBackground#3333334d
editor.foreground#ffffff
editor.hoverHighlightBackground#264f7840
editor.inactiveSelectionBackground#33333380
editor.lineHighlightBackground#1d1d1d
editor.lineHighlightBorder#282828
editor.rangeHighlightBackground#ffffff0b
editor.selectionBackground#333333
editor.selectionForeground#494949
editor.selectionHighlightBackground#25252599
editor.snippetFinalTabstopHighlightBorder#525252
editor.snippetTabstopHighlightBackground#7c7c7c4d
editor.stackFrameHighlightBackground#ffff0033
editor.symbolHighlightBackground#525252
editor.wordHighlightBackground#575757b8
editor.wordHighlightStrongBackground#004972b8
editorBracketMatch.background#757575
editorBracketMatch.border#757575
editorCodeLens.foreground#999999
editorCursor.foreground#f8f8f8
editorError.foreground#f2777a
editorGroup.border#444444
editorGroup.dropBackground#53595d80
editorGroupHeader.noTabsBackground#0a0a0a
editorGroupHeader.tabsBackground#252526
editorGutter.addedBackground#587c0c
editorGutter.background#0a0a0a
editorGutter.commentRangeForeground#c5c5c5
editorGutter.deletedBackground#94151b
editorGutter.foldingControlForeground#c5c5c5
editorGutter.modifiedBackground#0c7d9d
editorHint.foreground#eeeeeeb3
editorHoverWidget.background#252526
editorHoverWidget.border#454545
editorHoverWidget.foreground#ffffff
editorHoverWidget.statusBarBackground#2c2c2d
editorIndentGuide.activeBackground#666666
editorIndentGuide.background#202020
editorInfo.foreground#75beff
editorLightBulb.foreground#ffcc00
editorLightBulbAutoFix.foreground#75beff
editorLineNumber.activeForeground#909090
editorLineNumber.foreground#808080
editorLink.activeForeground#4e94ce
editorMarkerNavigation.background#2d2d30
editorMarkerNavigationError.background#f2777a
editorMarkerNavigationInfo.background#75beff
editorMarkerNavigationWarning.background#cca700
editorOverviewRuler.addedForeground#587c0c99
editorOverviewRuler.border#7f7f7f4d
editorOverviewRuler.bracketMatchForeground#a0a0a0
editorOverviewRuler.commonContentForeground#60606066
editorOverviewRuler.currentContentForeground#40c8ae80
editorOverviewRuler.deletedForeground#94151b99
editorOverviewRuler.errorForeground#ff1212b3
editorOverviewRuler.findMatchForeground#d186167e
editorOverviewRuler.incomingContentForeground#40a6ff80
editorOverviewRuler.infoForeground#75beff
editorOverviewRuler.modifiedForeground#0c7d9d99
editorOverviewRuler.rangeHighlightForeground#007acc99
editorOverviewRuler.selectionHighlightForeground#a0a0a0cc
editorOverviewRuler.warningForeground#cca700
editorOverviewRuler.wordHighlightForeground#a0a0a0cc
editorOverviewRuler.wordHighlightStrongForeground#c0a0c0cc
editorPane.background#0a0a0a
editorRuler.foreground#5a5a5a
editorSuggestWidget.background#131313
editorSuggestWidget.border#333333
editorSuggestWidget.foreground#e0dedf
editorSuggestWidget.highlightForeground#ffd479
editorSuggestWidget.selectedBackground#333333
editorUnnecessaryCode.opacity#000000aa
editorWarning.foreground#cca700
editorWhitespace.foreground#202020
editorWidget.background#252526
editorWidget.border#454545
editorWidget.foreground#ffffff
errorForeground#f2777a
extensionBadge.remoteBackground#cab076
extensionBadge.remoteForeground#111111
extensionButton.prominentBackground#cab076
extensionButton.prominentForeground#111111
extensionButton.prominentHoverBackground#ffd479
focusBorder#555555
foreground#ffffff
gitDecoration.addedResourceForeground#81b88b
gitDecoration.conflictingResourceForeground#6c6cc4
gitDecoration.deletedResourceForeground#c74e39
gitDecoration.ignoredResourceForeground#8c8c8c
gitDecoration.modifiedResourceForeground#e2c08d
gitDecoration.submoduleResourceForeground#8db9e2
gitDecoration.untrackedResourceForeground#73c991
icon.foreground#c5c5c5
imagePreview.border#80808059
input.background#303030
input.foreground#ffffff
input.placeholderForeground#ffffff80
inputOption.activeBackground#55555580
inputOption.activeBorder#ffd479
inputValidation.errorBackground#5a1d1d
inputValidation.errorBorder#be1100
inputValidation.infoBackground#063b49
inputValidation.infoBorder#007acc
inputValidation.warningBackground#352a05
inputValidation.warningBorder#f2777a
list.activeSelectionBackground#444444
list.activeSelectionForeground#ffffff
list.deemphasizedForeground#8c8c8c
list.dropBackground#101010
list.errorForeground#f88070
list.filterMatchBackground#525252
list.focusBackground#101010
list.highlightForeground#0097fb
list.hoverBackground#202020
list.inactiveSelectionBackground#333333
list.invalidItemForeground#b89500
list.warningForeground#cca700
listFilterWidget.background#653723
listFilterWidget.noMatchesOutline#be1100
listFilterWidget.outline#00000000
menu.background#3c3c3c
menu.foreground#f0f0f0
menu.selectionBackground#444444
menu.selectionForeground#ffffff
menu.separatorBackground#bbbbbb
menubar.selectionBackground#ffffff1a
menubar.selectionForeground#cccccc
merge.commonContentBackground#60606029
merge.commonHeaderBackground#60606066
merge.currentContentBackground#40c8ae33
merge.currentHeaderBackground#40c8ae80
merge.incomingContentBackground#40a6ff33
merge.incomingHeaderBackground#40a6ff80
minimap.errorHighlight#ff1212b3
minimap.findMatchHighlight#d18616
minimap.selectionHighlight#264f78
minimap.warningHighlight#cca700
minimapGutter.addedBackground#587c0c
minimapGutter.deletedBackground#94151b
minimapGutter.modifiedBackground#0c7d9d
minimapSlider.activeBackground#74727248
minimapSlider.background#4949494d
minimapSlider.hoverBackground#74727248
notebook.cellToolbarSeperator#80808059
notebook.focusedCellIndicator#0c7d9d
notebook.outputContainerBackgroundColor#ffffff0f
notificationCenterHeader.background#303031
notificationLink.foreground#6ab0f3
notifications.background#252526
notifications.border#303031
notifications.foreground#ffffff
notificationsErrorIcon.foreground#f2777a
notificationsInfoIcon.foreground#75beff
notificationsWarningIcon.foreground#cca700
panel.background#141414
panel.border#80808059
panel.dropBackground#ffffff1f
panelTitle.activeBorder#e7e7e7
panelTitle.activeForeground#e7e7e7
panelTitle.inactiveForeground#e7e7e799
peekView.border#333333
peekViewEditor.background#242424
peekViewEditor.matchHighlightBackground#2d2d2d
peekViewEditorGutter.background#242424
peekViewResult.background#242424
peekViewResult.fileForeground#ffffff
peekViewResult.lineForeground#bbbbbb
peekViewResult.matchHighlightBackground#2d2d2d
peekViewResult.selectionBackground#444444
peekViewResult.selectionForeground#ffffff
peekViewTitle.background#1e1e1e
peekViewTitleDescription.foreground#ccccccb3
peekViewTitleLabel.foreground#ffffff
pickerGroup.border#3f3f46
pickerGroup.foreground#3794ff
problemsErrorIcon.foreground#f2777a
problemsInfoIcon.foreground#75beff
problemsWarningIcon.foreground#cca700
progressBar.background#0e70c0
quickInput.background#252526
quickInput.foreground#ffffff
quickInputTitle.background#ffffff1b
scrollbar.shadow#000000
scrollbarSlider.activeBackground#74727290
scrollbarSlider.background#49494999
scrollbarSlider.hoverBackground#74727290
searchEditor.findMatchBackground#525252a8
settings.checkboxBackground#3c3c3c
settings.checkboxBorder#3c3c3c
settings.checkboxForeground#f0f0f0
settings.dropdownBackground#3c3c3c
settings.dropdownBorder#3c3c3c
settings.dropdownForeground#f0f0f0
settings.dropdownListBorder#454545
settings.headerForeground#e7e7e7
settings.modifiedItemIndicator#0c7d9d
settings.numberInputBackground#303030
settings.numberInputForeground#ffffff
settings.textInputBackground#303030
settings.textInputForeground#ffffff
sideBar.background#141414
sideBar.border#2c2c2c
sideBar.dropBackground#ffffff1f
sideBar.foreground#fdfdfd
sideBarSectionHeader.background#202020
sideBarSectionHeader.border#2c2c2c
sideBarSectionHeader.foreground#ffffff
sideBarTitle.foreground#fffefe
statusBar.background#303030
statusBar.debuggingBackground#cc6633
statusBar.debuggingForeground#ffffff
statusBar.foreground#cccccc
statusBar.noFolderBackground#21252b
statusBar.noFolderForeground#cccccc
statusBarItem.activeBackground#ffffff2e
statusBarItem.hoverBackground#141414
statusBarItem.prominentBackground#00000080
statusBarItem.prominentForeground#cccccc
statusBarItem.prominentHoverBackground#0000004d
statusBarItem.remoteBackground#cab076
statusBarItem.remoteForeground#111111
symbolIcon.arrayForeground#ffffff
symbolIcon.booleanForeground#ffffff
symbolIcon.classForeground#ee9d28
symbolIcon.colorForeground#ffffff
symbolIcon.constantForeground#ffffff
symbolIcon.constructorForeground#b180d7
symbolIcon.enumeratorForeground#ee9d28
symbolIcon.enumeratorMemberForeground#75beff
symbolIcon.eventForeground#ee9d28
symbolIcon.fieldForeground#75beff
symbolIcon.fileForeground#ffffff
symbolIcon.folderForeground#ffffff
symbolIcon.functionForeground#b180d7
symbolIcon.interfaceForeground#75beff
symbolIcon.keyForeground#ffffff
symbolIcon.keywordForeground#ffffff
symbolIcon.methodForeground#b180d7
symbolIcon.moduleForeground#ffffff
symbolIcon.namespaceForeground#ffffff
symbolIcon.nullForeground#ffffff
symbolIcon.numberForeground#ffffff
symbolIcon.objectForeground#ffffff
symbolIcon.operatorForeground#ffffff
symbolIcon.packageForeground#ffffff
symbolIcon.propertyForeground#ffffff
symbolIcon.referenceForeground#ffffff
symbolIcon.snippetForeground#ffffff
symbolIcon.stringForeground#ffffff
symbolIcon.structForeground#ffffff
symbolIcon.textForeground#ffffff
symbolIcon.typeParameterForeground#ffffff
symbolIcon.unitForeground#ffffff
symbolIcon.variableForeground#75beff
tab.activeBackground#141414
tab.activeForeground#ffffff
tab.activeModifiedBorder#3399cc
tab.border#252526
tab.inactiveBackground#202020
tab.inactiveForeground#ffffff80
tab.inactiveModifiedBorder#3399cc80
tab.unfocusedActiveBackground#141414
tab.unfocusedActiveForeground#ffffff80
tab.unfocusedActiveModifiedBorder#3399cc80
tab.unfocusedInactiveBackground#202020
tab.unfocusedInactiveForeground#ffffff40
tab.unfocusedInactiveModifiedBorder#3399cc40
terminal.ansiBlack#666666
terminal.ansiBlue#6ab0f3
terminal.ansiBrightBlack#777777
terminal.ansiBrightBlue#6ab0f3
terminal.ansiBrightCyan#62cfcf
terminal.ansiBrightGreen#92d192
terminal.ansiBrightMagenta#e1a6f2
terminal.ansiBrightRed#f2777a
terminal.ansiBrightWhite#ffffff
terminal.ansiBrightYellow#ffd479
terminal.ansiCyan#62cfcf
terminal.ansiGreen#92d192
terminal.ansiMagenta#e1a6f2
terminal.ansiRed#f2777a
terminal.ansiWhite#ffffff
terminal.ansiYellow#ffd479
terminal.background#141414
terminal.border#80808059
terminal.foreground#d5d6da
terminal.selectionBackground#bbbbbb50
textBlockQuote.background#7f7f7f1a
textBlockQuote.border#007acc80
textCodeBlock.background#0a0a0a66
textLink.activeForeground#6ab0f3
textLink.foreground#6ab0f3
textPreformat.foreground#d7ba7d
textSeparator.foreground#ffffff2e
titleBar.activeBackground#3c3c3c
titleBar.activeForeground#cccccc
titleBar.inactiveBackground#3c3c3c99
titleBar.inactiveForeground#cccccc99
tree.indentGuidesStroke#585858
widget.shadow#000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
string, constant.other.symbol, entity.other.inherited-class, punctuation.definition.string, markup.underline.link.image.markdown, string.other.link, markup.raw.inline, markup.inserted, markup.inserted.git_gutter, string.other.link.title.markdown, variable.parameter.url.scss	#92D192	—
keyword, keyword.operator.expression.typeof, variable.language.this, storage, support.function.construct.output.php, keyword.operator.new, markup.inline.raw.string.markdown, keyword.operator.expression.import.js	#FFEEA6	—
entity.other.attribute-name, entity.other.attribute-name.class.css, markup.heading punctuation.definition.heading, entity.name.section, entity.other.attribute-name.class.css, string.unquoted.alias.graphql	#FFD479	—
variable.other.property.php, variable.other.member.php, entity.name.function.php, meta.function-call, meta.property-value, meta.selector, entity.name.function.ts, entity.name.function.js, entity.name.function.tsx	#FFFFFF	—
support.class, entity.name.type.class, meta.entity.new.name.expr, entity.name.tag.structure.any.html, meta.tag.structure.any.html, punctuation.definition.tag.html, meta.tag.sgml.doctype.html, keyword.other.special-method, entity.name.type, entity.name.tag, support.variable.dom.js, meta.tag.structure.any.html, markup.bold, punctuation.definition.bold, entity.name.type.ts, support.variable.dom.ts, entity.name.function.graphql	#6AB0F3	—
meta.type.annotation.ts, support.type.primitive.ts, entity.name.type.ts, meta.type.annotation.ts, variable.other.jsdoc	#4A7BAA	—
variable.parameter.ts, variable.parameter.ts, variable.parameter.tsx, entity.tag.tagbraces.nunjucks, string.unquoted.filter-pipe.nunjucks, punctuation.colon.graphql, string.unquoted.graphql	#848991	—
comment, punctuation.definition.comment, punctuation.separator.key-value, punctuation.separator, meta.template.expression.js, punctuation.definition.template-expression.begin.js, punctuation.definition.template-expression.begin.ts, punctuation.definition.template-expression.end.js, punctuation.definition.template-expression.end.ts, markup.underline.link.markdown, punctuation.definition.metadata.markdown	#777C85	—
punctuation.definition.variable, variable, variable.language.this.php, markup.deleted, markup.deleted.git_gutter, invalid.illegal, string.unquoted.tag-string.nunjucks	#F2777A	—
constant.numeric, keyword.other.unit, markup.quote	#FCA369	—
support.function, constant, entity.other.attribute-name.id, markup.italic, punctuation.definition.italic, markup.changed, markup.changed.git_gutter, support.constant.property-value	#76d4cd	—
keyword.operator, constant.character.escape, constant.character.escape.json, entity.other.attribute-name.pseudo-element.css, entity.other.attribute-name.pseudo-class.css, keyword.operator, punctuation.accessor.js, punctuation.definition.block.tag.jsdoc, storage.type.class.jsdoc	#AC8D58	—
punctuation.definition.block, meta.parameters, punctuation.definition.parameters, meta.brace.round, punctuation.definition.dictionary, constant.character.escape.backslash.regexp, punctuation.section, punctuation.terminator.statement, variable.other.property.js, support.variable.property.dom.js, punctuation.definition.parameters, punctuation.definition.array, support.type.property-name.json, entity.name.function, meta.require, support.function.any-method, meta.tag.sgml.html, punctuation.section.embedded, variable.interpolation, variable.object.property.ts, variable.object.property.tsx, meta.brace.square, punctuation.definition.array, punctuation.definition.binding-pattern.object.js, entity.name.tag.yaml, meta.selectionset.graphql	#eeeeee	—
entity.other.attribute-name.pseudo-class.css, constant.other.php, markup.italic.markdown, punctuation.definition.italic.markdown, string.regexp, entity.other.attribute-name.pseudo-element.css, meta.image.inline.markdown, string.other.link.description.markdown	#62CFCF	—
entity.name.tag.reference, meta.embedded.block.php, meta.embedded.line.php, keyword.other.phpdoc.php, meta.separator, variable.object.property.ts, variable.object.property.tsx, variable.other.property.js, support.variable.property.dom.js, support.type.property-name.json, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, entity.name.type.instance.jsdoc, variable.graphql, meta.template.expression.ts	#e2e2e2	—
token.info-token	#6796E6	—
token.warn-token	#CD9731	—
token.error-token	#F44747	—
token.debug-token	#B267E6	—

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