Aurora Borealis Studio Theme

Name: Aurora Borealis Studio Theme
Author: lohsebhipolg2s

Publisher: lohsebhipolg2sThemes in package: 2

A mesmerizing VS Code theme inspired by the Northern Lights with ethereal greens, mystical purples, and arctic blues

Open in VS Code GitHub

Color themes

VS Code preview

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

Aurora Borealis Studio Theme — Aurora Borealis Soft

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#81C78420
activityBar.activeBorder#81C784
activityBar.background#1E2A38
activityBar.foreground#81C784
activityBar.inactiveForeground#90A4AE
activityBarBadge.background#BA68C8
activityBarBadge.foreground#FFFFFF
badge.background#81C784
badge.foreground#1A2332
breadcrumb.activeSelectionForeground#D1E7F0
breadcrumb.background#1A2332
breadcrumb.focusForeground#81C784
breadcrumb.foreground#90A4AE
breadcrumbPicker.background#263238
button.background#81C784
button.foreground#1A2332
button.hoverBackground#66BB6A
button.secondaryBackground#BA68C8
button.secondaryForeground#FFFFFF
button.secondaryHoverBackground#AB47BC
diffEditor.insertedTextBackground#81C78420
diffEditor.removedTextBackground#E5737320
dropdown.background#263238
dropdown.border#455A64
dropdown.foreground#D1E7F0
editor.background#1A2332
editor.findMatchBackground#FFB74D60
editor.findMatchHighlightBackground#FFB74D30
editor.findRangeHighlightBackground#81C78420
editor.foldBackground#455A6420
editor.foreground#D1E7F0
editor.hoverHighlightBackground#455A6430
editor.lineHighlightBorder#455A6440
editor.rangeHighlightBackground#81C78420
editor.selectionBackground#81C78430
editor.selectionHighlightBackground#81C78420
editor.wordHighlightBackground#64B5F630
editor.wordHighlightStrongBackground#BA68C830
editorBracketHighlight.foreground1#81C784
editorBracketHighlight.foreground2#BA68C8
editorBracketHighlight.foreground3#64B5F6
editorBracketHighlight.foreground4#FFB74D
editorBracketHighlight.foreground5#FFAB91
editorBracketHighlight.foreground6#4DD0E1
editorBracketHighlight.unexpectedBracket.foreground#E57373
editorError.foreground#E57373
editorGroup.border#455A64
editorGroup.dropBackground#81C78420
editorGroupHeader.tabsBackground#1E2A38
editorGutter.addedBackground#81C784
editorGutter.deletedBackground#E57373
editorGutter.modifiedBackground#FFB74D
editorHoverWidget.background#263238
editorHoverWidget.border#455A64
editorInfo.foreground#64B5F6
editorLineNumber.activeForeground#81C784
editorLineNumber.foreground#607D8B
editorLink.activeForeground#64B5F6
editorOverviewRuler.addedForeground#81C784
editorOverviewRuler.border#455A64
editorOverviewRuler.deletedForeground#E57373
editorOverviewRuler.errorForeground#E57373
editorOverviewRuler.infoForeground#64B5F6
editorOverviewRuler.modifiedForeground#FFB74D
editorOverviewRuler.selectionHighlightForeground#81C78480
editorOverviewRuler.warningForeground#FFB74D
editorOverviewRuler.wordHighlightForeground#64B5F680
editorOverviewRuler.wordHighlightStrongForeground#BA68C880
editorSuggestWidget.background#263238
editorSuggestWidget.foreground#D1E7F0
editorSuggestWidget.selectedBackground#81C78430
editorWarning.foreground#FFB74D
editorWidget.background#263238
editorWidget.border#455A64
errorForeground#E57373
focusBorder#81C784
foreground#D1E7F0
gitDecoration.conflictingResourceForeground#BA68C8
gitDecoration.deletedResourceForeground#E57373
gitDecoration.ignoredResourceForeground#607D8B
gitDecoration.modifiedResourceForeground#FFB74D
gitDecoration.untrackedResourceForeground#81C784
input.background#263238
input.border#455A64
input.foreground#D1E7F0
input.placeholderForeground#90A4AE
inputOption.activeBorder#81C784
inputValidation.errorBorder#E57373
inputValidation.infoBorder#64B5F6
inputValidation.warningBorder#FFB74D
list.activeSelectionBackground#81C78420
list.activeSelectionForeground#81C784
list.dropBackground#81C78430
list.errorForeground#E57373
list.focusBackground#455A6440
list.highlightForeground#81C784
list.hoverBackground#455A6420
list.inactiveSelectionBackground#455A6430
list.warningForeground#FFB74D
panel.background#1E2A38
panel.border#455A64
panelTitle.activeBorder#81C784
panelTitle.activeForeground#81C784
panelTitle.inactiveForeground#90A4AE
progressBar.background#81C784
selection.background#81C78430
settings.checkboxBackground#263238
settings.checkboxBorder#455A64
settings.checkboxForeground#81C784
settings.dropdownBackground#263238
settings.dropdownBorder#455A64
settings.dropdownForeground#D1E7F0
settings.headerForeground#81C784
settings.modifiedItemIndicator#FFB74D
settings.numberInputBackground#263238
settings.numberInputBorder#455A64
settings.numberInputForeground#D1E7F0
settings.textInputBackground#263238
settings.textInputBorder#455A64
settings.textInputForeground#D1E7F0
sideBar.background#1E2A38
sideBarSectionHeader.background#263238
sideBarSectionHeader.border#455A64
sideBarTitle.foreground#D1E7F0
statusBar.background#1E2A38
statusBar.debuggingBackground#BA68C8
statusBar.debuggingForeground#FFFFFF
statusBar.foreground#D1E7F0
statusBar.noFolderBackground#455A64
statusBar.noFolderForeground#D1E7F0
statusBarItem.prominentBackground#81C784
statusBarItem.prominentForeground#1A2332
statusBarItem.prominentHoverBackground#66BB6A
statusBarItem.remoteBackground#BA68C8
statusBarItem.remoteForeground#FFFFFF
tab.activeBackground#1A2332
tab.activeBorderTop#81C784
tab.activeForeground#D1E7F0
tab.border#455A64
tab.inactiveBackground#1E2A38
tab.inactiveForeground#90A4AE
terminal.ansiBlack#263238
terminal.ansiBlue#64B5F6
terminal.ansiBrightBlack#455A64
terminal.ansiBrightBlue#90CAF9
terminal.ansiBrightCyan#80DEEA
terminal.ansiBrightGreen#A5D6A7
terminal.ansiBrightMagenta#CE93D8
terminal.ansiBrightRed#FFAB91
terminal.ansiBrightWhite#ECEFF1
terminal.ansiBrightYellow#FFCC02
terminal.ansiCyan#4DD0E1
terminal.ansiGreen#81C784
terminal.ansiMagenta#BA68C8
terminal.ansiRed#E57373
terminal.ansiWhite#D1E7F0
terminal.ansiYellow#FFB74D
terminal.background#1A2332
terminal.foreground#D1E7F0
titleBar.activeBackground#1E2A38
titleBar.activeForeground#D1E7F0
titleBar.inactiveBackground#1A2332
titleBar.inactiveForeground#90A4AE

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
emphasis	—	italic
strong	—	bold
header	#81C784	—
comment, punctuation.definition.comment	#607D8B	italic
comment keyword.codetag.notation, comment.block.documentation keyword	#64B5F6	—
string	#81C784	—
punctuation.definition.string.begin, punctuation.definition.string.end	#66BB6A	—
constant, variable.other.constant	#BA68C8	—
constant.numeric	#FFB74D	—
keyword, storage.type, storage.modifier	#FFAB91	bold
entity.name.function, meta.function-call	#64B5F6	—
variable.parameter	#CE93D8	italic
entity.name.type.class, entity.name.class	#BA68C8	—
entity.name.type, storage.type	#90CAF9	italic
variable	#D1E7F0	—
variable.language	#FFAB91	italic
entity.name.tag	#FFAB91	—
entity.other.attribute-name	#64B5F6	italic
meta.selector	#BA68C8	—
support.type.property-name	#81C784	—
keyword.operator	#4DD0E1	—
punctuation	#80DEEA	—
string.regexp	#FFB74D	—
markup.heading	#81C784	bold
markup.bold	#D1E7F0	bold
markup.italic	#CE93D8	italic
markup.underline.link	#64B5F6	—
markup.inline.raw	#BA68C8	—
invalid	#E57373	underline
invalid.deprecated	#FFAB91	strikethrough

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