Nighty Purple

Name: Nighty Purple
Author: ExBrain

Publisher: ExBrainThemes in package: 1

Nighty Purple theme for Visual Studio Code

GitHub

VS Code preview

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

Nighty Purple — Nighty Purple

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#1e1e2e
activityBar.foreground#E8E5FF
badge.background#3A364E
badge.foreground#E8E5FF
button.background#35314c
button.foreground#E8E5FF
button.hoverBackground#35314C
button.secondaryBackground#262335
button.secondaryForeground#E8E5FF
button.secondaryHoverBackground#35314C
checkbox.background#262335
checkbox.border#1B1926
checkbox.foreground#E8E5FF
debugToolBar.background#1B1926
diffEditor.insertedTextBackground#4b661680
diffEditor.removedTextBackground#90274A70
dropdown.background#262335
dropdown.border#35314C
dropdown.foreground#E8E5FF
dropdown.listBackground#262335
editor.background#1e1e2e
editor.findMatchBackground#1B1926
editor.findMatchBorder#111111
editor.findMatchHighlightBackground#35314C
editor.findMatchHighlightBorder#111111
editor.foreground#d0d4ee
editor.lineHighlightBackground#35314C
editor.selectionBackground#35314C
editor.selectionHighlightBackground#35314C
editor.wordHighlightBackground#4a4a7680
editor.wordHighlightStrongBackground#6a6a9680
editorCursor.background#00000000
editorCursor.foreground#E8E5FF
editorGroup.border#35314C
editorGroup.dropBackground#35314C66
editorGroupHeader.border#35314C
editorGroupHeader.noTabsBackground#1B1926
editorGroupHeader.tabsBackground#1B1926
editorGroupHeader.tabsBorder#35314C
editorHoverWidget.background#262335
editorHoverWidget.border#9997AA
editorIndentGuide.activeBackground1#9997AA
editorIndentGuide.background1#9997AA80
editorLineNumber.activeForeground#9997AA
editorLineNumber.foreground#9997AA80
editorLink.activeForeground#B2EBF2
editorRuler.foreground#FFFFFF10
editorSuggestWidget.background#262335
editorSuggestWidget.border#9997AA
editorWhitespace.foreground#9997AA60
editorWidget.background#1B1926
focusBorder#9997AA
input.background#262335
input.border#35314C
input.foreground#E8E5FF
inputOption.activeBorder#9997AA
inputValidation.errorBackground#994d4d
inputValidation.errorBorder#cc6666
inputValidation.errorForeground#E8E5FF
inputValidation.infoBackground#4d8099
inputValidation.infoBorder#66aacc
inputValidation.infoForeground#E8E5FF
inputValidation.warningBackground#99994d
inputValidation.warningBorder#cccc66
inputValidation.warningForeground#E8E5FF
list.activeSelectionBackground#35314C
list.activeSelectionForeground#E8E5FF
list.dropBackground#3A364E
list.focusBackground#3A364E
list.highlightForeground#EEEEEE
list.hoverBackground#35314C
list.inactiveSelectionBackground#35314C
list.inactiveSelectionForeground#E8E5FF
menu.background#262335
menu.border#9997AA
menu.foreground#E8E5FF
menu.selectionBackground#35314C
menu.selectionBorder#35314C
menu.selectionForeground#E8E5FF
menu.separatorBackground#E8E5FF
menubar.selectionBackground#35314C
menubar.selectionBorder#1B1926
menubar.selectionForeground#E8E5FF
minimap.background#262335
minimap.errorHighlight#CC2652
minimap.findMatchHighlight#8BD5BF
minimap.selectionHighlight#729FCF
minimap.warningHighlight#F9F871
panel.background#262335
panel.border#3A364E
panelTitle.activeBorder#E8E5FF
panelTitle.activeForeground#E8E5FF
panelTitle.inactiveForeground#9997AA
peekView.border#E8E5FF
peekViewEditor.background#262335
peekViewEditor.matchHighlightBackground#35314C
peekViewResult.background#1B1926
peekViewResult.matchHighlightBackground#35314C
peekViewResult.selectionBackground#35314C
peekViewTitle.background#262335
pickerGroup.foreground#9997AA
progressBar.background#56ADBC
scrollbar.shadow#E8E5FF08
scrollbarSlider.activeBackground#66666688
scrollbarSlider.background#33333388
scrollbarSlider.hoverBackground#66666688
selection.background#9997AA90
settings.focusedRowBackground#35314C80
sideBar.background#181825
sideBar.border#35314C
sideBar.foreground#E8E5FF
sideBarSectionHeader.background#262335
sideBarSectionHeader.border#35314C
sideBarSectionHeader.foreground#E8E5FF
statusBar.background#181825
statusBar.border#35314C
statusBar.debuggingBackground#1B1926
statusBar.debuggingBorder#35314C
statusBar.debuggingForeground#E8E5FF
statusBar.foreground#E8E5FF
statusBar.noFolderBackground#1B1926
statusBarItem.hoverBackground#35314C
statusBarItem.remoteBackground#AC6218
tab.activeBackground#262335
tab.activeForeground#E8E5FF
tab.border#1B1926
tab.inactiveBackground#3A364E
tab.inactiveForeground#9997AA
tab.lastPinnedBorder#9997AA
terminal.ansiBlack#333333
terminal.ansiBlue#6A7EC8
terminal.ansiBrightBlack#666666
terminal.ansiBrightBlue#819aff
terminal.ansiBrightCyan#66D9EF
terminal.ansiBrightGreen#A6E22E
terminal.ansiBrightMagenta#AE81FF
terminal.ansiBrightRed#f92672
terminal.ansiBrightWhite#f8f8f2
terminal.ansiBrightYellow#e2e22e
terminal.ansiCyan#56ADBC
terminal.ansiGreen#86B42B
terminal.ansiMagenta#8C6BC8
terminal.ansiRed#C4265E
terminal.ansiWhite#e3e3dd
terminal.ansiYellow#B3B42B
titleBar.activeBackground#1B1926
widget.shadow#00000044

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
	#F8F8F2	—
meta.embedded, source.groovy.embedded	#F8F8F2	—
comment	#555555	italic
string	#F9F871	—
punctuation.definition.template-expression, punctuation.section.embedded	#F92672	—
meta.template.expression	#F8F8F2	—
constant.numeric	#729FCF	—
constant.language	#C790C9	—
constant.character, constant.other	#AE81FF	—
variable	#E8E5FF
keyword	#A5586B	—
keyword.control	#DF7F69	—
storage	#CC2652
storage.type	#CC2652	italic
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution	#FDB662	—
entity.other.inherited-class	#FDB662	italic
entity.name.function	#8BD5BF
variable.parameter	#b9bcba	italic
entity.name.tag	#DF7F69
entity.other.attribute-name	#A6E22E
support.function	#66D9EF
support.constant	#66D9EF
support.type, support.class	#FDB662	italic
support.other.variable	—
invalid	#F44747
invalid.deprecated	#F44747	—
meta.structure.dictionary.json string.quoted.double.json	#CFCFC2	—
meta.diff, meta.diff.header	#75715E	—
markup.deleted	#F92672	—
markup.inserted	#A6E22E	—
markup.changed	#E6DB74	—
constant.numeric.line-number.find-in-files - match	#AE81FFA0	—
entity.name.filename.find-in-files	#E6DB74	—
markup.quote	#F92672	—
markup.list	#E6DB74	—
markup.bold, markup.italic	#66D9EF	—
markup.inline.raw	#FD971F
markup.heading	#A6E22E	—
markup.heading.setext	#A6E22E	bold
markup.heading.markdown	—	bold
markup.quote.markdown	#75715E	italic
markup.bold.markdown	—	bold
string.other.link.title.markdown,string.other.link.description.markdown	#AE81FF	—
markup.underline.link.markdown,markup.underline.link.image.markdown	#E6DB74	—
markup.italic.markdown	—	italic
markup.list.unnumbered.markdown, markup.list.numbered.markdown	#f8f8f2	—
punctuation.definition.list.begin.markdown	#A6E22E	—
token.info-token	#6796e6	—
token.warn-token	#cd9731	—
token.error-token	#f44747	—
token.debug-token	#b267e6	—
variable.language	#CC2652	—

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