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

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#553D40
activityBar.foreground#F7F5F2
activityBar.inactiveForeground#C4B8B4
activityBarBadge.background#6F9C97
activityBarBadge.foreground#FFFFFF
badge.background#6F9C97
badge.foreground#FFFFFF
breadcrumb.activeSelectionForeground#428A91
breadcrumb.background#EFEAE5
breadcrumb.focusForeground#3A4550
breadcrumb.foreground#70656C
button.background#6F9C97
button.foreground#FFFFFF
button.hoverBackground#428A91
button.secondaryBackground#70656C
button.secondaryForeground#FFFFFF
button.secondaryHoverBackground#553D40
charts.blue#428A91
charts.foreground#3A4550
charts.green#7A9A7A
charts.lines#6F9C97
charts.orange#C8A070
charts.purple#8A7080
charts.red#A07070
charts.yellow#B8A060
checkbox.background#FFFFFF
checkbox.border#6F9C97
checkbox.foreground#3A4550
checkbox.selectBackground#6F9C97
checkbox.selectBorder#6F9C97
commandCenter.activeBackground#E8E4DF
commandCenter.activeBorder#6F9C97
commandCenter.activeForeground#428A91
commandCenter.background#EFEAE5
commandCenter.border#E0D8D2
commandCenter.debuggingBackground#6F9C9720
commandCenter.foreground#3A4550
commandCenter.inactiveBorder#E0D8D280
commandCenter.inactiveForeground#70656C
debugConsole.errorForeground#A07070
debugConsole.infoForeground#6F9C97
debugConsole.sourceForeground#70656C
debugConsole.warningForeground#B8A060
debugConsoleInputIcon.foreground#6F9C97
debugIcon.breakpointCurrentStackframeForeground#6F9C97
debugIcon.breakpointDisabledForeground#8A8580
debugIcon.breakpointForeground#A07070
debugIcon.breakpointStackframeForeground#7A9A7A
debugIcon.breakpointUnverifiedForeground#B8A060
debugIcon.continueForeground#7A9A7A
debugIcon.disconnectForeground#A07070
debugIcon.pauseForeground#B8A060
debugIcon.restartForeground#7A9A7A
debugIcon.startForeground#7A9A7A
debugIcon.stepBackForeground#6F9C97
debugIcon.stepIntoForeground#6F9C97
debugIcon.stepOutForeground#6F9C97
debugIcon.stepOverForeground#6F9C97
debugIcon.stopForeground#A07070
debugTokenExpression.boolean#428A91
debugTokenExpression.error#A07070
debugTokenExpression.name#428A91
debugTokenExpression.number#70656C
debugTokenExpression.string#5A8870
debugTokenExpression.value#6F9C97
debugToolBar.background#EFEAE5
debugToolBar.border#E0D8D2
debugView.exceptionLabelBackground#A07070
debugView.exceptionLabelForeground#FFFFFF
debugView.stateLabelBackground#6F9C97
debugView.stateLabelForeground#FFFFFF
debugView.valueChangedHighlight#6F9C9760
descriptionForeground#70656C
diffEditor.diagonalFill#E0D8D240
diffEditor.insertedLineBackground#7A9A7A15
diffEditor.insertedTextBackground#7A9A7A20
diffEditor.insertedTextBorder#7A9A7A00
diffEditor.removedLineBackground#A0707015
diffEditor.removedTextBackground#A0707020
diffEditor.removedTextBorder#A0707000
diffEditorGutter.insertedLineBackground#7A9A7A30
diffEditorGutter.removedLineBackground#A0707030
diffEditorOverview.insertedForeground#7A9A7A
diffEditorOverview.removedForeground#A07070
dropdown.background#FFFFFF
dropdown.border#C4B8B4
dropdown.foreground#3A4550
dropdown.listBackground#FFFFFF
editor.background#F7F5F2
editor.findMatchBackground#6F9C9745
editor.findMatchHighlightBackground#6F9C9722
editor.focusedStackFrameHighlightBackground#7A9A7A30
editor.foldBackground#6F9C9712
editor.foreground#3A4550
editor.lineHighlightBackground#E8E4DF20
editor.lineHighlightBorder#C4B8B430
editor.selectionBackground#6F9C9740
editor.stackFrameHighlightBackground#B8A06030
editor.wordHighlightBackground#C4B8B430
editor.wordHighlightStrongBackground#C4B8B450
editorBracketHighlight.foreground1#6F9C97
editorBracketHighlight.foreground2#428A91
editorBracketHighlight.foreground3#8A7080
editorBracketHighlight.foreground4#7A9A7A
editorBracketHighlight.foreground5#B8A080
editorBracketHighlight.foreground6#70656C
editorBracketHighlight.unexpectedBracket.foreground#A07070
editorBracketMatch.background#6F9C9730
editorBracketMatch.border#6F9C97
editorCodeLens.foreground#8A8580
editorCursor.foreground#428A91
editorError.border#A0707000
editorError.foreground#A07070
editorGroup.border#E0D8D2
editorGroup.dropBackground#6F9C9730
editorGroup.dropIntoPromptBackground#EFEAE5
editorGroup.dropIntoPromptBorder#6F9C97
editorGroup.dropIntoPromptForeground#3A4550
editorGroup.emptyBackground#EFEAE5
editorGroup.focusedEmptyBorder#6F9C97
editorGroupHeader.tabsBackground#EFEAE5
editorGutter.addedBackground#7A9A7A
editorGutter.deletedBackground#A07070
editorGutter.modifiedBackground#6F9C97
editorHint.border#7A9A7A00
editorHint.foreground#7A9A7A
editorHoverWidget.background#FFFFFF
editorHoverWidget.border#E0D8D2
editorIndentGuide.activeBackground1#6F9C97
editorIndentGuide.background1#E0D8D2
editorInfo.border#6F9C9700
editorInfo.foreground#6F9C97
editorInlayHint.background#E0D8D280
editorInlayHint.foreground#70656C
editorInlayHint.parameterForeground#6F9C97
editorInlayHint.typeForeground#428A91
editorLineNumber.activeForeground#428A91
editorLineNumber.foreground#8A8580
editorOverviewRuler.addedForeground#7A9A7A
editorOverviewRuler.background#EFEAE5
editorOverviewRuler.border#E0D8D2
editorOverviewRuler.bracketMatchForeground#6F9C97
editorOverviewRuler.commonContentForeground#70656C
editorOverviewRuler.currentContentForeground#7A9A7A
editorOverviewRuler.deletedForeground#A07070
editorOverviewRuler.errorForeground#A07070
editorOverviewRuler.findMatchForeground#6F9C9780
editorOverviewRuler.incomingContentForeground#6F9C97
editorOverviewRuler.infoForeground#6F9C97
editorOverviewRuler.modifiedForeground#6F9C97
editorOverviewRuler.rangeHighlightForeground#6F9C9740
editorOverviewRuler.selectionHighlightForeground#6F9C9760
editorOverviewRuler.warningForeground#B8A060
editorOverviewRuler.wordHighlightForeground#6F9C9760
editorOverviewRuler.wordHighlightStrongForeground#6F9C9780
editorStickyScroll.background#EFEAE5
editorStickyScrollHover.background#E8E4DF
editorSuggestWidget.background#FFFFFF
editorSuggestWidget.foreground#3A4550
editorSuggestWidget.highlightForeground#428A91
editorSuggestWidget.selectedBackground#E8E4DF
editorWarning.border#B8A06000
editorWarning.foreground#B8A060
editorWhitespace.foreground#C4B8B450
editorWidget.background#EFEAE5
editorWidget.border#E0D8D2
editorWidget.foreground#3A4550
errorForeground#A07070
extensionBadge.remoteBackground#6F9C97
extensionBadge.remoteForeground#FFFFFF
extensionButton.prominentBackground#6F9C97
extensionButton.prominentForeground#FFFFFF
extensionButton.prominentHoverBackground#428A91
extensionIcon.preReleaseForeground#8A7080
extensionIcon.sponsorForeground#A07070
extensionIcon.starForeground#B8A060
extensionIcon.verifiedForeground#7A9A7A
focusBorder#6F9C97
gitDecoration.addedResourceForeground#5A8A5A
gitDecoration.conflictingResourceForeground#B08080
gitDecoration.deletedResourceForeground#A07070
gitDecoration.ignoredResourceForeground#8A8580
gitDecoration.modifiedResourceForeground#428A91
gitDecoration.untrackedResourceForeground#9A8860
icon.foreground#3A4550
input.background#FFFFFF
input.border#C4B8B4
input.foreground#3A4550
input.placeholderForeground#8A858080
inputOption.activeBackground#6F9C97
inputOption.activeForeground#FFFFFF
keybindingLabel.background#E0D8D2
keybindingLabel.border#E0D8D2
keybindingLabel.bottomBorder#70656C
keybindingLabel.foreground#3A4550
list.activeSelectionBackground#6F9C97
list.activeSelectionForeground#FFFFFF
list.activeSelectionIconForeground#FFFFFF
list.focusBackground#6F9C9725
list.focusForeground#3A4550
list.hoverBackground#E8E4DF
list.hoverForeground#3A4550
list.inactiveSelectionBackground#E0D8D290
list.inactiveSelectionForeground#3A4550
menu.background#FFFFFF
menu.border#E0D8D2
menu.foreground#3A4550
menu.selectionBackground#6F9C97
menu.selectionBorder#6F9C9700
menu.selectionForeground#FFFFFF
menu.separatorBackground#E0D8D2
menubar.selectionBackground#E8E4DF
menubar.selectionForeground#3A4550
merge.border#E0D8D2
merge.commonContentBackground#70656C20
merge.commonHeaderBackground#70656C40
merge.currentContentBackground#7A9A7A20
merge.currentHeaderBackground#7A9A7A40
merge.incomingContentBackground#6F9C9720
merge.incomingHeaderBackground#6F9C9740
mergeEditor.change.background#6F9C9720
mergeEditor.change.word.background#6F9C9740
mergeEditor.conflict.handledFocused.border#7A9A7A
mergeEditor.conflict.handledUnfocused.border#7A9A7A80
mergeEditor.conflict.unhandledFocused.border#B8A060
mergeEditor.conflict.unhandledUnfocused.border#B8A06080
minimap.background#EFEAE5
minimap.selectionHighlight#6F9C9750
notifications.background#FFFFFF
notifications.border#E0D8D2
notifications.foreground#3A4550
notificationsErrorIcon.foreground#A07070
notificationsInfoIcon.foreground#6F9C97
notificationsWarningIcon.foreground#B8A060
panel.background#EFEAE5
panel.border#E0D8D2
panelTitle.activeBorder#428A91
panelTitle.activeForeground#3A4550
panelTitle.inactiveForeground#70656C
peekView.border#6F9C97
peekViewEditor.background#EFEAE5
peekViewResult.background#EFEAE5
peekViewResult.matchHighlightBackground#6F9C9750
peekViewTitle.background#553D40
peekViewTitleLabel.foreground#F7F5F2
progressBar.background#6F9C97
quickInput.background#EFEAE5
quickInput.foreground#3A4550
quickInputList.focusBackground#6F9C97
quickInputList.focusForeground#FFFFFF
quickInputList.focusIconForeground#FFFFFF
quickInputTitle.background#553D40
scrollbarSlider.activeBackground#6F9C97
scrollbarSlider.background#C4B8B450
scrollbarSlider.hoverBackground#C4B8B4
selection.background#6F9C9740
settings.checkboxBackground#FFFFFF
settings.checkboxBorder#6F9C97
settings.checkboxForeground#3A4550
settings.dropdownBackground#FFFFFF
settings.dropdownBorder#E0D8D2
settings.dropdownForeground#3A4550
settings.dropdownListBorder#E0D8D2
settings.focusedRowBackground#E8E4DF40
settings.focusedRowBorder#6F9C9780
settings.headerForeground#3A4550
settings.modifiedItemIndicator#6F9C97
settings.numberInputBackground#FFFFFF
settings.numberInputBorder#C4B8B4
settings.numberInputForeground#3A4550
settings.rowHoverBackground#E8E4DF20
settings.sashBorder#E0D8D2
settings.textInputBackground#FFFFFF
settings.textInputBorder#C4B8B4
settings.textInputForeground#3A4550
sideBar.background#EFEAE5
sideBar.border#E0D8D2
sideBar.foreground#3A4550
sideBarSectionHeader.background#E0D8D2
sideBarSectionHeader.foreground#3A4550
sideBarTitle.foreground#70656C
statusBar.background#428A91
statusBar.debuggingBackground#B8A080
statusBar.debuggingForeground#3A4550
statusBar.foreground#FFFFFF
statusBar.noFolderBackground#70656C
statusBar.noFolderForeground#F7F5F2
symbolIcon.arrayForeground#6F9C97
symbolIcon.booleanForeground#428A91
symbolIcon.classForeground#553D40
symbolIcon.colorForeground#6F9C97
symbolIcon.constantForeground#70656C
symbolIcon.constructorForeground#8A7080
symbolIcon.enumeratorForeground#B8A060
symbolIcon.enumeratorMemberForeground#70656C
symbolIcon.eventForeground#B8A060
symbolIcon.fieldForeground#70656C
symbolIcon.fileForeground#70656C
symbolIcon.folderForeground#70656C
symbolIcon.functionForeground#6F9C97
symbolIcon.interfaceForeground#7A9A7A
symbolIcon.keyForeground#6F9C97
symbolIcon.keywordForeground#428A91
symbolIcon.methodForeground#6F9C97
symbolIcon.moduleForeground#8A7080
symbolIcon.namespaceForeground#8A7080
symbolIcon.nullForeground#A07070
symbolIcon.numberForeground#70656C
symbolIcon.objectForeground#553D40
symbolIcon.operatorForeground#70656C
symbolIcon.packageForeground#8A7080
symbolIcon.propertyForeground#6F9C97
symbolIcon.referenceForeground#70656C
symbolIcon.snippetForeground#70656C
symbolIcon.stringForeground#5A8870
symbolIcon.structForeground#553D40
symbolIcon.textForeground#3A4550
symbolIcon.typeParameterForeground#7A9A7A
symbolIcon.unitForeground#70656C
symbolIcon.variableForeground#3A4550
tab.activeBackground#FFFFFF
tab.activeBorder#428A91
tab.activeForeground#3A4550
tab.border#E0D8D2
tab.hoverBackground#FFFFFF
tab.hoverForeground#428A91
tab.inactiveBackground#EFEAE5
tab.inactiveForeground#70656C
terminal.ansiBlack#3A4550
terminal.ansiBlue#70656C
terminal.ansiBrightBlack#70656C
terminal.ansiBrightBlue#8A7A85
terminal.ansiBrightCyan#7AACA5
terminal.ansiBrightGreen#8AAA8A
terminal.ansiBrightMagenta#9A8090
terminal.ansiBrightRed#B08080
terminal.ansiBrightWhite#FFFFFF
terminal.ansiBrightYellow#C8B090
terminal.ansiCyan#6F9C97
terminal.ansiGreen#7A9A7A
terminal.ansiMagenta#8A7080
terminal.ansiRed#A07070
terminal.ansiWhite#E0D8D2
terminal.ansiYellow#B8A080
terminal.background#FFFFFF
terminal.foreground#3A4550
testing.iconErrored#A07070
testing.iconFailed#A07070
testing.iconPassed#7A9A7A
testing.iconQueued#B8A060
testing.iconSkipped#8A8580
testing.iconUnset#8A8580
testing.peekBorder#A07070
testing.peekHeaderBackground#A0707020
testing.runAction#7A9A7A
textLink.activeForeground#2D626A
textLink.foreground#428A91
titleBar.activeBackground#553D40
titleBar.activeForeground#F7F5F2
titleBar.inactiveBackground#70656C
titleBar.inactiveForeground#C4B8B4
walkThrough.embeddedEditorBackground#EFEAE5
welcomePage.background#F7F5F2
welcomePage.progress.background#E0D8D2
welcomePage.progress.foreground#6F9C97
welcomePage.tileBackground#EFEAE5
welcomePage.tileBorder#E0D8D2
welcomePage.tileHoverBackground#E8E4DF

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#8A9890	italic
keyword, storage	#428A91	bold
entity.name.function, support.function	#5A7068	bold
entity.name.type, support.class, support.type, storage.type	#553D40	bold
string	#5A8870	—
constant.character.escape	#2D626A	—
variable, support.variable	#3A4550	—
constant.numeric, constant.character, constant	#6F9C97	—
constant.language, support.constant, variable.language	#428A91	—
keyword.operator	#70656C	—
punctuation	#8A8580	—
entity.name.tag	#428A91	—
entity.other.attribute-name, meta.tag entity.other.attribute-name	#6F9C97	italic
meta.selector, entity.name.tag.css	#553D40	—
meta.property-name, support.type.property-name	#428A91	—
meta.property-value, support.constant.property-value	#5A8870	—
markup.heading	#428A91	bold
markup.bold	#3A4550	bold
markup.italic	#3A4550	italic
meta.link	#6F9C97	—
markup.list	#428A91	—
markup.inline.raw	#5A8870	—
markup.inserted	#5A8A5A	—
markup.deleted	#A07070	—
markup.changed	#6F9C97	—

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