Horizon Ultimate Themes

Name: Horizon Ultimate Themes
Author: Horizon

Publisher: HorizonThemes in package: 49

A collection of Horizon Themes with Core and Gamers editions, all paired with Horizon Icons and HorizonTags.

GitHub

Color themes

VS Code preview

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

Horizon Ultimate Themes — Honkai: Star Rail - Dan Heng

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.ts

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...

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#133139
activityBar.foreground#F4F6F4
activityBar.inactiveForeground#2E5B63
activityBarBadge.background#790000
activityBarBadge.foreground#FFFFFF
badge.background#790000
badge.foreground#FFFFFF
breadcrumb.activeSelectionForeground#790000
breadcrumb.background#E8ECEC
breadcrumb.focusForeground#133139
breadcrumb.foreground#2E5B63
button.background#2E5B63
button.foreground#FFFFFF
button.hoverBackground#3A6E78
button.secondaryBackground#D8E0E0
button.secondaryForeground#133139
button.secondaryHoverBackground#C8D4D4
charts.blue#790000
charts.foreground#133139
charts.green#2E5B63
charts.lines#790000
charts.orange#790000
charts.purple#5A0000
charts.red#790000
charts.yellow#8A5500
checkbox.background#FFFFFF
checkbox.border#790000
checkbox.foreground#133139
checkbox.selectBackground#790000
checkbox.selectBorder#790000
commandCenter.activeBackground#C8D4D4
commandCenter.activeBorder#790000
commandCenter.activeForeground#790000
commandCenter.background#E8ECEC
commandCenter.border#C8D4D4
commandCenter.debuggingBackground#79000020
commandCenter.foreground#133139
commandCenter.inactiveBorder#C8D4D480
commandCenter.inactiveForeground#2E5B63
debugConsole.errorForeground#790000
debugConsole.infoForeground#2E5B63
debugConsole.sourceForeground#2E5B63
debugConsole.warningForeground#8A5500
debugConsoleInputIcon.foreground#790000
debugIcon.breakpointCurrentStackframeForeground#790000
debugIcon.breakpointDisabledForeground#2E5B63
debugIcon.breakpointForeground#790000
debugIcon.breakpointStackframeForeground#2E5B63
debugIcon.breakpointUnverifiedForeground#8A5500
debugIcon.continueForeground#2E5B63
debugIcon.disconnectForeground#790000
debugIcon.pauseForeground#8A5500
debugIcon.restartForeground#2E5B63
debugIcon.startForeground#2E5B63
debugIcon.stepBackForeground#790000
debugIcon.stepIntoForeground#790000
debugIcon.stepOutForeground#790000
debugIcon.stepOverForeground#790000
debugIcon.stopForeground#790000
debugTokenExpression.boolean#790000
debugTokenExpression.error#790000
debugTokenExpression.name#790000
debugTokenExpression.number#3A6E78
debugTokenExpression.string#790000
debugTokenExpression.value#790000
debugToolBar.background#E8ECEC
debugToolBar.border#C8D4D4
debugView.exceptionLabelBackground#790000
debugView.exceptionLabelForeground#FFFFFF
debugView.stateLabelBackground#790000
debugView.stateLabelForeground#FFFFFF
debugView.valueChangedHighlight#79000060
descriptionForeground#2E5B63
diffEditor.diagonalFill#C8D4D440
diffEditor.insertedLineBackground#2E5B6315
diffEditor.insertedTextBackground#2E5B6320
diffEditor.insertedTextBorder#2E5B6300
diffEditor.removedLineBackground#79000015
diffEditor.removedTextBackground#79000020
diffEditor.removedTextBorder#79000000
diffEditorGutter.insertedLineBackground#2E5B6330
diffEditorGutter.removedLineBackground#79000030
diffEditorOverview.insertedForeground#2E5B63
diffEditorOverview.removedForeground#790000
dropdown.background#FFFFFF
dropdown.border#C8D4D4
dropdown.foreground#133139
dropdown.listBackground#FFFFFF
editor.background#F4F6F4
editor.findMatchBackground#79000040
editor.findMatchHighlightBackground#79000020
editor.focusedStackFrameHighlightBackground#2E5B6330
editor.foldBackground#79000015
editor.foreground#133139
editor.lineHighlightBackground#E8ECEC
editor.lineHighlightBorder#2E5B6340
editor.selectionBackground#2E5B6330
editor.stackFrameHighlightBackground#8A550030
editor.wordHighlightBackground#2E5B6320
editor.wordHighlightStrongBackground#2E5B6340
editorBracketHighlight.foreground1#790000
editorBracketHighlight.foreground2#790000
editorBracketHighlight.foreground3#5A0000
editorBracketHighlight.foreground4#2E5B63
editorBracketHighlight.foreground5#8A5500
editorBracketHighlight.foreground6#3A6E78
editorBracketHighlight.unexpectedBracket.foreground#790000
editorBracketMatch.background#2E5B6330
editorBracketMatch.border#2E5B63
editorCodeLens.foreground#2E5B63
editorCursor.foreground#790000
editorError.border#79000000
editorError.foreground#790000
editorGroup.border#C8D4D4
editorGroup.dropBackground#79000030
editorGroup.dropIntoPromptBackground#E8ECEC
editorGroup.dropIntoPromptBorder#790000
editorGroup.dropIntoPromptForeground#133139
editorGroup.emptyBackground#E8ECEC
editorGroup.focusedEmptyBorder#790000
editorGroupHeader.tabsBackground#E8ECEC
editorGutter.addedBackground#2E5B63
editorGutter.deletedBackground#5A0000
editorGutter.modifiedBackground#790000
editorHint.border#2E5B6300
editorHint.foreground#2E5B63
editorHoverWidget.background#FFFFFF
editorHoverWidget.border#C8D4D4
editorIndentGuide.activeBackground1#2E5B63
editorIndentGuide.background1#D8E0E0
editorInfo.border#2E5B6300
editorInfo.foreground#2E5B63
editorInlayHint.background#C8D4D480
editorInlayHint.foreground#2E5B63
editorInlayHint.parameterForeground#790000
editorInlayHint.typeForeground#790000
editorLineNumber.activeForeground#790000
editorLineNumber.foreground#2E5B6380
editorOverviewRuler.addedForeground#2E5B63
editorOverviewRuler.background#E8ECEC
editorOverviewRuler.border#C8D4D4
editorOverviewRuler.bracketMatchForeground#790000
editorOverviewRuler.commonContentForeground#2E5B63
editorOverviewRuler.currentContentForeground#2E5B63
editorOverviewRuler.deletedForeground#790000
editorOverviewRuler.errorForeground#790000
editorOverviewRuler.findMatchForeground#79000080
editorOverviewRuler.incomingContentForeground#790000
editorOverviewRuler.infoForeground#2E5B63
editorOverviewRuler.modifiedForeground#790000
editorOverviewRuler.rangeHighlightForeground#79000040
editorOverviewRuler.selectionHighlightForeground#79000060
editorOverviewRuler.warningForeground#8A5500
editorOverviewRuler.wordHighlightForeground#79000060
editorOverviewRuler.wordHighlightStrongForeground#79000080
editorStickyScroll.background#E8ECEC
editorStickyScrollHover.background#C8D4D4
editorSuggestWidget.background#FFFFFF
editorSuggestWidget.foreground#133139
editorSuggestWidget.highlightForeground#790000
editorSuggestWidget.selectedBackground#D8E0E0
editorWarning.border#8A550000
editorWarning.foreground#8A5500
editorWhitespace.foreground#2E5B6340
editorWidget.background#E8ECEC
editorWidget.border#C8D4D4
editorWidget.foreground#133139
errorForeground#790000
extensionBadge.remoteBackground#790000
extensionBadge.remoteForeground#FFFFFF
extensionButton.prominentBackground#790000
extensionButton.prominentForeground#FFFFFF
extensionButton.prominentHoverBackground#133139
extensionIcon.preReleaseForeground#5A0000
extensionIcon.sponsorForeground#790000
extensionIcon.starForeground#8A5500
extensionIcon.verifiedForeground#2E5B63
focusBorder#2E5B63
gitDecoration.addedResourceForeground#2E5B63
gitDecoration.conflictingResourceForeground#790000
gitDecoration.deletedResourceForeground#5A0000
gitDecoration.ignoredResourceForeground#A0A8A8
gitDecoration.modifiedResourceForeground#790000
gitDecoration.untrackedResourceForeground#8A5500
icon.foreground#133139
input.background#FFFFFF
input.border#2E5B63
input.foreground#133139
input.placeholderForeground#2E5B6380
inputOption.activeBackground#2E5B63
inputOption.activeForeground#FFFFFF
keybindingLabel.background#C8D4D4
keybindingLabel.border#C8D4D4
keybindingLabel.bottomBorder#2E5B63
keybindingLabel.foreground#133139
list.activeSelectionBackground#2E5B63
list.activeSelectionForeground#FFFFFF
list.activeSelectionIconForeground#FFFFFF
list.focusBackground#2E5B6320
list.focusForeground#133139
list.hoverBackground#D8E0E0
list.hoverForeground#133139
list.inactiveSelectionBackground#2E5B6330
list.inactiveSelectionForeground#133139
menu.background#FFFFFF
menu.border#C8D4D4
menu.foreground#133139
menu.selectionBackground#790000
menu.selectionBorder#79000000
menu.selectionForeground#FFFFFF
menu.separatorBackground#C8D4D4
menubar.selectionBackground#C8D4D4
menubar.selectionForeground#133139
merge.border#C8D4D4
merge.commonContentBackground#2E5B6320
merge.commonHeaderBackground#2E5B6340
merge.currentContentBackground#2E5B6320
merge.currentHeaderBackground#2E5B6340
merge.incomingContentBackground#79000020
merge.incomingHeaderBackground#79000040
mergeEditor.change.background#79000020
mergeEditor.change.word.background#79000040
mergeEditor.conflict.handledFocused.border#2E5B63
mergeEditor.conflict.handledUnfocused.border#2E5B6380
mergeEditor.conflict.unhandledFocused.border#8A5500
mergeEditor.conflict.unhandledUnfocused.border#8A550080
minimap.background#E8ECEC
minimap.selectionHighlight#2E5B6340
notifications.background#FFFFFF
notifications.border#C8D4D4
notifications.foreground#133139
notificationsErrorIcon.foreground#790000
notificationsInfoIcon.foreground#2E5B63
notificationsWarningIcon.foreground#8A5500
panel.background#E8ECEC
panel.border#C8D4D4
panelTitle.activeBorder#790000
panelTitle.activeForeground#133139
panelTitle.inactiveForeground#2E5B63
peekView.border#2E5B63
peekViewEditor.background#E8ECEC
peekViewResult.background#E8ECEC
peekViewResult.matchHighlightBackground#79000040
peekViewTitle.background#133139
peekViewTitleLabel.foreground#F4F6F4
progressBar.background#2E5B63
quickInput.background#E8ECEC
quickInput.foreground#133139
quickInputList.focusBackground#790000
quickInputList.focusForeground#FFFFFF
quickInputList.focusIconForeground#FFFFFF
quickInputTitle.background#133139
scrollbarSlider.activeBackground#790000
scrollbarSlider.background#2E5B6340
scrollbarSlider.hoverBackground#2E5B6380
selection.background#2E5B6330
settings.checkboxBackground#FFFFFF
settings.checkboxBorder#790000
settings.checkboxForeground#133139
settings.dropdownBackground#FFFFFF
settings.dropdownBorder#C8D4D4
settings.dropdownForeground#133139
settings.dropdownListBorder#C8D4D4
settings.focusedRowBackground#C8D4D440
settings.focusedRowBorder#79000080
settings.headerForeground#133139
settings.modifiedItemIndicator#790000
settings.numberInputBackground#FFFFFF
settings.numberInputBorder#790000
settings.numberInputForeground#133139
settings.rowHoverBackground#C8D4D420
settings.sashBorder#C8D4D4
settings.textInputBackground#FFFFFF
settings.textInputBorder#790000
settings.textInputForeground#133139
sideBar.background#E8ECEC
sideBar.border#C8D4D4
sideBar.foreground#133139
sideBarSectionHeader.background#D8E0E0
sideBarSectionHeader.foreground#133139
sideBarTitle.foreground#2E5B63
statusBar.background#2E5B63
statusBar.debuggingBackground#790000
statusBar.debuggingForeground#FFFFFF
statusBar.foreground#FFFFFF
statusBar.noFolderBackground#133139
statusBar.noFolderForeground#F4F6F4
symbolIcon.arrayForeground#790000
symbolIcon.booleanForeground#790000
symbolIcon.classForeground#133139
symbolIcon.colorForeground#790000
symbolIcon.constantForeground#3A6E78
symbolIcon.constructorForeground#5A0000
symbolIcon.enumeratorForeground#8A5500
symbolIcon.enumeratorMemberForeground#3A6E78
symbolIcon.eventForeground#8A5500
symbolIcon.fieldForeground#3A6E78
symbolIcon.fileForeground#2E5B63
symbolIcon.folderForeground#2E5B63
symbolIcon.functionForeground#790000
symbolIcon.interfaceForeground#2E5B63
symbolIcon.keyForeground#790000
symbolIcon.keywordForeground#790000
symbolIcon.methodForeground#790000
symbolIcon.moduleForeground#5A0000
symbolIcon.namespaceForeground#5A0000
symbolIcon.nullForeground#790000
symbolIcon.numberForeground#3A6E78
symbolIcon.objectForeground#133139
symbolIcon.operatorForeground#2E5B63
symbolIcon.packageForeground#5A0000
symbolIcon.propertyForeground#790000
symbolIcon.referenceForeground#3A6E78
symbolIcon.snippetForeground#2E5B63
symbolIcon.stringForeground#790000
symbolIcon.structForeground#133139
symbolIcon.textForeground#133139
symbolIcon.typeParameterForeground#2E5B63
symbolIcon.unitForeground#3A6E78
symbolIcon.variableForeground#133139
tab.activeBackground#F4F6F4
tab.activeBorder#790000
tab.activeForeground#133139
tab.border#C8D4D4
tab.hoverBackground#F4F6F4
tab.hoverForeground#790000
tab.inactiveBackground#E8ECEC
tab.inactiveForeground#2E5B63
terminal.ansiBlack#133139
terminal.ansiBlue#3A6E78
terminal.ansiBrightBlack#2E5B63
terminal.ansiBrightBlue#4A8090
terminal.ansiBrightCyan#3A6E78
terminal.ansiBrightGreen#4A8090
terminal.ansiBrightMagenta#790000
terminal.ansiBrightRed#A00000
terminal.ansiBrightWhite#FFFFFF
terminal.ansiBrightYellow#B87000
terminal.ansiCyan#2E5B63
terminal.ansiGreen#2E5B63
terminal.ansiMagenta#5A0000
terminal.ansiRed#790000
terminal.ansiWhite#E8ECEC
terminal.ansiYellow#8A5500
terminal.background#F4F6F4
terminal.foreground#133139
testing.iconErrored#790000
testing.iconFailed#790000
testing.iconPassed#2E5B63
testing.iconQueued#8A5500
testing.iconSkipped#2E5B63
testing.iconUnset#2E5B63
testing.peekBorder#790000
testing.peekHeaderBackground#79000020
testing.runAction#2E5B63
textLink.activeForeground#790000
textLink.foreground#2E5B63
titleBar.activeBackground#133139
titleBar.activeForeground#F4F6F4
titleBar.inactiveBackground#E8ECEC
titleBar.inactiveForeground#2E5B63
walkThrough.embeddedEditorBackground#E8ECEC
welcomePage.background#F4F6F4
welcomePage.progress.background#C8D4D4
welcomePage.progress.foreground#790000
welcomePage.tileBackground#E8ECEC
welcomePage.tileBorder#C8D4D4
welcomePage.tileHoverBackground#C8D4D4

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#6B8E8E	italic
keyword, storage	#790000	bold
entity.name.function, support.function	#2E5B63	bold
entity.name.type, support.class, support.type, storage.type	#133139	bold
string	#1A6B6B	—
constant.character.escape	#790000	—
variable, support.variable	#133139	—
constant.numeric, constant.character, constant	#790000	—
constant.language, support.constant, variable.language	#5A0000	—
keyword.operator	#2E5B63	—
punctuation	#4A6A6A	—
entity.name.tag	#790000	—
entity.other.attribute-name, meta.tag entity.other.attribute-name	#2E5B63	italic
meta.selector, entity.name.tag.css	#133139	—
meta.property-name, support.type.property-name	#790000	—
meta.property-value, support.constant.property-value	#1A6B6B	—
markup.heading	#790000	bold
markup.bold	#133139	bold
markup.italic	#133139	italic
meta.link	#2E5B63	—
markup.list	#790000	—
markup.inline.raw	#1A6B6B	—
markup.inserted	#2E5B63	—
markup.deleted	#790000	—
markup.changed	#8A5500	—

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