Nebula Pandas

Name: Nebula Pandas
Author: GokturkSM

Publisher: GokturkSMThemes in package: 1

ChirtleLovesDolls' lovely Nebula theme with a touch of Pandas.

GitHub

VS Code preview

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

Nebula Pandas — Nebula Pandas Theme

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.background#1f2330
activityBar.border#00000000
activityBar.foreground#f6f0ff
activityBar.inactiveForeground#919cb9
activityBarBadge.background#e34f8c
badge.background#e34f8c
badge.foreground#f8f8f2
breadcrumb.activeSelectionForeground#fcf6ff
breadcrumb.background#27273a
breadcrumb.focusForeground#fcf6ff
breadcrumb.foreground#919cb9
breadcrumbPicker.background#27273a
button.background#e34f8c
button.hoverBackground#f661b1
debugExceptionWidget.border#24e8d8
debugToolBar.background#1f2330
debugToolBar.border#24e8d8
descriptionForeground#919cb9
diffEditor.insertedTextBackground#e34f8c25
diffEditor.removedTextBackground#6eeec425
dropdown.background#1f2330
dropdown.border#b2cffb3a
dropdown.foreground#d7d6df
dropdown.listBackground#27273a
editor.background#27273a
editor.findMatchBackground#c7adfb90
editor.findMatchBorder#c7adfb00
editor.findMatchHighlightBackground#c7adfb30
editor.findMatchHighlightBorder#c7adfb50
editor.findRangeHighlightBackground#2a2a46
editor.foreground#fcf6ff
editor.lineHighlightBackground#2a2a46
editor.rangeHighlightBackground#2a2a46
editor.selectionBackground#42557bc0
editor.selectionForeground#25313e
editor.selectionHighlightBackground#42557b50
editor.selectionHighlightBorder#42557b
editor.snippetFinalTabstopHighlightBackground#1f2330
editor.snippetFinalTabstopHighlightBorder#24e8d890
editor.snippetTabstopHighlightBackground#1f2330
editor.snippetTabstopHighlightBorder#24e8d890
editor.wordHighlightBackground#42557b30
editor.wordHighlightBorder#00000000
editor.wordHighlightStrongBackground#42557b30
editor.wordHighlightStrongBorder#00000000
editorBracketMatch.background#2a2a46
editorBracketMatch.border#97ee91
editorCursor.foreground#97ee91
editorError.foreground#f36f98
editorGroup.border#00000000
editorGroup.dropBackground#363c4c5f
editorGroup.emptyBackground#1f2330
editorGroupHeader.tabsBackground#1f2330
editorHint.foreground#f2c88c
editorHoverWidget.background#27273a
editorHoverWidget.border#24e8d8
editorIndentGuide.activeBackground#b2cffb3a
editorIndentGuide.background#b2cffb1a
editorLineNumber.activeForeground#24e8d8
editorLineNumber.foreground#919cb9
editorMarkerNavigation.background#1f2330
editorOverviewRuler.border#00000000
editorOverviewRuler.selectionHighlightForeground#97ee91
editorPane.background#1f2330
editorRuler.foreground#c7adfb2f
editorSuggestWidget.background#27273a
editorSuggestWidget.border#24e8d8
editorSuggestWidget.foreground#919cb9
editorSuggestWidget.highlightForeground#fcf6ff
editorSuggestWidget.selectedBackground#35355190
editorWarning.foreground#f2c88c
editorWhitespace.foreground#b2cffb1a
editorWidget.background#1f2330
editorWidget.border#24e8d8
errorForeground#e34f8c
extensionButton.prominentBackground#97ee91
extensionButton.prominentForeground#0f1320
extensionButton.prominentHoverBackground#affa90
focusBorder#b2cffb3a
foreground#fcf6ff
gitDecoration.conflictingResourceForeground#07adfb
gitDecoration.deletedResourceForeground#e34f8c55
gitDecoration.ignoredResourceForeground#919cb9af
gitDecoration.modifiedResourceForeground#f2c88c
gitDecoration.submoduleResourceForeground#c7adfb5f
gitDecoration.untrackedResourceForeground#e7adfba0
input.background#1f2330
input.border#b2cffb1a
input.foreground#d7d6df
input.placeholderForeground#919cb99c
inputOption.activeBorder#363c4c
inputValidation.errorBackground#1f2330
inputValidation.errorBorder#e34f8c
inputValidation.errorForeground#e34f8c
inputValidation.infoBackground#1f2330
inputValidation.infoBorder#919cb9
inputValidation.infoForeground#d7d6df
inputValidation.warningBackground#1f2330
inputValidation.warningBorder#f2c88c
inputValidation.warningForeground#f2c88c
list.activeSelectionBackground#899bbf3a
list.dropBackground#f6f0ff15
list.errorForeground#f36f98
list.focusBackground#899bbf30
list.focusForeground#f6f0ff
list.highlightForeground#f8f8f2
list.hoverBackground#919cb915
list.hoverForeground#f6f0ffea
list.inactiveSelectionBackground#899bbf2c
list.inactiveSelectionForeground#fcf6ff
list.warningForeground#f2c88c
menu.background#27273a
menu.foreground#919cb9
menu.selectionBackground#899bbf3a
menu.selectionBorder#00000000
menu.selectionForeground#fcf6ff
menu.separatorBackground#b2cffb3a
menubar.selectionBackground#899bbf3a
menubar.selectionBorder#00000000
menubar.selectionForeground#fcf6ff
notificationCenter.border#24e8d8
notificationCenterHeader.background#1f2330
notifications.border#24e8d8
notificationToast.border#24e8d8
panel.background#1f2330
panel.border#00000000
panelTitle.activeBorder#24e8d8
panelTitle.activeForeground#24e8d8
panelTitle.inactiveForeground#919cb9
peekView.border#24e8d8
peekViewEditor.background#27273a
peekViewEditor.matchHighlightBackground#363c4c
peekViewResult.background#27273a
peekViewResult.matchHighlightBackground#363c4c
peekViewResult.selectionBackground#35355190
peekViewTitle.background#1f2330
pickerGroup.border#b2cffb1a
pickerGroup.foreground#e752a1
progressBar.background#24e8d8
scrollbar.shadow#0f1320
scrollbarSlider.activeBackground#0f1320c0
scrollbarSlider.background#06080e4a
scrollbarSlider.hoverBackground#0f132090
selection.background#94cbf87a
settings.checkboxBackground#1f2330
settings.checkboxBorder#97ee9150
settings.checkboxForeground#97ee91
settings.dropdownBackground#1f2330
settings.dropdownBorder#b2cffb1a
settings.dropdownForeground#e7adfb
settings.dropdownListBorder#b2cffb1a
settings.headerForeground#24e8d8
settings.modifiedItemIndicator#e34f8c
settings.numberInputBackground#1f2330
settings.numberInputBorder#b2cffb1a
settings.numberInputForeground#f8c275
settings.textInputBackground#1f2330
settings.textInputBorder#b2cffb1a
settings.textInputForeground#50dffe
sideBar.background#27273a
sideBar.border#00000000
sideBar.dropBackground#363c4c5f
sideBar.foreground#919cb9
sideBarSectionHeader.background#1f2330
sideBarSectionHeader.border#b2cffb3a
sideBarSectionHeader.foreground#f6f0ff
sideBarTitle.foreground#24e8d8
statusBar.background#1f2330
statusBar.border#00000000
statusBar.debuggingBackground#6eeec4
statusBar.debuggingForeground#27273a
statusBar.foreground#919cb9
statusBar.noFolderBackground#e34fbc
statusBar.noFolderForeground#fcf6ff
tab.activeBackground#27273a
tab.activeBorder#00000000
tab.activeForeground#24e8d8
tab.activeModifiedBorder#e34f8c
tab.border#353551
tab.hoverBorder#24e8d8
tab.inactiveBackground#1f2330
tab.inactiveForeground#919cb9
tab.inactiveModifiedBorder#e34f8c90
tab.unfocusedActiveBorder#00000000
tab.unfocusedActiveForeground#47a9bc
tab.unfocusedActiveModifiedBorder#e34f8ca0
tab.unfocusedHoverBorder#47a9bc
tab.unfocusedInactiveForeground#79839c
tab.unfocusedInactiveModifiedBorder#e34f8c70
terminal.ansiBlack#353551
terminal.ansiBlue#c7adfb
terminal.ansiBrightBlack#919cb9
terminal.ansiBrightBlue#74d6e9
terminal.ansiBrightCyan#8df9f9
terminal.ansiBrightGreen#affa90
terminal.ansiBrightMagenta#f799c7
terminal.ansiBrightRed#f36f98
terminal.ansiBrightWhite#d7d6df
terminal.ansiBrightYellow#fafaa0
terminal.ansiCyan#24e8d8
terminal.ansiGreen#97f36d
terminal.ansiMagenta#e752a1
terminal.ansiRed#e34f8c
terminal.ansiWhite#fbd3e1
terminal.ansiYellow#f8c275
terminal.background#27273a
terminal.border#b2cffb3a
terminal.foreground#f6f0ff
terminal.selectionBackground#42557b5a
terminalCursor.background#0f1320
terminalCursor.foreground#97ee91
textBlockQuote.background#919cb91c
textBlockQuote.border#e34f8c
textLink.activeForeground#74d6e9
textLink.foreground#40afee
textPreformat.foreground#24e8d8
textSeparator.foreground#919cb9
titleBar.activeBackground#1f2330
titleBar.activeForeground#d7d6df
titleBar.border#00000000
titleBar.inactiveBackground#1f2330
titleBar.inactiveForeground#919cb9
welcomePage.buttonBackground#353551
welcomePage.buttonHoverBackground#919cb91c
widget.shadow#0f1320

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, entity.other.attribute-name.pseudo-element.css, entity.other.inherited-class, markup.italic.markdown, markup.quote, meta.function.variable.css, punctuation.definition.italic.markdown, punctuation.definition.string.css, storage.type.function, string.quoted.double.css, variable.argument.css	—	italic
meta.brace, punctuation.definition.array, punctuation.definition.binding-pattern, punctuation.definition.block, punctuation.definition.dictionary, punctuation.definition.string, punctuation.definition.tag, punctuation.curlybrace, punctuation.fullstop, punctuation.section, punctuation.support, punctuation.terminator, meta.structure.dictionary.json, string.quoted.double.json, constant.other.table-name.sql	#F6F0FF	—
support.variable, variable, support.type.property-name, variable.other.object.property, meta.object-literal.key.js, string.other.link.description.markdown	#8DF9F9	—
keyword.var, keyword.const, constant, keyword.struct, keyword.interface, keyword.function, markup.inline.raw, punctuation.parenthesis.named.begin.regexp, punctuation.parenthesis.named.end.regexp, punctuation.parenthesis.non-capturing.begin.regexp, punctuation.parenthesis.non-capturing.end.regexp, support.constant, support.type, support.class, markup.inserted, entity.name.type, entity.name.class, entity.other.inherited-class, entity.other.attribute-name.id.css	#97EE91	—
punctuation.terminator, punctuation.section.function.begin.bracket.round.css, punctuation.section.function.end.bracket.round.css, punctuation.section.property-list.begin.bracket.curly.css, punctuation.section.property-list.end.bracket.curly.css	#919CB9	—
constant.other.database-name.sql, variable.other.object	#C5B9DF	—
comment	#8059A2	—
string, markup.quote, markup.bold, markup.italic, string.quoted.single.js, string.quoted.double.js, meta.link.inline.markdown, meta.image.inline.markdown, markup.underline.link, entity.name.type.js	#50DFFE	—
string.quoted.docstring, storage.type.function, keyword.type, storage.type, punctuation.accessor, punctuation.separator, meta.brace.square.js, meta.brace.square.ts	#E7ADFB	—
entity.name.class, entity.name.function, entity.name.type, entity.other.attribute-name, entity.other.inherited-class, markup.heading.setext, meta.function-call.generic, support.function, support.other.escape.special.regexp	#F36F98	—
entity.name.tag, storage, support.function.builtin, variable.language, constant.numeric, variable.parameter, markup.bold, markup.underline, markup.italic, string.quoted.double.css, punctuation.definition.string.css	#F8C275	—
entity.name.section, keyword, punctuation.definition.heading, punctuation.definition.keyword, keyword.other.DML.sql, constant.character.escape.markdown, entity.other.attribute-name.class.css	#E752A1	—
meta.brace, punctuation.definition.arguments, punctuation.definition.array, punctuation.definition.begin.bracket, punctuation.definition.binding-pattern, punctuation.definition.block, punctuation.definition.bracket, punctuation.definition.dict, punctuation.definition.dictionary, punctuation.definition.end.bracket, punctuation.definition.list, punctuation.definition.parameters, punctuation.definition.string, punctuation.definition.tag, punctuation.other.comma, punctuation.other.period, punctuation.section, punctuation.support, punctuation.terminator	#FBD3E1	—
punctuation.definition.template-expression, punctuation.section.embedded, storage, markup.deleted, markup.heading, entity.name.section.markdown, token.error-token	#E34F8C	—
markup.changed, entity.name.filename.find-in-files, markup.quote, keyword.other.unit.px.css, keyword.other.unit.fr.css, keyword.other.unit.s.css, keyword.other.unit.percentage.css	#FAFAA0	—
markup.fenced_code.block.markdown, keyword.type, keyword.other.alias.sql, meta.functiona.variable.css, variable.argument.css, constant.numeric.line-number.find-in-files - match	#C7ADFB	—
variable, text.html.markdown, support.constant.property-value.css	#FCF6FF	—
beginning.punctuation.definition.list.markdown, constant.language.null, constant.language.boolean.true, constant.language.boolean.false, entity.other.attribute-name.pseudo-element.css	#F39B35	—
constant.language.python	#d428ff	—
meta.link.inline.markdown, meta.image.inline.markdown, markup.underline.link	#99DDFF	—
markup.bold.markdown, punctuation.definition.bold.markdown	—	bold
entity.other.inherited-class, entity.name.type, entity.name.class, entity.other.inherited-class	—	underline
source.python meta.member.access.python meta.item-access.python meta.indexed-name.python	#EBCB8B	—
source.python meta.member.access.python meta.function-call.python meta.function-call.arguments.python meta.member.access.python meta.attribute.python, source.python meta.member.access.python meta.item-access.python meta.item-access.arguments.python meta.member.access.python meta.attribute.python	#EB8BAB	—
source.python meta.member.access.python meta.attribute.python	#EB8BDB	—
source.python meta.member.access.python meta.function-call.python meta.function-call.arguments.python, source.python meta.function-call.python meta.function-call.arguments.python	#EFD5FC	—
source.python keyword.control.flow.python	#FF6542	—
string.quoted.docstring	#B4DC7F	—
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}!`;
}