Cold Horizon Theme | dewstouh

Name: Cold Horizon Theme | dewstouh
Author: dewstouh

Publisher: dewstouhThemes in package: 3

The temperature turned down on the Horizon theme for Visual Studio Code

GitHub

Color themes

VS Code preview

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

Cold Horizon Theme | dewstouh — Cold Horizon

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.background#20232b
activityBar.dropBackground#6C6F9366
activityBar.foreground#FFFFFF
activityBarBadge.background#30AAD7
activityBarBadge.foreground#16161C
badge.background#30AAD7
badge.foreground#FFFFFF
breadcrumbPicker.background#232530
button.background#2E303E
diffEditor.insertedTextBackground#09F7A01A
diffEditor.removedTextBackground#F43E5C1A
dropdown.background#232530
dropdown.listBackground#2E303E
editor.background#1C1E26
editor.findMatchBackground#1b2947
editor.findMatchHighlightBackground#1b2947
editor.findRangeHighlightBackground#1b2947
editor.foreground#FFFFFF
editor.hoverHighlightBackground#1b2947
editor.lineHighlightBackground#1b2947
editor.rangeHighlightBackground#1b2947
editor.selectionBackground#1b2947
editor.selectionHighlightBackground#1b2947
editor.wordHighlightBackground#1b2947
editor.wordHighlightStrongBackground#1b2947
editorBracketMatch.background#6C6F9366
editorBracketMatch.border#6C6F9300
editorCodeLens.foreground#6C6F9399
editorCursor.background#1C1E26
editorCursor.foreground#56C2EA
editorError.foreground#F43E5C
editorGroup.border#1A1C23
editorGroup.dropBackground#6C6F934D
editorGroupHeader.tabsBackground#1C1E26
editorGutter.addedBackground#09F7A0A6
editorGutter.deletedBackground#F43E5CB3
editorGutter.modifiedBackground#21BFC2B3
editorIndentGuide.activeBackground#2E303E
editorIndentGuide.background#2E303E99
editorLineNumber.activeForeground#FFFFFF
editorLineNumber.foreground#FFFFFF60
editorOverviewRuler.addedForeground#09f7a099
editorOverviewRuler.border#2E303EB3
editorOverviewRuler.bracketMatchForeground#FFFFFF66
editorOverviewRuler.deletedForeground#F43E5C99
editorOverviewRuler.errorForeground#F43E5CE6
editorOverviewRuler.findMatchForeground#6C6F93
editorOverviewRuler.modifiedForeground#21BFC299
editorOverviewRuler.warningForeground#27D79773
editorRuler.foreground#6C6F9333
editorSuggestWidget.highlightForeground#30AAD7
editorWarning.foreground#27D797CC
editorWidget.background#232530
editorWidget.border#232530
errorForeground#F43E5C
extensionButton.prominentBackground#30AAD7
extensionButton.prominentHoverBackground#30AAD7
focusBorder#30AAD7
foreground#FFFFFF
gitDecoration.addedResourceForeground#27D797CC
gitDecoration.deletedResourceForeground#F43E5C
gitDecoration.ignoredResourceForeground#FFFFFF59
gitDecoration.modifiedResourceForeground#FAC39A
gitDecoration.untrackedResourceForeground#27D797
input.background#2E303E
inputOption.activeBorder#30AAD7
inputValidation.errorBackground#F43E5C80
inputValidation.errorBorder#F43E5C00
list.activeSelectionBackground#1C1E26
list.activeSelectionForeground#59E1E3
list.dropBackground#6C6F9366
list.errorForeground#F43E5CE6
list.focusBackground#30AAD799
list.focusForeground#FFFFFF
list.highlightForeground#30AAD7
list.hoverBackground#2E303E99
list.hoverForeground#FFFFFF
list.inactiveFocusBackground#30AAD799
list.inactiveSelectionBackground#1C1E26
list.inactiveSelectionForeground#59E1E3
list.warningForeground#27D797BF
panelTitle.activeBorder#30AAD7
peekView.border#1A1C23
peekViewEditor.background#232530
peekViewEditor.matchHighlightBackground#6C6F9399
peekViewResult.background#232530
peekViewResult.matchHighlightBackground#6C6F9399
peekViewResult.selectionBackground#2E303E80
peekViewTitle.background#232530
scrollbar.shadow#16161C
scrollbarSlider.activeBackground#6C6F9373
scrollbarSlider.background#6C6F931A
scrollbarSlider.hoverBackground#6C6F934D
selection.background#6C6F9380
sideBar.background#20232b
sideBar.dropBackground#6C6F934D
sideBar.foreground#FFFFFF
sideBarSectionHeader.background#20232b
sideBarSectionHeader.foreground#30AAD7
statusBar.background#1C1E26
statusBar.debuggingBackground#FAB38E
statusBar.debuggingForeground#06060C
statusBar.foreground#FFFFFF80
statusBar.noFolderBackground#1C1E26
statusBarItem.hoverBackground#2E303E
statusBarItem.prominentBackground#2E303E
statusBarItem.prominentHoverBackground#6C6F93
tab.activeBackground#1C1E26
tab.activeBorder#30AAD7
tab.activeForeground#FFFFFF
tab.border#30AAD700
tab.inactiveBackground#20232b
tab.inactiveForeground#FFFFFF
terminal.ansiBlue#30AAD7
terminal.ansiBrightBlue#56C2EA
terminal.ansiBrightCyan#3CE8E6
terminal.ansiBrightGreen#0AF29D
terminal.ansiBrightMagenta#F360C4
terminal.ansiBrightRed#E06783
terminal.ansiBrightYellow#FAC39A
terminal.ansiCyan#1FDAD9
terminal.ansiGreen#14D386
terminal.ansiMagenta#E54EAF
terminal.ansiRed#E95478
terminal.ansiYellow#FAB795
terminal.foreground#FFFFFF
terminal.selectionBackground#6C6F934D
terminalCursor.background#FFFFFF
terminalCursor.foreground#56C2EA
textLink.activeForeground#30AAD7
textLink.foreground#30AAD7
titleBar.activeBackground#20232b
titleBar.inactiveBackground#20232b
walkThrough.embeddedEditorBackground#232530
widget.shadow#16161C

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
text, source	#FFFFFF	normal
punctuation	#21BFC2	normal
variable, entity.name.variable.local, entity.name.type.anchor.yaml	#FFFFFF	normal
keyword.operator	#56C2EA	normal
comment, punctuation.definition.comment, string.quoted.docstring, string.quoted.docstring punctuation.definition.string	#959595	italic
string.quoted, string.template, punctuation.definition.string, string.unquoted.plain.out, string.quoted source.css	#f9ca99	—
entity.name.import.go	#f9ca99	—
variable.language, keyword.other.this, variable.parameter.function.language.special.self	#3CE8E6	italic
variable.parameter, entity.name.variable.parameter	#FFFFFF	italic
storage, storage.type, keyword.other, keyword.operator.new, keyword.package, keyword.struct, keyword.type.go, keyword.var.go, keyword.function, keyword.interface, storage.type punctuation.definition	#56C2EA	normal
storage.modifier	—	italic
keyword	#56C2EA	normal
constant, constant.character punctuation, punctuation.definition.constant	#F09483	normal
constant.numeric	—	—
constant.language, support.constant, support.constant punctuation	—	italic
string.regexp	#FAB795	—
constant.character.escape	#E06783	—
entity, storage.type.cs, support.function.go, support.class.component, support.function.magic	#14D386	normal
entity.other.attribute-name	#30AAD7	italic
entity.name.variable.field, entity.name.variable.property, variable.other.object.property, variable.other.property, variable.object.property, support.type.property-name, support.variable.property, punctuation.support.type.property-name, variable.other.member, entity.name.tag.yaml	#30AAD7	normal
support, support.function.builtin	#0AF29D	normal
support.constant	#1FDAD9	italic
support.type, keyword.type, storage.type.c, source.go storage.type, storage.type.tag-handle.yaml	#1FDAD9	normal
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.definition.interpolation, constant.other.placeholder	#B877DB	—
punctuation.definition.entity.css, entity.other.attribute-name.id.css, entity.other.attribute-name.class.css, entity.other.attribute-name.placeholder.css	#56C2EA	normal
support.type.property-name.css, support.type.vendored.property-name.css	#30AAD7	normal
keyword.other.unit	#F09483	—
support.constant.font-name	#3CE8E6	italic
entity.other.attribute-name.pseudo-element, entity.other.attribute-name.pseudo-class, entity.other.attribute-name.pseudo-class punctuation.definition.entity.css	#0AF29D	italic
support.function.misc.css	#0AF29D	—
punctuation.definition.keyword.scss, keyword.control.at-rule	#0AF29D	italic
markup.heading, entity.name.section, punctuation.definition.heading, source.yaml entity.other.document	#56C2EA	bold
markup.quote, punctuation.definition.quote.begin.markdown, markup.quote meta.paragraph	#f9ca99	italic
punctuation.definition.list	#B877DB	—
markup.underline.link	#30AAD7	italic
string.other.link.description, string.other.link.title, punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown	#FFFFFF	normal
markup.italic, punctuation.definition.italic.markdown	#3CE8E6	italic
markup.bold, punctuation.definition.bold.markdown	#0AF29D	bold
markup.inline.raw.string, punctuation.definition.raw.markdown, markup.fenced_code, markup.fenced_code punctuation.definition.markdown	#14D386	—
punctuation.definition.directive, entity.other.attribute-name.pragma, keyword.control.directive	#56C2EA	normal
entity.name.function.decorator.python, punctuation.definition.decorator.python	#09F7A0	italic

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