Stormy Lighthouse

Name: Stormy Lighthouse
Author: ZaderRox1111

Publisher: ZaderRox1111Themes in package: 1

Brooding stormy lighthouse style theme. Easy on the eyes, soft, and gloomy.

Open in VS Code GitHub

VS Code preview

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

Stormy Lighthouse — Stormy Lighthouse

fetchUser.ts

index.ts

README.md

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#1C252E
activityBar.border#1C252E60
activityBar.foreground#719BAD
activityBarBadge.background#C15F6F
activityBarBadge.foreground#1C252E
badge.background#1C252E30
badge.foreground#125A69
breadcrumb.activeSelectionForeground#125A69
breadcrumb.background#1C252E
breadcrumb.focusForeground#719BAD
breadcrumb.foreground#44929E
breadcrumbPicker.background#1C252E
button.background#125A6950
contrastBorder#125A6940
debugToolBar.background#1C252E
diffEditor.insertedTextBackground#F9A64E15
diffEditor.removedTextBackground#C871B720
dropdown.background#1C252E
dropdown.border#F9A64E10
editor.background#1C252E
editor.findMatchBackground#1C252E
editor.findMatchBorder#125A69
editor.findMatchHighlightBackground#125A6993
editor.findMatchHighlightBorder#F9A64E30
editor.foreground#719BAD
editor.lineHighlightBackground#1C252E50
editor.selectionBackground#C15F6F30
editor.selectionHighlightBackground#125A696b
editor.selectionHighlightBorder#C15F6Ff0
editorBracketMatch.background#1C252E
editorBracketMatch.border#54AC867f
editorCursor.foreground#54AC86
editorError.foreground#C871B770
editorGroup.border#1C252E30
editorGroupHeader.tabsBackground#1C252E
editorGutter.addedBackground#F9A64E60
editorGutter.deletedBackground#C871B760
editorGutter.modifiedBackground#C15F6F60
editorHoverWidget.background#1C252E
editorHoverWidget.border#F9A64E10
editorIndentGuide.activeBackground#283643
editorIndentGuide.background#28364370
editorInfo.foreground#C15F6F70
editorLineNumber.activeForeground#C15F6F
editorLineNumber.foreground#125A69c0
editorLink.activeForeground#719BAD
editorMarkerNavigation.background#719BAD05
editorOverviewRuler.border#1C252E
editorOverviewRuler.errorForeground#C871B740
editorOverviewRuler.findMatchForeground#125A69
editorOverviewRuler.infoForeground#C15F6F40
editorOverviewRuler.warningForeground#54AC8670
editorRuler.foreground#283643
editorSuggestWidget.background#1C252E
editorSuggestWidget.border#F9A64E10
editorSuggestWidget.foreground#719BAD
editorSuggestWidget.highlightForeground#54AC86
editorSuggestWidget.selectedBackground#125A6920
editorWarning.foreground#F9A64E
editorWhitespace.foreground#719BAD40
editorWidget.background#1C252E
editorWidget.border#54AC86
editorWidget.resizeBorder#125A69
extensionButton.prominentBackground#F9A64E90
extensionButton.prominentHoverBackground#C871B7
focusBorder#F9A64E00
gitDecoration.conflictingResourceForeground#54AC86
gitDecoration.deletedResourceForeground#C871B7
gitDecoration.ignoredResourceForeground#125A69
gitDecoration.modifiedResourceForeground#44929E
gitDecoration.untrackedResourceForeground#C15F6F
input.background#1D262F
input.border#F9A64E10
input.foreground#719BAD
input.placeholderForeground#719BAD60
inputOption.activeBackground#719BAD30
inputOption.activeBorder#719BAD30
inputValidation.errorBorder#C871B750
inputValidation.infoBorder#C15F6F50
inputValidation.warningBorder#54AC8650
list.activeSelectionBackground#1C252E
list.activeSelectionForeground#125A69
list.focusBackground#1D262F
list.focusForeground#C15F6F
list.highlightForeground#125A69
list.hoverBackground#283643
list.hoverForeground#F9A64E
list.inactiveSelectionBackground#1C252E30
list.inactiveSelectionForeground#125A69
list.warningForeground#54AC86
listFilterWidget.background#1C252E30
listFilterWidget.noMatchesOutline#1C252E30
listFilterWidget.outline#1C252E30
menu.background#1C252Ef8
menu.border#125A6950
menu.foreground#719BAD
menu.selectionBackground#1D262F
menu.selectionBorder#1C252E30
menu.selectionForeground#719BAD
menu.separatorBackground#719BAD
menubar.selectionBackground#1D262F
menubar.selectionBorder#125A6950
menubar.selectionForeground#719BAD
minimap.background#1C252E
minimapGutter.addedBackground#C871B7
minimapGutter.deletedBackground#54AC86
minimapGutter.modifiedBackground#F9A64E
minimapSlider.activeBackground#F9A64Eb0
minimapSlider.background#F9A64E80
minimapSlider.hoverBackground#F9A64Ea0
notificationLink.foreground#125A69
notifications.background#1C252E
notifications.foreground#719BAD
panel.background#1C252E
panel.border#719BAD7f
panelTitle.activeBorder#125A69
panelTitle.activeForeground#F9A64E
panelTitle.inactiveForeground#719BAD
peekView.border#1C252E30
peekViewEditor.background#719BAD05
peekViewEditor.matchHighlightBackground#125A6950
peekViewEditorGutter.background#719BAD05
peekViewResult.background#719BAD05
peekViewResult.matchHighlightBackground#125A6950
peekViewResult.selectionBackground#125A6970
peekViewTitle.background#719BAD05
peekViewTitleDescription.foreground#719BAD60
pickerGroup.foreground#125A69
progressBar.background#125A69
scrollbar.shadow#1C252E00
scrollbarSlider.activeBackground#125A69cc
scrollbarSlider.background#125A69bb
scrollbarSlider.hoverBackground#125A69ee
selection.background#125A69
settings.checkboxBackground#1C252E
settings.checkboxForeground#719BAD
settings.dropdownBackground#1C252E
settings.dropdownForeground#719BAD
settings.headerForeground#125A69
settings.modifiedItemIndicator#125A69
settings.numberInputBackground#1C252E
settings.numberInputForeground#719BAD
settings.textInputBackground#1C252E
settings.textInputForeground#719BAD
sideBar.background#1C252E
sideBar.border#125A6950
sideBar.foreground#C15F6F
sideBarSectionHeader.background#1C252E
sideBarSectionHeader.border#1C252E60
sideBarSectionHeader.foreground#C15F6F
sideBarTitle.foreground#719BAD
statusBar.background#1C2027
statusBar.border#1C252E60
statusBar.debuggingBackground#54AC86
statusBar.debuggingForeground#F9A64E
statusBar.foreground#719BAD
statusBar.noFolderBackground#1C252E
statusBarItem.hoverBackground#125A6920
statusBarItem.remoteBackground#125A69
statusBarItem.remoteForeground#1C252E
tab.activeBackground#125A6950
tab.activeBorder#125A69
tab.activeForeground#F9A64E
tab.activeModifiedBorder#125A69
tab.border#1C252E
tab.inactiveBackground#125A6920
tab.inactiveForeground#719BADaf
tab.unfocusedActiveBackground#125A6940
tab.unfocusedActiveBorder#125A69
tab.unfocusedActiveForeground#719BAD
tab.unfocusedInactiveBackground#125A6910
tab.unfocusedInactiveForeground#719BAD7f
terminal.ansiBlack#1C252E
terminal.ansiBlue#C15F6F
terminal.ansiBrightBlack#125A69
terminal.ansiBrightBlue#C15F6F
terminal.ansiBrightCyan#E495A4
terminal.ansiBrightGreen#F9A64E
terminal.ansiBrightMagenta#54AC86
terminal.ansiBrightRed#C871B7
terminal.ansiBrightWhite#F9A64E
terminal.ansiBrightYellow#54AC86
terminal.ansiCyan#E495A4
terminal.ansiGreen#F9A64E
terminal.ansiMagenta#54AC86
terminal.ansiRed#C871B7
terminal.ansiWhite#F9A64E
terminal.ansiYellow#54AC86
terminalCursor.background#1C252E
terminalCursor.foreground#54AC86
textLink.activeForeground#719BAD
textLink.foreground#125A69
titleBar.activeBackground#1C252E
titleBar.activeForeground#719BAD
titleBar.border#1C252E60
titleBar.inactiveBackground#1C252E
titleBar.inactiveForeground#125A69
tree.indentGuidesStroke#283643
widget.shadow#1C252E30

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
variable, string constant.other.placeholder, invalid.deprecated, keyword, storage.type, storage.modifier	#F9A64E	—
variable, string constant.other.placeholder, entity.name.function, punctuation.definition.interpolation.end.bracket.curly.scss, punctuation.definition.interpolation.begin.bracket.curly.scss	—	italic
punctuation.definition.interpolation.end.bracket.curly.scss, punctuation.definition.interpolation.begin.bracket.curly.scss	#F9A64E	—
constant.other.php	#54AC86	—
constant.other.color	#F9A64E	—
invalid, invalid.illegal	#C871B7	—
Keyword, Storage	—	italic
keyword.control, constant.other.color, punctuation.definition.tag, punctuation, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution, entity.name.tag.reference.scss	#A7A8AF	—
punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, entity.name.type.module.js	#44929E	—
keyword.control.at-rule, punctuation.terminator.rule.css, keyword.control.operator, punctuation.definition.entity.css, keyword.operator.assignment.js, punctuation.separator.comma.js, punctuation.definition.string.begin.js, punctuation.definition.string.end.js, punctuation.definition.binding-pattern.object.js	#719BAD	—
punctuation.definition, string.quoted.single.scss	#A7A8AF	—
keyword.control	—	bold
comment.line.scss, comment.line.double-slash.js, punctuation.definition.comment.scss, punctuation.definition.comment.js, punctuation.definition.comment.html, comment.block.html	#6D6F7C	—
text.html.derivative	#A7A8AF	—
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter	#719BAD	—
entity.name.tag.html	—	bold
variable.parameter.js, variable.parameter.keyframe-list.css	#54AC86	—
variable.other.object.js, storage.type.js, string.other.link.title.markdown, variable.other.readwrite.js, variable.other.property.js	#44929E
string, string.quoted.double.html, variable.other.constant.js, variable.other.object.property.js, string.quoted.double.json, markup.fenced_code.block.markdown, markup.inline.raw.string.markdown, variable.function, keyword.other.special-method, entity.name.function, markup.bold, markup.bold.markdown, markup.italic.markdown, meta.class-method.js entity.name.function.js, variable.function.constructor, entity.name.tag.other.html, entity.name.tag.block.any.html, source.sass keyword.control	#C15F6F	—
punctuation.definition.string.begin.html, punctuation.definition.string.end.html	#E495A4	—
support.other.variable, string.other.link, markup.table	#719BAD	—
constant.numeric, constant.language, constant.character, constant.escape, keyword.other.unit, keyword.other, punctuation.separator.key-value.html	#F9A64E	—
variable.parameter.function.language.special, variable.parameter	#C871B7	—
constant.other.symbol, constant.other.key, entity.other.inherited-class, keyword.other.unit, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly, constant.other.object.key.js, string.unquoted.label.js	#F9A64E
entity.name, support.type, support.class, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types, entity.other.attribute-name.html	#54AC86	—
support.type	#B2CCD6	—
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name	#44929E	—
entity.name.module.js, variable.import.parameter.js, variable.other.class.js	#C871B7	—
entity.name.method.js, tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js	#C15F6F	italic
entity.other.attribute-name, support.function	#54AC86	—
entity.other.attribute-name.id, entity.other.attribute-name.class, entity.other.attribute-name.pseudo-class, entity.name.tag.css, keyword.control.conditional.js, support.constant, entity.other.attribute-name.html, string.quoted.single.js, storage.type.function.js, meta.object-literal.key	#719BAD	—
source.scss keyword.control	#54AC86	—
markup.inserted	#F9A64E	—
markup.deleted	#C871B7	—
markup.changed	#54AC86	—
string.regexp	#E495A4	—
constant.character.escape	#E495A4	—
url, link, uri	—	underline
source.js constant.other.object.key.js string.unquoted.label.js	#719BAD	italic
support.type.property-name.json	#719BAD	—
text.html.markdown, punctuation.definition.list_item.markdown	#719BAD	—
text.html.markdown markup.inline.raw.markdown	#54AC86	—
text.html.markdown markup.inline.raw.markdown, punctuation.definition.raw.markdown	#125A6950	—
text.html.markdown meta.dummy.line-break	—	—
markdown.heading, markup.heading \| markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown, entity.name.section.markdown	#44929E	bold
markup.underline	#C15F6F	underline
markup.strike	—
markup.quote punctuation.definition.blockquote.markdown	#125A6950	—
markup.quote	—	italic
string.other.link.description.title.markdown	#54AC86	—
constant.other.reference.link.markdown	#54AC86	—
markup.raw.block	#54AC86	—
punctuation.definition.raw.markdown, punctuation.definition.markdown	#E495A4	—
variable.language.fenced.markdown	#125A69	—
meta.separator	#A7A8AF	bold
token.info-token	#125A69	—
token.warn-token	#54AC86	—
token.error-token	#FF293B	—
token.debug-token	#E495A4	—

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