Night Fox

Name: Night Fox
Author: Rotfuchs-von-Vulpes

Publisher: Rotfuchs-von-VulpesThemes in package: 4

Theme inspired by Night Wolf

Open in VS Code GitHub

Color themes

VS Code preview

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

Night Fox — Night Fox (Dark Blue) (no italics)

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

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

Dark+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBackground#1a1926
activityBar.activeBorder#ff5614
activityBar.background#141320
activityBar.foreground#bdbdbd
activityBarBadge.background#ff5614
button.background#ff5614
checkbox.border#ff5614
dropdown.background#141320
editor.background#1a1926
editorGroup.dropBackground#14132083
editorGroupHeader.tabsBackground#141320
editorWidget.background#141320
focusBorder#ff5614
foreground#bdbdbd
input.background#141320
list.activeSelectionBackground#94320c
list.dropBackground#531d07
list.hoverBackground#1a1926
list.inactiveSelectionBackground#28263a
minimap.background#171621
minimap.selectionHighlight#ff5614
panelTitle.activeBorder#ff5614
settings.modifiedItemIndicator#ff5614
sideBar.background#171621
sideBarSectionHeader.background#141320
tab.activeBorder#ff5614
tab.inactiveBackground#171621
textLink.activeForeground#ff5614
textLink.foreground#ff5614
titleBar.activeBackground#141320
titleBar.inactiveBackground#141320
titleBar.inactiveForeground#686868

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
punctuation.definition.directive, entity.other.attribute-name, punctuation.definition.entity, keyword.control, keyword.other.enum.cs, keyword.other.namespace.cs, keyword.other.sql, keyword.other.julia, keyword.operator.relation.in.julia, keyword.package.import.d, keyword.other.protections.d, keyword.package.module.d, keyword.other.package.hx	#9696FF	—
punctuation, variable.other.property.js	#cecece	—
comment, punctuation.definition.comment, comment.block.documentation.js, punctuation.definition.bold.markdown, punctuation.definition.italic.markdown, punctuation.definition.raw.markdown	#6a698f	—
markup.bold.markdown	#6a698f	—
markup.italic.markdown	#6a698f	—
storage, keyword.other.class.cs, keyword.local.lua	#00B4FF	—
variable, meta.method.body.java, entity.name.variable.parameter.cs, entity.name.variable.local.cs	#FFDC96	—
variable.other.constant	#ffbf48	—
entity.name.function, entity.other.attribute-name.class, entity.name.function.cs, support.function.any-method.lua, support.function.julia	#00DCDC	—
entity.name.type.class, entity.name.type.interface, entity.name.type.enum.cs, entity.name.type.enum.ts, entity.name.type.namespace.cs, entity.name.type.namespace.ts, entity.name.type.ts, entity.name.type.module.js, entity.name.type.module.ts, entity.name.type.struct.d, entity.name.class.d, entity.name.type.hx	#B267E6	—
keyword.operator, variable.language.this, variable.language.self.lua, entity.name.tag, meta.tag.block.any.html, punctuation.definition.tag, variable.language.dart, keyword.token.this.d	#FF7878	—
keyword.operator.logical, keyword.operator.comparison, keyword.operator.relational, keyword.operator.boolean.julia, keyword.operator.comparison.julia, keyword.operator.relation.julia, constant.language.boolean	#DC8CFF	—
support, keyword.type.cs, keyword.other.typedef.c, entity.name.function.preprocessor.c, entity.name.type.template.d	#71cbff	—
constant	#F78C6C	—
keyword.other.unit	#d17063	—
string, punctuation.definition.string	#AAE682	—
source.json meta.structure.dictionary.json support.type.property-name.json	#FF5370	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#F78C6C	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#FFCB6B	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#C3E88D	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#82AAFF	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#5d51ff	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#a33ae9	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#C792EA	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#C3E88D	—
storage.type.class.jsdoc, punctuation.definition.block.tag.jsdoc	#00b3ff80	—
variable.other.jsdoc	#ffbf4877	—

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