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

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#1a5864
activityBar.foreground#f8f6f2
activityBar.inactiveForeground#a8c0c4
activityBarBadge.background#c9b87a
activityBarBadge.foreground#2a2828
badge.background#c9b87a
badge.foreground#2a2828
breadcrumb.activeSelectionForeground#1a5864
breadcrumb.background#f0ece4
breadcrumb.focusForeground#2a2828
breadcrumb.foreground#787068
button.background#1a5864
button.foreground#ffffff
button.hoverBackground#0a4850
button.secondaryBackground#c9b87a
button.secondaryForeground#2a2828
button.secondaryHoverBackground#b8a868
charts.blue#1a5864
charts.foreground#2a2828
charts.green#408870
charts.lines#1a5864
charts.orange#c9b87a
charts.purple#784868
charts.red#904040
charts.yellow#907040
checkbox.background#ffffff
checkbox.border#1a5864
checkbox.foreground#2a2828
checkbox.selectBackground#1a5864
checkbox.selectBorder#1a5864
commandCenter.activeBackground#e8e0d4
commandCenter.activeBorder#1a5864
commandCenter.activeForeground#1a5864
commandCenter.background#f0ece4
commandCenter.border#d0c8b8
commandCenter.debuggingBackground#1a586420
commandCenter.foreground#2a2828
commandCenter.inactiveBorder#d0c8b880
commandCenter.inactiveForeground#787068
debugConsole.errorForeground#904040
debugConsole.infoForeground#1a5864
debugConsole.sourceForeground#787068
debugConsole.warningForeground#907040
debugConsoleInputIcon.foreground#c9b87a
debugIcon.breakpointCurrentStackframeForeground#c9b87a
debugIcon.breakpointDisabledForeground#9a9080
debugIcon.breakpointForeground#904040
debugIcon.breakpointStackframeForeground#408870
debugIcon.breakpointUnverifiedForeground#907040
debugIcon.continueForeground#408870
debugIcon.disconnectForeground#904040
debugIcon.pauseForeground#907040
debugIcon.restartForeground#408870
debugIcon.startForeground#408870
debugIcon.stepBackForeground#1a5864
debugIcon.stepIntoForeground#1a5864
debugIcon.stepOutForeground#1a5864
debugIcon.stepOverForeground#1a5864
debugIcon.stopForeground#904040
debugTokenExpression.boolean#1a5864
debugTokenExpression.error#904040
debugTokenExpression.name#1a5864
debugTokenExpression.number#1a5864
debugTokenExpression.string#206870
debugTokenExpression.value#206870
debugToolBar.background#f0ece4
debugToolBar.border#d0c8b8
debugView.exceptionLabelBackground#904040
debugView.exceptionLabelForeground#ffffff
debugView.stateLabelBackground#1a5864
debugView.stateLabelForeground#ffffff
debugView.valueChangedHighlight#c9b87a60
descriptionForeground#787068
diffEditor.diagonalFill#d0c8b840
diffEditor.insertedLineBackground#40887015
diffEditor.insertedTextBackground#40887020
diffEditor.insertedTextBorder#40887000
diffEditor.removedLineBackground#90404015
diffEditor.removedTextBackground#90404020
diffEditor.removedTextBorder#90404000
diffEditorGutter.insertedLineBackground#40887030
diffEditorGutter.removedLineBackground#90404030
diffEditorOverview.insertedForeground#408870
diffEditorOverview.removedForeground#904040
dropdown.background#ffffff
dropdown.border#d0c8b8
dropdown.foreground#2a2828
dropdown.listBackground#ffffff
editor.background#f8f6f2
editor.findMatchBackground#c9b87a50
editor.findMatchHighlightBackground#c9b87a25
editor.focusedStackFrameHighlightBackground#40887030
editor.foldBackground#1a586410
editor.foreground#2a2828
editor.lineHighlightBackground#f0ece4
editor.lineHighlightBorder#1a586420
editor.selectionBackground#1a586440
editor.stackFrameHighlightBackground#90704030
editor.wordHighlightBackground#1a586420
editor.wordHighlightStrongBackground#1a586440
editorBracketHighlight.foreground1#1a5864
editorBracketHighlight.foreground2#907850
editorBracketHighlight.foreground3#784868
editorBracketHighlight.foreground4#408870
editorBracketHighlight.foreground5#907040
editorBracketHighlight.foreground6#206870
editorBracketHighlight.unexpectedBracket.foreground#904040
editorBracketMatch.background#c9b87a40
editorBracketMatch.border#1a5864
editorCodeLens.foreground#787068
editorCursor.foreground#1a5864
editorError.border#90404000
editorError.foreground#904040
editorGroup.border#d0c8b8
editorGroup.dropBackground#1a586430
editorGroup.dropIntoPromptBackground#f0ece4
editorGroup.dropIntoPromptBorder#1a5864
editorGroup.dropIntoPromptForeground#2a2828
editorGroup.emptyBackground#f0ece4
editorGroup.focusedEmptyBorder#1a5864
editorGroupHeader.tabsBackground#f0ece4
editorGutter.addedBackground#408870
editorGutter.deletedBackground#904040
editorGutter.modifiedBackground#1a5864
editorHint.border#40887000
editorHint.foreground#408870
editorHoverWidget.background#ffffff
editorHoverWidget.border#d0c8b8
editorIndentGuide.activeBackground1#1a5864
editorIndentGuide.background1#e8e0d4
editorInfo.border#1a586400
editorInfo.foreground#1a5864
editorInlayHint.background#e8e0d480
editorInlayHint.foreground#787068
editorInlayHint.parameterForeground#206870
editorInlayHint.typeForeground#1a5864
editorLineNumber.activeForeground#1a5864
editorLineNumber.foreground#9a9080
editorOverviewRuler.addedForeground#408870
editorOverviewRuler.background#f0ece4
editorOverviewRuler.border#d0c8b8
editorOverviewRuler.bracketMatchForeground#1a5864
editorOverviewRuler.commonContentForeground#787068
editorOverviewRuler.currentContentForeground#408870
editorOverviewRuler.deletedForeground#904040
editorOverviewRuler.errorForeground#904040
editorOverviewRuler.findMatchForeground#c9b87a80
editorOverviewRuler.incomingContentForeground#1a5864
editorOverviewRuler.infoForeground#1a5864
editorOverviewRuler.modifiedForeground#1a5864
editorOverviewRuler.rangeHighlightForeground#1a586440
editorOverviewRuler.selectionHighlightForeground#1a586460
editorOverviewRuler.warningForeground#907040
editorOverviewRuler.wordHighlightForeground#1a586460
editorOverviewRuler.wordHighlightStrongForeground#1a586480
editorStickyScroll.background#f0ece4
editorStickyScrollHover.background#e8e0d4
editorSuggestWidget.background#ffffff
editorSuggestWidget.foreground#2a2828
editorSuggestWidget.highlightForeground#1a5864
editorSuggestWidget.selectedBackground#e8e0d4
editorWarning.border#90704000
editorWarning.foreground#907040
editorWhitespace.foreground#d0c8b8
editorWidget.background#f0ece4
editorWidget.border#d0c8b8
editorWidget.foreground#2a2828
errorForeground#904040
extensionBadge.remoteBackground#c9b87a
extensionBadge.remoteForeground#2a2828
extensionButton.prominentBackground#1a5864
extensionButton.prominentForeground#ffffff
extensionButton.prominentHoverBackground#0a4850
extensionIcon.preReleaseForeground#784868
extensionIcon.sponsorForeground#b08888
extensionIcon.starForeground#907040
extensionIcon.verifiedForeground#408870
focusBorder#1a5864
gitDecoration.addedResourceForeground#408870
gitDecoration.conflictingResourceForeground#784868
gitDecoration.deletedResourceForeground#904040
gitDecoration.ignoredResourceForeground#b0a898
gitDecoration.modifiedResourceForeground#1a5864
gitDecoration.untrackedResourceForeground#907040
icon.foreground#1a5864
input.background#ffffff
input.border#1a5864
input.foreground#2a2828
input.placeholderForeground#9a9080
inputOption.activeBackground#1a5864
inputOption.activeForeground#ffffff
keybindingLabel.background#e8e0d4
keybindingLabel.border#d0c8b8
keybindingLabel.bottomBorder#787068
keybindingLabel.foreground#2a2828
list.activeSelectionBackground#1a5864
list.activeSelectionForeground#ffffff
list.activeSelectionIconForeground#ffffff
list.focusBackground#1a586440
list.focusForeground#2a2828
list.hoverBackground#e8e0d4
list.hoverForeground#2a2828
list.inactiveSelectionBackground#1a586430
list.inactiveSelectionForeground#2a2828
menu.background#ffffff
menu.border#d0c8b8
menu.foreground#2a2828
menu.selectionBackground#1a5864
menu.selectionBorder#1a586400
menu.selectionForeground#ffffff
menu.separatorBackground#d0c8b8
menubar.selectionBackground#e8e0d4
menubar.selectionForeground#2a2828
merge.border#d0c8b8
merge.commonContentBackground#78706820
merge.commonHeaderBackground#78706840
merge.currentContentBackground#40887020
merge.currentHeaderBackground#40887040
merge.incomingContentBackground#1a586420
merge.incomingHeaderBackground#1a586440
mergeEditor.change.background#1a586420
mergeEditor.change.word.background#1a586440
mergeEditor.conflict.handledFocused.border#408870
mergeEditor.conflict.handledUnfocused.border#40887080
mergeEditor.conflict.unhandledFocused.border#907040
mergeEditor.conflict.unhandledUnfocused.border#90704080
minimap.background#f0ece4
minimap.selectionHighlight#1a586440
notifications.background#ffffff
notifications.border#d0c8b8
notifications.foreground#2a2828
notificationsErrorIcon.foreground#904040
notificationsInfoIcon.foreground#1a5864
notificationsWarningIcon.foreground#907040
panel.background#f0ece4
panel.border#d0c8b8
panelTitle.activeBorder#1a5864
panelTitle.activeForeground#2a2828
panelTitle.inactiveForeground#787068
peekView.border#1a5864
peekViewEditor.background#f0ece4
peekViewResult.background#f0ece4
peekViewResult.matchHighlightBackground#c9b87a40
peekViewTitle.background#1a5864
peekViewTitleLabel.foreground#f8f6f2
progressBar.background#1a5864
quickInput.background#f0ece4
quickInput.foreground#2a2828
quickInputList.focusBackground#1a5864
quickInputList.focusForeground#ffffff
quickInputList.focusIconForeground#c9b87a
quickInputTitle.background#1a5864
scrollbarSlider.activeBackground#1a5864
scrollbarSlider.background#1a586440
scrollbarSlider.hoverBackground#1a586480
selection.background#1a586440
settings.checkboxBackground#ffffff
settings.checkboxBorder#1a5864
settings.checkboxForeground#2a2828
settings.dropdownBackground#ffffff
settings.dropdownBorder#d0c8b8
settings.dropdownForeground#2a2828
settings.dropdownListBorder#d0c8b8
settings.focusedRowBackground#e8e0d440
settings.focusedRowBorder#1a586480
settings.headerForeground#2a2828
settings.modifiedItemIndicator#1a5864
settings.numberInputBackground#ffffff
settings.numberInputBorder#1a5864
settings.numberInputForeground#2a2828
settings.rowHoverBackground#e8e0d420
settings.sashBorder#d0c8b8
settings.textInputBackground#ffffff
settings.textInputBorder#1a5864
settings.textInputForeground#2a2828
sideBar.background#f0ece4
sideBar.border#d0c8b8
sideBar.foreground#2a2828
sideBarSectionHeader.background#e8e0d4
sideBarSectionHeader.foreground#2a2828
sideBarTitle.foreground#1a5864
statusBar.background#1a5864
statusBar.debuggingBackground#c9b87a
statusBar.debuggingForeground#2a2828
statusBar.foreground#f8f6f2
statusBar.noFolderBackground#1a5864
statusBar.noFolderForeground#f8f6f2
symbolIcon.arrayForeground#1a5864
symbolIcon.booleanForeground#1a5864
symbolIcon.classForeground#2a2828
symbolIcon.colorForeground#c9b87a
symbolIcon.constantForeground#1a5864
symbolIcon.constructorForeground#784868
symbolIcon.enumeratorForeground#907040
symbolIcon.enumeratorMemberForeground#1a5864
symbolIcon.eventForeground#907040
symbolIcon.fieldForeground#1a5864
symbolIcon.fileForeground#787068
symbolIcon.folderForeground#787068
symbolIcon.functionForeground#1a5864
symbolIcon.interfaceForeground#408870
symbolIcon.keyForeground#1a5864
symbolIcon.keywordForeground#1a5864
symbolIcon.methodForeground#1a5864
symbolIcon.moduleForeground#784868
symbolIcon.namespaceForeground#784868
symbolIcon.nullForeground#904040
symbolIcon.numberForeground#1a5864
symbolIcon.objectForeground#2a2828
symbolIcon.operatorForeground#787068
symbolIcon.packageForeground#784868
symbolIcon.propertyForeground#1a5864
symbolIcon.referenceForeground#1a5864
symbolIcon.snippetForeground#787068
symbolIcon.stringForeground#206870
symbolIcon.structForeground#2a2828
symbolIcon.textForeground#2a2828
symbolIcon.typeParameterForeground#408870
symbolIcon.unitForeground#1a5864
symbolIcon.variableForeground#2a2828
tab.activeBackground#f8f6f2
tab.activeBorder#1a5864
tab.activeForeground#1a5864
tab.border#d0c8b8
tab.hoverBackground#f8f6f2
tab.hoverForeground#1a5864
tab.inactiveBackground#f0ece4
tab.inactiveForeground#787068
terminal.ansiBlack#2a2828
terminal.ansiBlue#1a5864
terminal.ansiBrightBlack#787068
terminal.ansiBrightBlue#2a6878
terminal.ansiBrightCyan#307880
terminal.ansiBrightGreen#509880
terminal.ansiBrightMagenta#886078
terminal.ansiBrightRed#b05050
terminal.ansiBrightWhite#d0c8b8
terminal.ansiBrightYellow#a08050
terminal.ansiCyan#206870
terminal.ansiGreen#408870
terminal.ansiMagenta#784868
terminal.ansiRed#904040
terminal.ansiWhite#989080
terminal.ansiYellow#907040
terminal.background#f8f6f2
terminal.foreground#2a2828
testing.iconErrored#904040
testing.iconFailed#904040
testing.iconPassed#408870
testing.iconQueued#907040
testing.iconSkipped#9a9080
testing.iconUnset#9a9080
testing.peekBorder#904040
testing.peekHeaderBackground#90404020
testing.runAction#408870
textLink.activeForeground#0a4850
textLink.foreground#1a5864
titleBar.activeBackground#1a5864
titleBar.activeForeground#f8f6f2
titleBar.inactiveBackground#f0ece4
titleBar.inactiveForeground#5a5858
walkThrough.embeddedEditorBackground#f0ece4
welcomePage.background#f8f6f2
welcomePage.progress.background#d0c8b8
welcomePage.progress.foreground#1a5864
welcomePage.tileBackground#f0ece4
welcomePage.tileBorder#d0c8b8
welcomePage.tileHoverBackground#e8e0d4

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#787068	italic
keyword, storage	#1a5864	bold
entity.name.function, support.function	#0a5060	bold
entity.name.type, support.class, support.type, storage.type	#2a2828	bold
string	#806840	—
constant.character.escape	#1a5864	—
variable, support.variable	#2a2828	—
constant.numeric, constant.character, constant	#1a5864	—
constant.language, support.constant, variable.language	#907040	—
keyword.operator	#5a5858	—
punctuation	#686060	—
entity.name.tag	#1a5864	—
entity.other.attribute-name, meta.tag entity.other.attribute-name	#806840	italic
meta.selector, entity.name.tag.css	#2a2828	—
meta.property-name, support.type.property-name	#1a5864	—
meta.property-value, support.constant.property-value	#806840	—
markup.heading	#1a5864	bold
markup.bold	#2a2828	bold
markup.italic	#2a2828	italic
meta.link	#1a5864	—
markup.list	#1a5864	—
markup.inline.raw	#806840	—
markup.inserted	#408870	—
markup.deleted	#904040	—
markup.changed	#1a5864	—

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