Forest Night - Ethereal

Name: Forest Night - Ethereal
Author: Forrest Knight

Publisher: Forrest KnightThemes in package: 1

A mystical, nature-inspired VS Code theme blending ethereal magic with moonlit forest ambiance

Open in VS Code GitHub

VS Code preview

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

Forest Night - Ethereal — Forest Night - Ethereal

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#1a2125
activityBar.border#1a2125
activityBar.foreground#c9d1d9
activityBar.inactiveForeground#6b7280
activityBarBadge.background#5a6b5a
activityBarBadge.foreground#ffffff
breadcrumb.activeSelectionForeground#4ECDC4
breadcrumb.background#1a2125
breadcrumb.focusForeground#c9d1d9
breadcrumb.foreground#6b7280
breadcrumbPicker.background#1a2125
button.background#9B59B6
button.border#9B59B6
button.foreground#ffffff
button.hoverBackground#8e4ec6
colorPicker.background#1a2125
colorPicker.border#2a2e33
colorPicker.foreground#c9d1d9
contrastActiveBorder#6b8fa3
contrastBorder#1a2125
debugConsole.errorForeground#c78a7a
debugConsole.infoForeground#4ECDC4
debugConsole.sourceForeground#c9d1d9
debugConsole.warningForeground#F39C12
debugConsoleInputIcon.foreground#c9d1d9
debugExceptionWidget.background#1a2125
debugExceptionWidget.border#c78a7a
debugIcon.breakpointCurrentStackframeForeground#4ECDC4
debugIcon.breakpointDisabledForeground#6b7280
debugIcon.breakpointForeground#c78a7a
debugIcon.breakpointStackframeForeground#8FBC8F
debugIcon.breakpointUnverifiedForeground#F39C12
debugIcon.continueForeground#8FBC8F
debugIcon.disconnectForeground#c78a7a
debugIcon.pauseForeground#F39C12
debugIcon.restartForeground#4ECDC4
debugIcon.startForeground#8FBC8F
debugIcon.stepBackForeground#9B59B6
debugIcon.stepIntoForeground#66D9EF
debugIcon.stepOutForeground#66D9EF
debugIcon.stepOverForeground#66D9EF
debugIcon.stopForeground#c78a7a
debugToolBar.background#1a2125
debugToolBar.border#2a2e33
diffEditor.insertedLineBackground#8FBC8F10
diffEditor.insertedTextBackground#8FBC8F20
diffEditor.removedLineBackground#c78a7a10
diffEditor.removedTextBackground#c78a7a20
dropdown.background#1a2125
dropdown.border#2a2e33
dropdown.foreground#c9d1d9
dropdown.listBackground#1a2125
editor.background#1a2125
editor.findMatchBackground#9B59B630
editor.findMatchHighlightBackground#9B59B620
editor.foreground#c9d1d9
editor.inactiveSelectionBackground#252e38
editor.selectionBackground#3a4a55
editor.selectionHighlightBackground#3a4a55
editor.selectionHighlightBorder#4ECDC440
editor.symbolHighlightBackground#4ECDC420
editor.symbolHighlightBorder#4ECDC460
editor.wordHighlightBackground#4ECDC420
editor.wordHighlightBorder#4ECDC440
editor.wordHighlightStrongBackground#4ECDC430
editor.wordHighlightStrongBorder#4ECDC460
editorBracketHighlight.foreground1#8FBC8F
editorBracketHighlight.foreground2#4ECDC4
editorBracketHighlight.foreground3#c78a7a
editorBracketHighlight.foreground4#F39C12
editorBracketHighlight.foreground5#66D9EF
editorBracketHighlight.foreground6#FFB74D
editorBracketHighlight.unexpectedBracket.foreground#c78a7a
editorBracketMatch.background#3a4a5540
editorBracketMatch.border#6b8fa3
editorBracketPairGuide.activeBackground1#8FBC8F
editorBracketPairGuide.activeBackground2#4ECDC4
editorBracketPairGuide.activeBackground3#c78a7a
editorBracketPairGuide.activeBackground4#F39C12
editorBracketPairGuide.activeBackground5#66D9EF
editorBracketPairGuide.activeBackground6#FFB74D
editorBracketPairGuide.background1#8FBC8F40
editorBracketPairGuide.background2#4ECDC440
editorBracketPairGuide.background3#c78a7a40
editorBracketPairGuide.background4#F39C1240
editorBracketPairGuide.background5#66D9EF40
editorBracketPairGuide.background6#FFB74D40
editorCodeLens.foreground#6b7280
editorCursor.foreground#6b8fa3
editorError.foreground#c78a7a
editorGroup.border#1a2125
editorGroupHeader.border#1a2125
editorGroupHeader.tabsBackground#1a2125
editorGroupHeader.tabsBorder#1a2125
editorGutter.background#1a2125
editorGutter.foldingControlForeground#6b7280
editorHint.foreground#8FBC8F
editorIndentGuide.activeBackground#4ECDC4
editorIndentGuide.background#2a2e33
editorInfo.foreground#4ECDC4
editorInlayHint.background#2a2e3340
editorInlayHint.foreground#6b7280
editorInlayHint.parameterBackground#2a2e3340
editorInlayHint.parameterForeground#6b7280
editorInlayHint.typeBackground#2a2e3340
editorInlayHint.typeForeground#8fa1b3
editorLineNumber.activeForeground#6b8fa3
editorLineNumber.foreground#4a5568
editorOverviewRuler.addedForeground#8FBC8F
editorOverviewRuler.border#2a2e33
editorOverviewRuler.commonContentForeground#8FBC8F
editorOverviewRuler.currentContentForeground#4ECDC4
editorOverviewRuler.deletedForeground#c78a7a
editorOverviewRuler.errorForeground#c78a7a
editorOverviewRuler.findMatchForeground#9B59B6
editorOverviewRuler.incomingContentForeground#9B59B6
editorOverviewRuler.infoForeground#4ECDC4
editorOverviewRuler.modifiedForeground#F39C12
editorOverviewRuler.rangeHighlightForeground#4ECDC4
editorOverviewRuler.selectionHighlightForeground#9B59B640
editorOverviewRuler.warningForeground#F39C12
editorOverviewRuler.wordHighlightForeground#4ECDC440
editorOverviewRuler.wordHighlightStrongForeground#4ECDC460
editorPane.background#1a2125
editorRuler.foreground#2a2e33
editorStickyScroll.background#1a2125
editorStickyScrollHover.background#2d3540
editorSuggestWidget.background#1a2125
editorSuggestWidget.border#2a2e33
editorSuggestWidget.focusHighlightForeground#4ECDC4
editorSuggestWidget.foreground#c9d1d9
editorSuggestWidget.highlightForeground#4ECDC4
editorSuggestWidget.selectedBackground#2d3540
editorSuggestWidget.selectedForeground#c9d1d9
editorSuggestWidget.selectedIconForeground#4ECDC4
editorWarning.foreground#F39C12
editorWhitespace.foreground#4a5568
errorWidget.background#1a2125
errorWidget.border#c78a7a
errorWidget.foreground#c78a7a
extensionButton.prominentBackground#9B59B6
extensionButton.prominentForeground#ffffff
extensionButton.prominentHoverBackground#8e4ec6
focusBorder#6b8fa3
gitDecoration.addedResourceForeground#8FBC8F
gitDecoration.conflictingResourceForeground#c78a7a
gitDecoration.deletedResourceForeground#c78a7a
gitDecoration.ignoredResourceForeground#4a5568
gitDecoration.modifiedResourceForeground#F39C12
gitDecoration.renamedResourceForeground#66D9EF
gitDecoration.stageDeletedResourceForeground#c78a7a
gitDecoration.stageModifiedResourceForeground#F39C12
gitDecoration.submoduleResourceForeground#4ECDC4
gitDecoration.untrackedResourceForeground#8FBC8F
gitlens.gutterBackgroundColor#1a2125
gitlens.gutterForegroundColor#6b7280
gitlens.gutterUncommittedForegroundColor#F39C12
gitlens.trailingLineForegroundColor#4a5568
infoWidget.background#1a2125
infoWidget.border#4ECDC4
infoWidget.foreground#4ECDC4
input.background#1a2125
input.border#2a2e33
input.foreground#c9d1d9
input.placeholderForeground#6b7280
inputOption.activeBackground#9B59B620
inputOption.activeBorder#9B59B6
inputOption.activeForeground#9B59B6
inputValidation.errorBackground#1a2125
inputValidation.errorBorder#c78a7a
inputValidation.errorForeground#c78a7a
inputValidation.infoBackground#1a2125
inputValidation.infoBorder#4ECDC4
inputValidation.infoForeground#4ECDC4
inputValidation.warningBackground#1a2125
inputValidation.warningBorder#F39C12
inputValidation.warningForeground#F39C12
list.activeSelectionBackground#3a4a55
list.activeSelectionForeground#c9d1d9
list.dropBackground#4ECDC430
list.focusBackground#3a4a55
list.focusForeground#c9d1d9
list.highlightForeground#4ECDC4
list.hoverBackground#222a30
list.hoverForeground#c9d1d9
list.inactiveSelectionBackground#252e38
list.inactiveSelectionForeground#c9d1d9
menu.background#1a2125
menu.foreground#c9d1d9
menu.selectionBackground#2d3540
menu.selectionForeground#c9d1d9
menu.separatorBackground#2a2e33
menubar.selectionBackground#2d3540
menubar.selectionForeground#c9d1d9
merge.border#2a2e33
merge.commonContentBackground#8FBC8F20
merge.commonHeaderBackground#8FBC8F40
merge.currentContentBackground#4ECDC420
merge.currentHeaderBackground#4ECDC440
merge.incomingContentBackground#9B59B620
merge.incomingHeaderBackground#9B59B640
messageWidget.background#1a2125
messageWidget.border#2a2e33
messageWidget.foreground#c9d1d9
minimap.background#1a2125
minimap.errorHighlight#c78a7a
minimap.findMatchHighlight#9B59B6
minimap.selectionHighlight#3a4a55
minimap.warningHighlight#F39C12
minimapGutter.addedBackground#8FBC8F
minimapGutter.deletedBackground#c78a7a
minimapGutter.modifiedBackground#F39C12
minimapSlider.activeBackground#2a354080
minimapSlider.background#2a354040
minimapSlider.hoverBackground#2a354060
notebook.cellBorderColor#2a2e33
notebook.cellHoverBackground#2d3540
notebook.cellInsertionIndicator#4ECDC4
notebook.cellStatusBarItemHoverBackground#2d3540
notebook.cellToolbarSeparator#2a2e33
notebook.editorBackground#1a2125
notebook.focusedCellBackground#1a2125
notebook.focusedCellBorder#4ECDC4
notebook.focusedEditorBorder#4ECDC4
notebook.inactiveFocusedCellBorder#2a2e33
notebook.outputContainerBackgroundColor#1a2125
notebook.outputContainerBorderColor#2a2e33
notebook.selectedCellBackground#2d3540
notebook.selectedCellBorder#6b8fa3
notebook.symbolHighlightBackground#4ECDC420
notebookScrollbarSlider.activeBackground#2a354080
notebookScrollbarSlider.background#2a354040
notebookScrollbarSlider.hoverBackground#2a354060
notebookStatusErrorIcon.foreground#c78a7a
notebookStatusRunningIcon.foreground#F39C12
notebookStatusSuccessIcon.foreground#8FBC8F
notification.background#1a2125
notification.errorBackground#1a2125
notification.errorForeground#c78a7a
notification.foreground#c9d1d9
notification.infoBackground#1a2125
notification.infoForeground#4ECDC4
notification.warningBackground#1a2125
notification.warningForeground#F39C12
notificationCenter.border#2a2e33
notificationCenterHeader.background#1a2125
notificationCenterHeader.foreground#4ECDC4
notifications.background#1a2125
notifications.border#2a2e33
notifications.foreground#c9d1d9
notificationsErrorIcon.foreground#c78a7a
notificationsInfoIcon.foreground#4ECDC4
notificationsWarningIcon.foreground#F39C12
notificationToast.border#2a2e33
panel.background#1a2125
panel.border#1a2125
panel.foreground#c9d1d9
panelSection.border#2a2e33
panelSection.dropBackground#4ECDC430
panelSectionHeader.background#1a2125
panelSectionHeader.foreground#4ECDC4
panelTitle.activeBorder#8FBC8F
panelTitle.activeForeground#c9d1d9
panelTitle.inactiveForeground#6b7280
peekView.background#1a2125
peekViewEditor.background#1a2125
peekViewEditor.matchHighlightBackground#9B59B650
peekViewResult.background#1a2125
peekViewResult.fileForeground#c9d1d9
peekViewResult.lineForeground#6b7280
peekViewResult.matchHighlightBackground#9B59B630
peekViewResult.selectionBackground#2d3540
peekViewResult.selectionForeground#c9d1d9
peekViewTitle.background#1a2125
peekViewTitleDescription.foreground#6b7280
peekViewTitleLabel.foreground#4ECDC4
problemsErrorIcon.foreground#c78a7a
problemsInfoIcon.foreground#4ECDC4
problemsWarningIcon.foreground#F39C12
progressBar.background#9B59B6
quickInput.background#1a2125
quickInput.foreground#c9d1d9
quickInputTitle.background#1a2125
scrollbar.shadow#00000050
scrollbarSlider.activeBackground#2a354080
scrollbarSlider.background#2a354040
scrollbarSlider.hoverBackground#2a354060
search.resultsInfoForeground#c9d1d9
searchEditor.findMatchBackground#9B59B630
searchEditor.findMatchBorder#9B59B6
searchEditor.textInputBorder#2a2e33
selection.background#3a4a5540
settings.checkboxBackground#1a2125
settings.checkboxBorder#2a2e33
settings.checkboxForeground#4ECDC4
settings.dropdownBackground#1a2125
settings.dropdownBorder#2a2e33
settings.dropdownForeground#c9d1d9
settings.headerForeground#c9d1d9
settings.modifiedItemIndicator#4ECDC4
settings.numberInputBackground#1a2125
settings.numberInputBorder#2a2e33
settings.numberInputForeground#c9d1d9
settings.textInputBackground#1a2125
settings.textInputBorder#2a2e33
settings.textInputForeground#c9d1d9
sideBar.background#1a2125
sideBar.border#1a2125
sideBar.foreground#c9d1d9
sideBarSectionHeader.background#1a2125
sideBarSectionHeader.border#1a2125
sideBarSectionHeader.foreground#4ECDC4
sideBarTitle.foreground#c9d1d9
statusBar.background#1a2125
statusBar.border#1a2125
statusBar.debuggingBackground#F39C12
statusBar.debuggingForeground#1a2125
statusBar.foreground#c9d1d9
statusBar.noFolderBackground#1a2125
statusBar.noFolderForeground#c9d1d9
statusBarItem.activeBackground#3a4a55
statusBarItem.hoverBackground#3a4a55
statusBarItem.remoteBackground#1a2125
statusBarItem.remoteForeground#4ECDC4
tab.activeBackground#1a2125
tab.activeBorder#1a2125
tab.activeBorderTop#8FBC8F
tab.activeForeground#c9d1d9
tab.border#1a2125
tab.hoverBackground#1a2125
tab.hoverBorder#1a2125
tab.hoverForeground#c9d1d9
tab.inactiveBackground#1a2125
tab.inactiveForeground#6b7280
tab.unfocusedActiveForeground#8fa1b3
tab.unfocusedInactiveForeground#4a5568
terminal.ansiBlack#1a2125
terminal.ansiBlue#4ECDC4
terminal.ansiBrightBlack#4a5568
terminal.ansiBrightBlue#66D9EF
terminal.ansiBrightCyan#4ECDC4
terminal.ansiBrightGreen#8FBC8F
terminal.ansiBrightMagenta#9B59B6
terminal.ansiBrightRed#E91E63
terminal.ansiBrightWhite#ffffff
terminal.ansiBrightYellow#F39C12
terminal.ansiCyan#4ECDC4
terminal.ansiGreen#8FBC8F
terminal.ansiMagenta#9B59B6
terminal.ansiRed#E91E63
terminal.ansiWhite#c9d1d9
terminal.ansiYellow#F39C12
terminal.background#1a2125
terminal.foreground#c9d1d9
terminal.selectionBackground#2d3540
testing.iconErrored#c78a7a
testing.iconFailed#c78a7a
testing.iconPassed#8FBC8F
testing.iconQueued#F39C12
testing.iconSkipped#6b7280
testing.iconUnset#6b7280
testing.message.error.decorationForeground#c78a7a
testing.message.error.lineBackground#c78a7a20
testing.message.info.decorationForeground#4ECDC4
testing.message.info.lineBackground#4ECDC420
testing.peekBorder#c78a7a
testing.peekHeaderBackground#1a2125
testing.runAction#8FBC8F
titleBar.activeBackground#1a2125
titleBar.activeForeground#c9d1d9
titleBar.border#1a2125
titleBar.inactiveBackground#1a2125
titleBar.inactiveForeground#6b7280
toolbar.activeBackground#2d3540
toolbar.hoverBackground#2d3540
tooltip.background#1a2125
tooltip.border#2a2e33
tooltip.foreground#c9d1d9
walkThrough.embeddedEditorBackground#1a2125
warningWidget.background#1a2125
warningWidget.border#F39C12
warningWidget.foreground#F39C12
welcomePage.background#1a2125
welcomePage.progress.background#2a2e33
welcomePage.progress.foreground#9B59B6
welcomePage.tileBackground#1a2125
welcomePage.tileBorder#2a2e33
welcomePage.tileHoverBackground#2d3540
widget.border#2a2e33
widget.shadow#00000050
window.activeBorder#1a2125
window.inactiveBorder#1a2125

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment, comment.line, comment.block	#4a5568	italic
comment.line.double-slash keyword, comment.block keyword	#6b7280	italic bold
variable, variable.other, variable.parameter, variable.language, variable.other.readwrite	#c9d1d9	—
variable.other.destructuring	#66D9EF	—
entity.name.function, meta.function-call entity.name.function, meta.function-call variable.function, support.function, keyword.other.special-method, meta.method-call entity.name.function	#9B59B6	—
support.function.builtin, support.function.construct, support.function.magic	#9B59B6	bold
string, string.quoted, string.quoted.single, string.quoted.double, string.quoted.triple, punctuation.definition.string	#4ECDC4	—
string.template, string.quoted.template	#66D9EF	—
constant.character.escape, constant.other.placeholder	#F39C12	bold
string.regexp, constant.other.character-class.regexp, constant.character.escape.regexp	#c78a7a	—
variable.other.property, variable.other.object.property, variable.other.property.js, meta.object-literal.key, support.type.property-name	#66D9EF	—
support.type.property-name.json, meta.structure.dictionary.key.json string.quoted.double.json	#66D9EF	—
keyword, keyword.control, keyword.operator.new, keyword.other.special-method, storage.type, storage.modifier	#F39C12	—
keyword.control.flow, keyword.control.conditional, keyword.control.loop	#F39C12	bold
keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as	#F39C12	italic
entity.name.type, entity.other.inherited-class, support.type, support.class, storage.type.built-in, entity.name.class, entity.name.namespace, entity.name.scope-resolution	#c78a7a	—
entity.name.type.parameter, meta.type.parameters entity.name.type	#c78a7a	italic
constant, variable.other.constant, support.constant, constant.language	#8FBC8F	—
constant.numeric, constant.numeric.integer, constant.numeric.float, constant.numeric.hex, constant.numeric.binary, constant.numeric.octal	#8FBC8F	—
constant.language.boolean, constant.language.null, constant.language.undefined	#8FBC8F	—
keyword.operator, keyword.operator.arithmetic, keyword.operator.comparison, keyword.operator.logical, keyword.operator.assignment	#c9d1d9	—
keyword.operator.ternary, keyword.operator.spread, keyword.operator.rest	#F39C12	—
punctuation, punctuation.separator, punctuation.terminator, punctuation.accessor	#8fa1b3	—
punctuation.section.brackets, punctuation.section.parens, punctuation.section.braces, meta.brace.round, meta.brace.square, meta.brace.curly	#c9d1d9	—
entity.name.tag, punctuation.definition.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html	#F39C12	—
entity.other.attribute-name, entity.other.attribute-name.html, entity.other.attribute-name.localname.xml	#4ECDC4	—
string.quoted.double.html, string.quoted.single.html	#66D9EF	—
meta.tag.sgml.doctype, punctuation.definition.tag.html	#6b7280	—
entity.name.tag.css, entity.other.attribute-name.class.css, entity.other.attribute-name.id.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css	#F39C12	—
support.type.property-name.css, meta.property-name.css	#4ECDC4	—
support.constant.property-value.css, constant.numeric.css, keyword.other.unit.css	#8FBC8F	—
support.function.css	#9B59B6	—
variable.language.this, variable.language.super	#c78a7a	—
entity.name.function.decorator, meta.decorator variable.other.readwrite, meta.decorator punctuation.decorator	#F39C12	—
storage.type.function.arrow	#F39C12	—
markup.heading, entity.name.section.markdown, punctuation.definition.heading.markdown	#F39C12	bold
markup.bold, punctuation.definition.bold.markdown	#c9d1d9	bold
markup.italic, punctuation.definition.italic.markdown	#c9d1d9	italic
markup.inline.raw, markup.fenced_code, punctuation.definition.markdown	#4ECDC4	—
markup.underline.link, string.other.link.title.markdown, string.other.link.description.markdown	#66D9EF	underline
punctuation.definition.list.begin.markdown, markup.list.numbered.markdown, markup.list.unnumbered.markdown	#F39C12	—
markup.quote.markdown, punctuation.definition.blockquote.markdown	#6b7280	italic
entity.name.tag.yaml	#4ECDC4	—
string.unquoted.yaml	#c9d1d9	—
invalid, invalid.illegal	#c78a7a	strikethrough
invalid.deprecated	#F39C12	strikethrough
comment.block.documentation, comment.line.documentation	#6b7280	italic
storage.type.class.jsdoc, entity.name.type.instance.jsdoc	#4ECDC4	—
entity.name.function.decorator.python, meta.function.decorator.python	#F39C12	—
storage.type.string.python	#66D9EF	—
support.function.magic.python	#9B59B6	bold
variable.other.php, punctuation.definition.variable.php	#c9d1d9	—
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php	#F39C12	—
constant.other.git.commit-hash	#4ECDC4	—
entity.name.tag.git	#8FBC8F	—
keyword.other.sql	#F39C12	bold
support.function.sql	#9B59B6	—
variable.other.normal.shell, variable.other.positional.shell	#c9d1d9	—
support.function.builtin.shell	#9B59B6	—
markup.inserted	#8FBC8F	—
markup.deleted	#c78a7a	—
markup.changed	#F39C12	—
entity.name.function.macro	#F39C12	bold
entity.name.label	#c78a7a	—
storage.type.annotation	#F39C12	—
storage.type.generic	#c78a7a	italic
support.class.component.jsx, support.class.component.tsx	#c78a7a	—
entity.name.tag.template.html	#8FBC8F	—
support.type.property-name.package.json	#c78a7a	—
variable.other.env	#F39C12	—

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