Empire VSCode ThemePack

Name: Empire VSCode ThemePack
Author: herohiralal

Publisher: herohiralalThemes in package: 2

Inspired by One Monokai and Oh Lucy.

GitHub

Color themes

VS Code preview

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

Empire VSCode ThemePack — empire-monokai-light

fetchUser.ts

index.ts

README.md

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Light+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.background#dedede
activityBar.foreground#222a56
activityBarBadge.background#887300
activityBarBadge.foreground#d6d6d6
badge.background#887300
badge.foreground#d6d6d6
button.background#bdbdbd
button.foreground#222a56
button.hoverBackground#d6d6d6
debugExceptionWidget.background#bdbdbd
debugExceptionWidget.border#d6d6d6
debugToolBar.background#bdbdbd
descriptionForeground#222a56
diffEditor.insertedTextBackground#0676470d
diffEditor.insertedTextBorder#f2f2f200
diffEditor.removedTextBackground#9900330d
diffEditor.removedTextBorder#f2f2f200
dropdown.background#d6d6d6
dropdown.border#d6d6d6
dropdown.foreground#222a56
dropdown.listBackground#bdbdbd
editor.background#e1e1e1
editor.findMatchBackground#00000026
editor.findMatchBorder#887300
editor.findMatchHighlightBackground#00000026
editor.findMatchHighlightBorder#f2f2f200
editor.findRangeHighlightBackground#0000000d
editor.findRangeHighlightBorder#f2f2f200
editor.foreground#000000
editor.hoverHighlightBackground#0000000d
editor.inactiveSelectionBackground#0000000d
editor.lineHighlightBackground#0000000d
editor.lineHighlightBorder#f2f2f200
editor.rangeHighlightBackground#0676470d
editor.rangeHighlightBorder#0676470d
editor.selectionBackground#bdbdbd
editor.selectionHighlightBackground#00000026
editor.selectionHighlightBorder#f2f2f200
editor.wordHighlightBackground#00000026
editor.wordHighlightBorder#f2f2f200
editor.wordHighlightStrongBackground#00000026
editor.wordHighlightStrongBorder#f2f2f200
editorBracketMatch.background#d6d6d6
editorBracketMatch.border#121a45
editorCodeLens.foreground#121a45
editorCursor.background#f2f2f200
editorCursor.foreground#000000
editorError.border#f2f2f200
editorError.foreground#970032
editorGroup.border#e5e5e5
editorGroup.dropBackground#e1e1e1bf
editorGroupHeader.noTabsBackground#d6d6d6
editorGroupHeader.tabsBackground#d6d6d6
editorGroupHeader.tabsBorder#d6d6d6
editorGutter.addedBackground#067647
editorGutter.background#d6d6d6
editorGutter.deletedBackground#970032
editorGutter.modifiedBackground#984c00
editorHint.border#d6d6d6
editorHint.foreground#330f8a
editorHoverWidget.background#bdbdbd
editorHoverWidget.border#d6d6d6
editorInfo.border#d6d6d6
editorInfo.foreground#007183
editorInlayHint.background#f2f2f200
editorInlayHint.foreground#121a45
editorInlayHint.parameterForeground#50277f
editorInlayHint.typeForeground#222a56
editorLineNumber.activeForeground#50277f
editorLineNumber.foreground#9e9e9e
editorLink.activeForeground#007183
editorMarkerNavigation.background#bdbdbd
editorMarkerNavigationError.background#970032
editorMarkerNavigationInfo.background#007183
editorMarkerNavigationWarning.background#984c00
editorOverviewRuler.addedForeground#067647
editorOverviewRuler.border#d6d6d6
editorOverviewRuler.currentContentForeground#bdbdbd
editorOverviewRuler.deletedForeground#970032
editorOverviewRuler.errorForeground#970032
editorOverviewRuler.findMatchForeground#00000026
editorOverviewRuler.incomingContentForeground#bdbdbd
editorOverviewRuler.infoForeground#007183
editorOverviewRuler.modifiedForeground#984c00
editorOverviewRuler.rangeHighlightForeground#00000026
editorOverviewRuler.selectionHighlightForeground#00000026
editorOverviewRuler.warningForeground#984c00
editorOverviewRuler.wordHighlightForeground#00000026
editorOverviewRuler.wordHighlightStrongForeground#00000026
editorRuler.foreground#9e9e9e
editorSuggestWidget.background#bdbdbd
editorSuggestWidget.border#bdbdbd
editorSuggestWidget.foreground#50277f
editorSuggestWidget.highlightForeground#000000
editorSuggestWidget.selectedBackground#121a45
editorWarning.border#f2f2f200
editorWarning.foreground#984c00
editorWhitespace.foreground#9e9e9e
editorWidget.background#bdbdbd
editorWidget.border#bdbdbd
errorForeground#970032
extensionButton.prominentBackground#bdbdbd
extensionButton.prominentForeground#000000
extensionButton.prominentHoverBackground#9e9e9e
focusBorder#121a45
foreground#000000
gitDecoration.conflictingResourceForeground#984c00
gitDecoration.deletedResourceForeground#970032
gitDecoration.ignoredResourceForeground#9e9e9e
gitDecoration.modifiedResourceForeground#067647
gitDecoration.untrackedResourceForeground#984c00
input.background#c7c7c7
input.border#c7c7c7
input.foreground#000000
input.placeholderForeground#9e9e9e
inputOption.activeBorder#9e9e9e
inputValidation.errorBackground#c7c7c7
inputValidation.errorBorder#970032
inputValidation.infoBackground#c7c7c7
inputValidation.infoBorder#007183
inputValidation.warningBorder#984c00
list.activeSelectionBackground#d6d6d6
list.activeSelectionForeground#887300
list.dropBackground#e1e1e1bf
list.errorForeground#970032
list.focusBackground#d6d6d6
list.focusForeground#000000
list.highlightForeground#000000
list.hoverBackground#e5e5e5
list.hoverForeground#000000
list.inactiveFocusBackground#d6d6d6
list.inactiveSelectionBackground#d6d6d6
list.inactiveSelectionForeground#887300
list.invalidItemForeground#970032
list.warningForeground#984c00
merge.border#d6d6d6
merge.commonContentBackground#0000000d
merge.commonHeaderBackground#00000026
merge.currentContentBackground#9900330d
merge.currentHeaderBackground#99003326
merge.incomingContentBackground#0676470d
merge.incomingHeaderBackground#06764726
notificationCenter.border#bdbdbd
notificationCenterHeader.background#bdbdbd
notificationCenterHeader.foreground#222a56
notificationLink.foreground#887300
notifications.background#bdbdbd
notifications.border#bdbdbd
notifications.foreground#50277f
notificationToast.border#bdbdbd
panel.background#bdbdbd
panel.border#d6d6d6
panelTitle.activeBorder#887300
panelTitle.activeForeground#887300
panelTitle.inactiveForeground#222a56
peekView.border#d6d6d6
peekViewEditor.background#bdbdbd
peekViewEditor.matchHighlightBackground#9e9e9e
peekViewEditorGutter.background#bdbdbd
peekViewResult.background#bdbdbd
peekViewResult.fileForeground#222a56
peekViewResult.lineForeground#222a56
peekViewResult.matchHighlightBackground#9e9e9e
peekViewResult.selectionBackground#a7a7a7
peekViewResult.selectionForeground#000000
peekViewTitle.background#bdbdbd
peekViewTitleDescription.foreground#222a56
peekViewTitleLabel.foreground#000000
pickerGroup.border#d6d6d6
pickerGroup.foreground#9e9e9e
progressBar.background#bdbdbd
scrollbar.shadow#d6d6d6
scrollbarSlider.activeBackground#00000012
scrollbarSlider.background#00000012
scrollbarSlider.hoverBackground#00000012
selection.background#a7a7a7
sideBar.background#e5e5e5
sideBar.border#dedede
sideBar.dropBackground#e1e1e1bf
sideBar.foreground#222a56
sideBarSectionHeader.background#e5e5e5
sideBarSectionHeader.foreground#121a45
sideBarTitle.foreground#9e9e9e
statusBar.background#e5e5e5
statusBar.border#dedede
statusBar.debuggingBackground#121a45
statusBar.debuggingBorder#e5e5e5
statusBar.debuggingForeground#000000
statusBar.foreground#121a45
statusBar.noFolderBackground#e5e5e5
statusBar.noFolderBorder#dedede
statusBar.noFolderForeground#121a45
statusBarItem.activeBackground#d6d6d6
statusBarItem.hoverBackground#d6d6d6
statusBarItem.prominentBackground#bdbdbd
statusBarItem.prominentHoverBackground#bdbdbd
tab.activeBackground#d6d6d6
tab.activeBorder#887300
tab.activeForeground#887300
tab.border#d6d6d6
tab.hoverBackground#d6d6d6
tab.hoverBorder#9e9e9e
tab.inactiveBackground#d6d6d6
tab.inactiveForeground#222a56
tab.unfocusedActiveBorder#222a56
tab.unfocusedActiveForeground#50277f
tab.unfocusedHoverBackground#d6d6d6
tab.unfocusedHoverBorder#d6d6d6
tab.unfocusedInactiveForeground#222a56
terminal.ansiBlack#bdbdbd
terminal.ansiBlue#984c00
terminal.ansiBrightBlack#121a45
terminal.ansiBrightBlue#984c00
terminal.ansiBrightCyan#007183
terminal.ansiBrightGreen#067647
terminal.ansiBrightMagenta#330f8a
terminal.ansiBrightRed#970032
terminal.ansiBrightWhite#000000
terminal.ansiBrightYellow#887300
terminal.ansiCyan#007183
terminal.ansiGreen#067647
terminal.ansiMagenta#330f8a
terminal.ansiRed#970032
terminal.ansiWhite#000000
terminal.ansiYellow#887300
terminal.background#dedede
terminal.foreground#000000
terminal.selectionBackground#00000026
terminalCursor.background#f2f2f200
terminalCursor.foreground#000000
textBlockQuote.background#bdbdbd
textBlockQuote.border#bdbdbd
textCodeBlock.background#bdbdbd
textLink.activeForeground#000000
textLink.foreground#887300
textPreformat.foreground#000000
textSeparator.foreground#121a45
titleBar.activeBackground#e5e5e5
titleBar.activeForeground#222a56
titleBar.border#dedede
titleBar.inactiveBackground#e5e5e5
titleBar.inactiveForeground#9e9e9e
walkThrough.embeddedEditorBackground#e5e5e5
widget.shadow#dedede

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, string.comment	#9e5a00	italic
string, string.template	#9e5a00	—
constant.numeric, variable.other.constant, variable.other.enummember, entity.name.function.preprocessor	#a200d3	—
string.embedded.begin, string.embedded.end, punctuation.definition.template-expression, punctuation.section.embedded	#a200d3	—
punctuation.section.embedded.begin.js, punctuation.section.embedded.end.js, punctuation.section.embedded.begin.erb, punctuation.section.embedded.end.erb, source.elixir.embedded, punctuation.separator, punctuation.accessor, meta.brace	#464a52	—
constant.language	#00b4cc	—
constant.character, constant.other	#00b4cc	—
variable.language	#dd0369	—
keyword, keyword.operator.logical, keyword.operator.constructor	#dd0369	—
keyword.operator	#dd0369	—
storage	#dd0369	—
storage.type	#00b4cc	—
entity.name.class, entity.name.module, entity.name.type, storage.identifier, support.class	#007de4	—
entity.name.namespace, variable.other.object, variable.other.global, variable.other.readwrite.class, variable.other.readwrite.instance, variable.other.readwrite.batchfile, variable.readwrite, variable.readwrite.other.block	#007de4	—
variable.other, variable.other.property, variable.other.block	#464a52	—
entity.other.inherited-class	#327e00	—
storage.modifier.import, storage.modifier.package	#007de4	—
entity.name.function, support.function	#327e00	—
variable.parameter, entity.name.variable.parameter, parameter.variable	#a75000	italic
entity.name.function-call	#464a52	—
function.support.builtin, function.support.core	#327e00	—
entity.name.tag, entity.name.tag.class.js	#dd0369	—
entity.name.tag.class, entity.name.tag.id	#00b4cc	—
entity.other.attribute-name	#327e00	—
support.constant	#00b4cc	—
support.type, support.variable	#00b4cc	—
support.dictionary.json	#327e00	—
support.type.property-name.css, support.type.property-name.scss, support.type.property-name.less, support.type.property-name.sass	#464a52	—
entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-class.scss, entity.other.attribute-name.pseudo-class.less, entity.other.attribute-name.pseudo-class.sass, entity.other.attribute-name.pseudo-element.css, entity.other.attribute-name.pseudo-element.scss, entity.other.attribute-name.pseudo-element.less, entity.other.attribute-name.pseudo-element.sass	#00b4cc	—
support.constant.css, support.constant.scss, support.constant.less, support.constant.sass	#327e00	—
variable.css, variable.scss, variable.less, variable.sass	#00b4cc	—
variable.css.string, variable.scss.string, variable.less.string, variable.sass.string	#9e5a00	—
unit.css, unit.scss, unit.less, unit.sass	#a200d3	—
function.css, function.scss, function.less, function.sass	#00b4cc	—
support.other.variable	—
invalid	#F8F8F0	—
invalid.deprecated	#F8F8F0	—
support.type.property-name.json	#327e00	—
string.detected-link	#007de4	—
meta.diff, meta.diff.header	#75715E	—
markup.deleted	#e06c75	—
markup.inserted	#327e00	—
markup.changed	#9e5a00	—
constant.numeric.line-number.find-in-files - match	#00b4ccA0	—
entity.name.filename.find-in-files	#9e5a00	—
markup.italic, markup.italic.markdown	—	italic
punctuation.definition.italic.markdown, punctuation.definition.bold.markdown, punctuation.definition.heading.markdown	#676f7d	—
punctuation.definition.italic.markdown	—	italic
markup.underline.link.markdown	#007de4	—
markup.bold.markdown	—	bold
markup.heading.markdown	#dd0369	bold
markup.quote.markdown	#327e00	—
meta.separator.markdown	#a200d3	bold
markup.raw.inline.markdown, markup.raw.block.markdown	#00b4cc	—
punctuation.definition.list_item.markdown	#ffffff	bold

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