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 (Dark)

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.background#2A2520
activityBar.foreground#E0D8D2
activityBar.inactiveForeground#706860
activityBarBadge.background#6F9C97
activityBarBadge.foreground#1C1F22
badge.background#6F9C97
badge.foreground#1C1F22
breadcrumb.activeSelectionForeground#8ABAB2
breadcrumb.background#24272A
breadcrumb.focusForeground#E0D8D2
breadcrumb.foreground#706860
button.background#6F9C97
button.foreground#1C1F22
button.hoverBackground#7AACA5
button.secondaryBackground#4A4540
button.secondaryForeground#E0D8D2
button.secondaryHoverBackground#5A5550
charts.blue#7AACA5
charts.foreground#E0D8D2
charts.green#8AAA8A
charts.lines#6F9C97
charts.orange#C8A070
charts.purple#9A8090
charts.red#B08080
charts.yellow#C8A070
checkbox.background#16191C
checkbox.border#6F9C97
checkbox.foreground#E0D8D2
checkbox.selectBackground#6F9C97
checkbox.selectBorder#6F9C97
commandCenter.activeBackground#3A3530
commandCenter.activeBorder#6F9C97
commandCenter.activeForeground#7AACA5
commandCenter.background#24272A
commandCenter.border#3A3530
commandCenter.debuggingBackground#6F9C9720
commandCenter.foreground#E0D8D2
commandCenter.inactiveBorder#3A353080
commandCenter.inactiveForeground#706860
debugConsole.errorForeground#B08080
debugConsole.infoForeground#7AACA5
debugConsole.sourceForeground#706860
debugConsole.warningForeground#C8A070
debugConsoleInputIcon.foreground#6F9C97
debugIcon.breakpointCurrentStackframeForeground#6F9C97
debugIcon.breakpointDisabledForeground#5A5550
debugIcon.breakpointForeground#B08080
debugIcon.breakpointStackframeForeground#8AAA8A
debugIcon.breakpointUnverifiedForeground#C8A070
debugIcon.continueForeground#8AAA8A
debugIcon.disconnectForeground#B08080
debugIcon.pauseForeground#C8A070
debugIcon.restartForeground#8AAA8A
debugIcon.startForeground#8AAA8A
debugIcon.stepBackForeground#6F9C97
debugIcon.stepIntoForeground#6F9C97
debugIcon.stepOutForeground#6F9C97
debugIcon.stepOverForeground#6F9C97
debugIcon.stopForeground#B08080
debugTokenExpression.boolean#7AACA5
debugTokenExpression.error#B08080
debugTokenExpression.name#7AACA5
debugTokenExpression.number#6A7580
debugTokenExpression.string#8AAA8A
debugTokenExpression.value#6F9C97
debugToolBar.background#24272A
debugToolBar.border#3A3530
debugView.exceptionLabelBackground#B08080
debugView.exceptionLabelForeground#FFFFFF
debugView.stateLabelBackground#6F9C97
debugView.stateLabelForeground#FFFFFF
debugView.valueChangedHighlight#6F9C9760
descriptionForeground#706860
diffEditor.diagonalFill#3A353040
diffEditor.insertedLineBackground#8AAA8A15
diffEditor.insertedTextBackground#8AAA8A20
diffEditor.insertedTextBorder#8AAA8A00
diffEditor.removedLineBackground#B0808015
diffEditor.removedTextBackground#B0808020
diffEditor.removedTextBorder#B0808000
diffEditorGutter.insertedLineBackground#8AAA8A30
diffEditorGutter.removedLineBackground#B0808030
diffEditorOverview.insertedForeground#8AAA8A
diffEditorOverview.removedForeground#B08080
dropdown.background#16191C
dropdown.border#4A4540
dropdown.foreground#E0D8D2
dropdown.listBackground#24272A
editor.background#1C1F22
editor.findMatchBackground#6F9C9755
editor.findMatchHighlightBackground#6F9C9728
editor.focusedStackFrameHighlightBackground#8AAA8A30
editor.foldBackground#6F9C9712
editor.foreground#E0D8D2
editor.lineHighlightBackground#2A2F3440
editor.lineHighlightBorder#6F9C9718
editor.selectionBackground#6F9C9750
editor.stackFrameHighlightBackground#C8A07030
editor.wordHighlightBackground#4A454040
editor.wordHighlightStrongBackground#4A454060
editorBracketHighlight.foreground1#6F9C97
editorBracketHighlight.foreground2#7AACA5
editorBracketHighlight.foreground3#9A8090
editorBracketHighlight.foreground4#8AAA8A
editorBracketHighlight.foreground5#C8B090
editorBracketHighlight.foreground6#6A7580
editorBracketHighlight.unexpectedBracket.foreground#B08080
editorBracketMatch.background#6F9C9730
editorBracketMatch.border#6F9C97
editorCodeLens.foreground#706860
editorCursor.foreground#7AACA5
editorError.border#B0808000
editorError.foreground#B08080
editorGroup.border#3A3530
editorGroup.dropBackground#6F9C9730
editorGroup.dropIntoPromptBackground#24272A
editorGroup.dropIntoPromptBorder#6F9C97
editorGroup.dropIntoPromptForeground#E0D8D2
editorGroup.emptyBackground#24272A
editorGroup.focusedEmptyBorder#6F9C97
editorGroupHeader.tabsBackground#24272A
editorGutter.addedBackground#8AAA8A
editorGutter.deletedBackground#AA8080
editorGutter.modifiedBackground#7AACA5
editorHint.border#8AAA8A00
editorHint.foreground#8AAA8A
editorHoverWidget.background#24272A
editorHoverWidget.border#3A3530
editorIndentGuide.activeBackground1#6F9C97
editorIndentGuide.background1#3A3530
editorInfo.border#7AACA500
editorInfo.foreground#7AACA5
editorInlayHint.background#3A353080
editorInlayHint.foreground#706860
editorInlayHint.parameterForeground#6F9C97
editorInlayHint.typeForeground#6F9C97
editorLineNumber.activeForeground#7AACA5
editorLineNumber.foreground#706860
editorOverviewRuler.addedForeground#8AAA8A
editorOverviewRuler.background#24272A
editorOverviewRuler.border#3A3530
editorOverviewRuler.bracketMatchForeground#6F9C97
editorOverviewRuler.commonContentForeground#5A5550
editorOverviewRuler.currentContentForeground#8AAA8A
editorOverviewRuler.deletedForeground#B08080
editorOverviewRuler.errorForeground#B08080
editorOverviewRuler.findMatchForeground#6F9C9780
editorOverviewRuler.incomingContentForeground#6F9C97
editorOverviewRuler.infoForeground#7AACA5
editorOverviewRuler.modifiedForeground#6F9C97
editorOverviewRuler.rangeHighlightForeground#6F9C9740
editorOverviewRuler.selectionHighlightForeground#6F9C9760
editorOverviewRuler.warningForeground#C8A070
editorOverviewRuler.wordHighlightForeground#6F9C9760
editorOverviewRuler.wordHighlightStrongForeground#6F9C9780
editorStickyScroll.background#24272A
editorStickyScrollHover.background#3A3530
editorSuggestWidget.background#24272A
editorSuggestWidget.foreground#E0D8D2
editorSuggestWidget.highlightForeground#8ABAB2
editorSuggestWidget.selectedBackground#3A3530
editorWarning.border#C8A07000
editorWarning.foreground#C8A070
editorWhitespace.foreground#4A454050
editorWidget.background#24272A
editorWidget.border#3A3530
editorWidget.foreground#E0D8D2
errorForeground#B08080
extensionBadge.remoteBackground#6F9C97
extensionBadge.remoteForeground#FFFFFF
extensionButton.prominentBackground#6F9C97
extensionButton.prominentForeground#FFFFFF
extensionButton.prominentHoverBackground#7AACA5
extensionIcon.preReleaseForeground#9A8090
extensionIcon.sponsorForeground#B08080
extensionIcon.starForeground#C8A070
extensionIcon.verifiedForeground#8AAA8A
focusBorder#6F9C97
gitDecoration.addedResourceForeground#8AAA8A
gitDecoration.conflictingResourceForeground#C09090
gitDecoration.deletedResourceForeground#B08080
gitDecoration.ignoredResourceForeground#5A5550
gitDecoration.modifiedResourceForeground#7AACA5
gitDecoration.untrackedResourceForeground#C0A878
icon.foreground#E0D8D2
input.background#16191C
input.border#4A4540
input.foreground#E0D8D2
input.placeholderForeground#706860
inputOption.activeBackground#6F9C97
inputOption.activeForeground#1C1F22
keybindingLabel.background#3A3530
keybindingLabel.border#3A3530
keybindingLabel.bottomBorder#5A5550
keybindingLabel.foreground#E0D8D2
list.activeSelectionBackground#6F9C97
list.activeSelectionForeground#1C1F22
list.activeSelectionIconForeground#1C1F22
list.focusBackground#3A3530
list.focusForeground#E0D8D2
list.hoverBackground#3A3530
list.hoverForeground#E0D8D2
list.inactiveSelectionBackground#3A353080
list.inactiveSelectionForeground#E0D8D2
menu.background#16191C
menu.border#3A3530
menu.foreground#E0D8D2
menu.selectionBackground#6F9C97
menu.selectionBorder#6F9C9700
menu.selectionForeground#FFFFFF
menu.separatorBackground#3A3530
menubar.selectionBackground#3A3530
menubar.selectionForeground#E0D8D2
merge.border#3A3530
merge.commonContentBackground#5A555020
merge.commonHeaderBackground#5A555040
merge.currentContentBackground#8AAA8A20
merge.currentHeaderBackground#8AAA8A40
merge.incomingContentBackground#6F9C9720
merge.incomingHeaderBackground#6F9C9740
mergeEditor.change.background#6F9C9720
mergeEditor.change.word.background#6F9C9740
mergeEditor.conflict.handledFocused.border#8AAA8A
mergeEditor.conflict.handledUnfocused.border#8AAA8A80
mergeEditor.conflict.unhandledFocused.border#C8A070
mergeEditor.conflict.unhandledUnfocused.border#C8A07080
minimap.background#24272A
minimap.selectionHighlight#6F9C9760
notifications.background#24272A
notifications.border#3A3530
notifications.foreground#E0D8D2
notificationsErrorIcon.foreground#B08080
notificationsInfoIcon.foreground#7AACA5
notificationsWarningIcon.foreground#C8A070
panel.background#24272A
panel.border#3A3530
panelTitle.activeBorder#6F9C97
panelTitle.activeForeground#E0D8D2
panelTitle.inactiveForeground#706860
peekView.border#6F9C97
peekViewEditor.background#24272A
peekViewResult.background#24272A
peekViewResult.matchHighlightBackground#6F9C9760
peekViewTitle.background#2A2520
peekViewTitleLabel.foreground#E0D8D2
progressBar.background#6F9C97
quickInput.background#24272A
quickInput.foreground#E0D8D2
quickInputList.focusBackground#6F9C97
quickInputList.focusForeground#FFFFFF
quickInputList.focusIconForeground#FFFFFF
quickInputTitle.background#2A2520
scrollbarSlider.activeBackground#6F9C97
scrollbarSlider.background#4A454050
scrollbarSlider.hoverBackground#5A5550
selection.background#6F9C9750
settings.checkboxBackground#16191C
settings.checkboxBorder#6F9C97
settings.checkboxForeground#E0D8D2
settings.dropdownBackground#16191C
settings.dropdownBorder#3A3530
settings.dropdownForeground#E0D8D2
settings.dropdownListBorder#3A3530
settings.focusedRowBackground#3A353040
settings.focusedRowBorder#6F9C9780
settings.headerForeground#E0D8D2
settings.modifiedItemIndicator#6F9C97
settings.numberInputBackground#16191C
settings.numberInputBorder#4A4540
settings.numberInputForeground#E0D8D2
settings.rowHoverBackground#3A353020
settings.sashBorder#3A3530
settings.textInputBackground#16191C
settings.textInputBorder#4A4540
settings.textInputForeground#E0D8D2
sideBar.background#24272A
sideBar.border#3A3530
sideBar.foreground#E0D8D2
sideBarSectionHeader.background#3A3530
sideBarSectionHeader.foreground#E0D8D2
sideBarTitle.foreground#7AACA5
statusBar.background#428A91
statusBar.debuggingBackground#B8A080
statusBar.debuggingForeground#1C1F22
statusBar.foreground#FFFFFF
statusBar.noFolderBackground#2A2520
statusBar.noFolderForeground#E0D8D2
symbolIcon.arrayForeground#6F9C97
symbolIcon.booleanForeground#7AACA5
symbolIcon.classForeground#E0D8D2
symbolIcon.colorForeground#6F9C97
symbolIcon.constantForeground#6A7580
symbolIcon.constructorForeground#9A8090
symbolIcon.enumeratorForeground#C8A070
symbolIcon.enumeratorMemberForeground#6A7580
symbolIcon.eventForeground#C8A070
symbolIcon.fieldForeground#6A7580
symbolIcon.fileForeground#706860
symbolIcon.folderForeground#706860
symbolIcon.functionForeground#6F9C97
symbolIcon.interfaceForeground#8AAA8A
symbolIcon.keyForeground#6F9C97
symbolIcon.keywordForeground#7AACA5
symbolIcon.methodForeground#6F9C97
symbolIcon.moduleForeground#9A8090
symbolIcon.namespaceForeground#9A8090
symbolIcon.nullForeground#B08080
symbolIcon.numberForeground#6A7580
symbolIcon.objectForeground#E0D8D2
symbolIcon.operatorForeground#706860
symbolIcon.packageForeground#9A8090
symbolIcon.propertyForeground#6F9C97
symbolIcon.referenceForeground#6A7580
symbolIcon.snippetForeground#706860
symbolIcon.stringForeground#8AAA8A
symbolIcon.structForeground#E0D8D2
symbolIcon.textForeground#E0D8D2
symbolIcon.typeParameterForeground#8AAA8A
symbolIcon.unitForeground#6A7580
symbolIcon.variableForeground#E0D8D2
tab.activeBackground#1C1F22
tab.activeBorder#6F9C97
tab.activeForeground#E0D8D2
tab.border#3A3530
tab.hoverBackground#3A3530
tab.hoverForeground#E0D8D2
tab.inactiveBackground#24272A
tab.inactiveForeground#706860
terminal.ansiBlack#2A2520
terminal.ansiBlue#6A7580
terminal.ansiBrightBlack#5A5550
terminal.ansiBrightBlue#7A8590
terminal.ansiBrightCyan#8ABAB2
terminal.ansiBrightGreen#9ABA9A
terminal.ansiBrightMagenta#AA90A0
terminal.ansiBrightRed#C09090
terminal.ansiBrightWhite#FFFFFF
terminal.ansiBrightYellow#D8C0A0
terminal.ansiCyan#6F9C97
terminal.ansiGreen#8AAA8A
terminal.ansiMagenta#9A8090
terminal.ansiRed#B08080
terminal.ansiWhite#E0D8D2
terminal.ansiYellow#C8B090
terminal.background#1C1F22
terminal.foreground#E0D8D2
testing.iconErrored#B08080
testing.iconFailed#B08080
testing.iconPassed#8AAA8A
testing.iconQueued#C8A070
testing.iconSkipped#5A5550
testing.iconUnset#5A5550
testing.peekBorder#B08080
testing.peekHeaderBackground#B0808020
testing.runAction#8AAA8A
textLink.activeForeground#A0CAC4
textLink.foreground#8ABAB2
titleBar.activeBackground#2A2520
titleBar.activeForeground#E0D8D2
titleBar.inactiveBackground#1C1F22
titleBar.inactiveForeground#706860
walkThrough.embeddedEditorBackground#24272A
welcomePage.background#1C1F22
welcomePage.progress.background#3A3530
welcomePage.progress.foreground#6F9C97
welcomePage.tileBackground#24272A
welcomePage.tileBorder#3A3530
welcomePage.tileHoverBackground#3A3530

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#706860	italic
keyword, storage	#7AACA5	bold
entity.name.function, support.function	#C8B090	bold
entity.name.type, support.class, support.type, storage.type	#E0D8D2	bold
string	#8AAA8A	—
constant.character.escape	#8ABAB2	—
variable, support.variable	#E0D8D2	—
constant.numeric, constant.character, constant	#6F9C97	—
constant.language, support.constant, variable.language	#8ABAB2	—
keyword.operator	#A0988E	—
punctuation	#908880	—
entity.name.tag	#7AACA5	—
entity.other.attribute-name, meta.tag entity.other.attribute-name	#C8B090	italic
meta.selector, entity.name.tag.css	#E0D8D2	—
meta.property-name, support.type.property-name	#7AACA5	—
meta.property-value, support.constant.property-value	#8AAA8A	—
markup.heading	#7AACA5	bold
markup.bold	#E0D8D2	bold
markup.italic	#E0D8D2	italic
meta.link	#C8B090	—
markup.list	#7AACA5	—
markup.inline.raw	#8AAA8A	—
markup.inserted	#8AAA8A	—
markup.deleted	#B08080	—
markup.changed	#7AACA5	—

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