Pastel Moonlight Theme

Name: Pastel Moonlight Theme
Author: lilin

Publisher: lilinThemes in package: 2

A soft, modern pastel pink theme for creative developers. Dreamy, minimal, and easy on the eyes — designed for long, cozy coding sessions.

Open in VS Code GitHub

Color themes

VS Code preview

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

Pastel Moonlight Theme — Pastel Moonlight

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

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

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...
~/my-project $

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Light+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBorder#C2528B
activityBar.background#F8E8EE
activityBar.border#F2BED14D
activityBar.foreground#B4637A
activityBar.inactiveForeground#C9A9B4
activityBarBadge.background#C2528B
activityBarBadge.foreground#FFFFFF
badge.background#C2528B
badge.foreground#FFFFFF
breadcrumb.activeSelectionForeground#C2528B
breadcrumb.focusForeground#5C4A52
breadcrumb.foreground#9A8089
breadcrumbPicker.background#FDFBFC
button.background#C2528B
button.foreground#FFFFFF
button.hoverBackground#B0447C
button.secondaryBackground#F2BED1
button.secondaryForeground#5C4048
button.secondaryHoverBackground#EBB3C9
debugToolBar.background#F8E8EE
debugToolBar.border#F2BED1
descriptionForeground#9A8089
diffEditor.insertedTextBackground#A8C8A026
diffEditor.removedTextBackground#E39BA926
dropdown.background#FDFBFC
dropdown.border#F2BED1
dropdown.foreground#5C4A52
editor.background#F9F5F6
editor.findMatchBackground#F2BED1B3
editor.findMatchHighlightBackground#FDCEDF99
editor.foreground#5C4A52
editor.hoverHighlightBackground#FDCEDF66
editor.inactiveSelectionBackground#FDCEDF66
editor.lineHighlightBackground#F8E8EE99
editor.lineHighlightBorder#F8E8EE00
editor.rangeHighlightBackground#F8E8EE99
editor.selectionBackground#FDCEDF
editor.selectionHighlightBackground#FDCEDF80
editor.wordHighlightBackground#F2BED14D
editor.wordHighlightStrongBackground#F2BED180
editorBracketHighlight.foreground1#C2528B
editorBracketHighlight.foreground2#A86798
editorBracketHighlight.foreground3#D08543
editorBracketHighlight.foreground4#739E73
editorBracketMatch.background#F2BED166
editorBracketMatch.border#F2BED1
editorCodeLens.foreground#B99AA6
editorCursor.foreground#C2528B
editorError.foreground#D06A7E
editorGroup.border#F2BED14D
editorGroupHeader.tabsBackground#F8E8EE
editorGroupHeader.tabsBorder#F2BED14D
editorGutter.addedBackground#A8C8A0
editorGutter.background#F9F5F6
editorGutter.deletedBackground#E39BA9
editorGutter.modifiedBackground#E8B4CB
editorHoverWidget.background#FDFBFC
editorHoverWidget.border#F2BED1
editorIndentGuide.activeBackground1#F2BED1
editorIndentGuide.background1#F0E2E8
editorInfo.foreground#8FA8C8
editorLineNumber.activeForeground#B4637A
editorLineNumber.foreground#D3B7C1
editorLink.activeForeground#C2528B
editorRuler.foreground#F0E2E8
editorSuggestWidget.background#FDFBFC
editorSuggestWidget.border#F2BED1
editorSuggestWidget.foreground#5C4A52
editorSuggestWidget.highlightForeground#C2528B
editorSuggestWidget.selectedBackground#FDCEDF
editorSuggestWidget.selectedForeground#4A3B44
editorWarning.foreground#D9A05B
editorWhitespace.foreground#EBDDE3
editorWidget.background#F8E8EE
editorWidget.border#F2BED1
errorForeground#C25469
focusBorder#F2BED1
foreground#5C4A52
gitDecoration.addedResourceForeground#6E9A6E
gitDecoration.conflictingResourceForeground#B4637A
gitDecoration.deletedResourceForeground#C25469
gitDecoration.ignoredResourceForeground#C9A9B4
gitDecoration.modifiedResourceForeground#C08A4B
gitDecoration.untrackedResourceForeground#6E9A6E
icon.foreground#8A6B77
input.background#FDFBFC
input.border#F2BED1
input.foreground#5C4A52
input.placeholderForeground#C9A9B4
inputOption.activeBackground#FDCEDF
inputOption.activeBorder#F2BED1
inputOption.activeForeground#4A3B44
inputValidation.errorBackground#FCEBEE
inputValidation.errorBorder#D06A7E
list.activeSelectionBackground#FDCEDF
list.activeSelectionForeground#4A3B44
list.errorForeground#C25469
list.focusBackground#FDCEDF
list.focusForeground#4A3B44
list.highlightForeground#C2528B
list.hoverBackground#FDF0F5
list.hoverForeground#5C4A52
list.inactiveSelectionBackground#FDCEDF99
list.inactiveSelectionForeground#5C4A52
list.warningForeground#C08A4B
menu.background#FDFBFC
menu.border#F2BED14D
menu.foreground#5C4A52
menu.selectionBackground#FDCEDF
menu.selectionForeground#4A3B44
menubar.selectionBackground#FDCEDF99
minimap.findMatchHighlight#F2BED1
minimap.selectionHighlight#FDCEDF
minimapGutter.addedBackground#A8C8A0
minimapGutter.deletedBackground#E39BA9
minimapGutter.modifiedBackground#E8B4CB
notificationCenterHeader.background#F5DEE8
notificationLink.foreground#C2528B
notifications.background#FDFBFC
notifications.border#F2BED14D
notifications.foreground#5C4A52
panel.background#F8E8EE
panel.border#F2BED1
panelTitle.activeBorder#C2528B
panelTitle.activeForeground#B4637A
panelTitle.inactiveForeground#9A8089
peekView.border#F2BED1
peekViewEditor.background#FDF0F5
peekViewEditor.matchHighlightBackground#F2BED199
peekViewResult.background#F8E8EE
peekViewResult.matchHighlightBackground#FDCEDF
peekViewResult.selectionBackground#FDCEDF
peekViewTitle.background#F5DEE8
peekViewTitleDescription.foreground#9A8089
peekViewTitleLabel.foreground#5C4A52
pickerGroup.border#F2BED1
pickerGroup.foreground#B4637A
progressBar.background#C2528B
quickInput.background#FDFBFC
quickInput.foreground#5C4A52
quickInputList.focusBackground#FDCEDF
quickInputList.focusForeground#4A3B44
scrollbar.shadow#F2BED133
scrollbarSlider.activeBackground#F2BED1CC
scrollbarSlider.background#F2BED166
scrollbarSlider.hoverBackground#F2BED199
selection.background#FDCEDFCC
settings.headerForeground#B4637A
settings.modifiedItemIndicator#C2528B
sideBar.background#F8E8EE
sideBar.border#F2BED14D
sideBar.foreground#6B5560
sideBarSectionHeader.background#F5DEE8
sideBarSectionHeader.border#F2BED133
sideBarSectionHeader.foreground#7A5E6B
sideBarTitle.foreground#8A6B77
statusBar.background#F2BED1
statusBar.border#EBB3C9
statusBar.debuggingBackground#C2528B
statusBar.debuggingForeground#FFFFFF
statusBar.foreground#5C4048
statusBar.noFolderBackground#F2BED1
statusBarItem.hoverBackground#EBB3C9
statusBarItem.remoteBackground#C2528B
statusBarItem.remoteForeground#FFFFFF
tab.activeBackground#F9F5F6
tab.activeBorderTop#C2528B
tab.activeForeground#4A3B44
tab.border#F2BED133
tab.hoverBackground#FDF0F5
tab.inactiveBackground#F8E8EE
tab.inactiveForeground#9A8089
terminal.ansiBlack#5C4A52
terminal.ansiBlue#7A8FBF
terminal.ansiBrightBlack#8A6B77
terminal.ansiBrightBlue#8FA8C8
terminal.ansiBrightCyan#7FB0B0
terminal.ansiBrightGreen#7FAF7F
terminal.ansiBrightMagenta#C2528B
terminal.ansiBrightRed#D06A7E
terminal.ansiBrightWhite#FDFBFC
terminal.ansiBrightYellow#D9A05B
terminal.ansiCyan#6E9A9A
terminal.ansiGreen#6E9A6E
terminal.ansiMagenta#B4637A
terminal.ansiRed#C25469
terminal.ansiWhite#F2E7EC
terminal.ansiYellow#C08A4B
terminal.background#F9F5F6
terminal.foreground#5C4A52
terminalCursor.foreground#C2528B
textBlockQuote.background#F8E8EE
textBlockQuote.border#F2BED1
textCodeBlock.background#F8E8EE
textLink.activeForeground#B0447C
textLink.foreground#C2528B
textPreformat.foreground#B4637A
titleBar.activeBackground#F8E8EE
titleBar.activeForeground#5C4A52
titleBar.border#F2BED133
titleBar.inactiveBackground#F8E8EE
titleBar.inactiveForeground#B99AA6
tree.indentGuidesStroke#EBD3DD
walkThrough.embeddedEditorBackground#F8E8EE
welcomePage.progress.foreground#C2528B
welcomePage.tileBackground#F8E8EE
welcomePage.tileHoverBackground#FDCEDF
widget.shadow#F2BED140

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment, string.comment	#C5A3B1	italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical.python, storage, storage.type, storage.modifier	#C2528B	—
keyword.operator, punctuation.separator.key-value	#B4637A	—
entity.name.function, support.function, meta.function-call.generic, meta.require, variable.function	#A86798	—
variable.parameter, meta.function.parameters variable	#8A6B9E	—
string, string.quoted, string.template, punctuation.definition.string	#739E73	—
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded	#C2528B	—
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant, support.constant	#D08543	—
variable, variable.other.readwrite, meta.definition.variable	#5C4A52	—
variable.other.property, variable.other.object.property, support.variable.property, meta.object-literal.key	#8F6B7C	—
entity.name.type, entity.name.class, entity.other.inherited-class, support.class, support.type, meta.type.annotation entity.name.type, entity.name.type.interface	#B4637A	—
meta.decorator, entity.name.function.decorator, punctuation.decorator	#A86798	italic
entity.name.tag, support.class.component, punctuation.definition.tag	#C2528B	—
support.class.component.jsx, support.class.component.tsx, entity.name.tag.custom	#B4637A	—
entity.other.attribute-name, meta.attribute	#A86798	italic
entity.other.attribute-name.class.css, entity.other.attribute-name.id.css, entity.name.tag.css, source.css entity.other.attribute-name	#C2528B	—
support.type.property-name.css, support.type.vendored.property-name.css	#8F6B7C	—
support.constant.property-value.css, keyword.other.unit.css, constant.numeric.css	#D08543	—
support.type.property-name.json	#B4637A	—
variable.language.special.self.python, variable.language.this, variable.language	#C2528B	italic
support.function.builtin.python	#A86798	—
punctuation, meta.brace	#8A6B77	—
markup.heading, entity.name.section.markdown	#C2528B	bold
markup.bold	#B4637A	bold
markup.italic	#A86798	italic
markup.underline.link, markup.inline.raw, markup.fenced_code.block	#739E73	—
punctuation.definition.list.begin.markdown	#C2528B	—
invalid, invalid.illegal	#C25469	—