Thanatos

Name: Thanatos
Author: Federico Figueroa C.

Publisher: Federico Figueroa C.Themes in package: 3

Thanatos color theme

Open in VS Code GitHub

Color themes

VS Code preview

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

Thanatos — Thanatos Light

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBackground#1c2b3c
activityBar.activeBorder#1a2b3ccc
activityBar.background#4f6478
activityBar.foreground#f6f6f0
activityBar.inactiveForeground#f6f6f090
activityBarBadge.background#3abec0
activityBarBadge.foreground#f6f6f0
badge.background#008a8e
badge.foreground#f6f6f0
button.background#0e639c
button.foreground#f6f6f0
button.hoverBackground#0e639cdd
dropdown.background#e8e8e2
dropdown.foreground#1a2b3c
dropdown.listBackground#e8e8e2
editor.background#f6f6f0
editor.findMatchBackground#dc835b63
editor.findMatchHighlightBackground#ce445820
editor.findMatchHighlightBorder#ce4559
editor.foreground#3f5060
editor.hoverHighlightBackground#008a8e20
editor.lineHighlightBackground#008a8e35
editor.rangeHighlightBackground#0e639c40
editor.selectionBackground#e1988775
editor.selectionHighlightBackground#1a2b3c00
editor.selectionHighlightBorder#0e9bd180
editor.snippetTabstopHighlightBackground#e1988740
editor.wordHighlightBackground#3f506000
editor.wordHighlightBorder#00848890
editor.wordHighlightStrongBackground#008a8e00
editor.wordHighlightStrongBorder#ce455980
editorBracketPairGuide.activeBackground1#008487cc
editorBracketPairGuide.activeBackground2#ab43aabf
editorBracketPairGuide.activeBackground3#0e9bd1
editorBracketPairGuide.activeBackground4#008487cc
editorBracketPairGuide.activeBackground5#ab43aabf
editorBracketPairGuide.activeBackground6#0e9bd1
editorBracketPairGuide.background1#00848770
editorBracketPairGuide.background2#ab43aa70
editorBracketPairGuide.background3#0e9bd170
editorBracketPairGuide.background4#00848770
editorBracketPairGuide.background5#ab43aa70
editorBracketPairGuide.background6#0e9bd170
editorCursor.foreground#1a2b3c
editorError.foreground#ce4458
editorGroupHeader.tabsBackground#00000015
editorHint.foreground#3f5060
editorInfo.foreground#1a2b3c
editorLineNumber.activeForeground#1a2b3c
editorSuggestWidget.border#1a2b3c20
editorSuggestWidget.focusHighlightForeground#dc835b
editorSuggestWidget.foreground#1a2b3c
editorSuggestWidget.highlightForeground#0e639c
editorSuggestWidget.selectedBackground#0e639c
editorSuggestWidget.selectedForeground#f6f6f0
editorSuggestWidget.selectedIconForeground#f6f6f0
editorWarning.foreground#ce4559
editorWhitespace.foreground#1a2b3c20
editorWidget.background#ffffff
extensionButton.prominentBackground#008a8e
extensionButton.prominentForeground#f6f6f0
focusBorder#0e639c
foreground#3f5060
icon.foreground#3f5060
input.background#f6f6f0
input.border#1a2b3c60
input.foreground#1a2b3c
inputValidation.errorBackground#ce4458
keybindingLabel.background#adada9
keybindingLabel.foreground#f6f6f0
list.activeSelectionBackground#C2DFDB
list.activeSelectionForeground#1a2b3c
list.activeSelectionIconForeground#1a2b3c
list.focusBackground#008a8eaa
list.focusForeground#f6f6f0
list.hoverBackground#008a8e35
list.hoverForeground#1a2b3c
list.inactiveSelectionBackground#0e639c35
list.inactiveSelectionForeground#1a2b3c
menu.background#1a2b3c
menu.foreground#f6f6f0
notifications.background#1a2b3c
notifications.foreground#f6f6f0
selection.background#7799ba
settings.headerForeground#1a2b3c
sideBar.background#f6f6f0
sideBar.border#1a2b3c
sideBar.foreground#1a2b3c
sideBarTitle.foreground#1a2b3c
statusBar.background#4f6478
statusBar.debuggingBackground#4f6478
statusBar.foreground#f6f6f0
statusBar.noFolderBackground#4f6478aa
tab.activeBackground#f6f6f0
tab.activeForeground#1a2b3c
tab.activeModifiedBorder#3abec0
tab.border#004c7150
tab.hoverBackground#4f6478
tab.hoverForeground#f6f6f0
tab.inactiveBackground#00000005
tab.inactiveForeground#65737eaa
terminal.ansiBlack#36475b
terminal.ansiBlue#0e9bd1
terminal.ansiBrightBlack#65737e
terminal.ansiBrightBlue#7899ba
terminal.ansiBrightCyan#29ced1
terminal.ansiBrightGreen#0de1b1
terminal.ansiBrightMagenta#ab43aa
terminal.ansiBrightRed#d47186
terminal.ansiBrightWhite#1a2b3c
terminal.ansiBrightYellow#eaa221
terminal.ansiCyan#3abec0
terminal.ansiGreen#008a8e
terminal.ansiMagenta#ab43aa
terminal.ansiRed#e19887
terminal.ansiWhite#7899ba
terminal.ansiYellow#eaa221
terminal.background#f6f6f0
terminal.border#1a2b3c
terminal.foreground#3f5060
terminal.selectionBackground#7799ba70
terminalCursor.background#f6f6f0
terminalCursor.foreground#0e639c
titleBar.activeBackground#4f6478
titleBar.activeForeground#f6f6f0
titleBar.inactiveBackground#4f6478aa
titleBar.inactiveForeground#f6f6f0b0
widget.shadow#00000050

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#9ea0a0	italic
comment.block, comment.block.documentation	#9ea0a0	italic
variable, string constant.other.f6f6f0	#008a8e	—
constant.other.color	#0e9bd1	—
invalid, invalid.illegal	#ce4458	—
keyword, storage.type, storage.modifier	#ab43aa	—
keyword.control, constant.other.color, punctuation, meta.tag, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution	#0e639c	—
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter	#1a2b3c	—
entity.other.attribute-name.html	#ab43aa	—
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method	#0e639c	italic bold
meta.block variable.other	#dc835b	—
support.other.variable, string.other.link	#f07178	—
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other	#0e9bd1	—
string, constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js	#0E9BD1	italic
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	#ce4559	—
support.type	#008a8e	—
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	#3f5060	—
entity.name.tag.css, entity.name.tag.html	#4f6478
entity.other.attribute-name.class.css	#ab43aa	italic
support.type.property-name.css	#1a2b3c
keyword.control.at-rule.include.scss, punctuation.definition.keyword.scss	#dc835b
entity.name.module.js, variable.import.parameter.js, variable.other.class.js	#ce4458	—
variable.language	#ce4458	italic
entity.name.method.js	#008a8e	italic
meta.class-method.js entity.name.function.js, variable.function.constructor	#008a8e	—
entity.other.attribute-name	#ce4559	—
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name	#ce4559	italic
entity.other.attribute-name.class	#ce4559	—
source.sass keyword.control	#008a8e	—
markup.inserted	#0e639c	—
markup.deleted	#ce4458	—
markup.changed	#ab43aa	—
string.regexp	#0e639c	—
constant.character.escape	#0e9bd1	—
url, link, uri	—	underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js	#008a8e	italic
source.js constant.other.object.key.js string.unquoted.label.js	#ce4458	italic
source.json meta.structure.dictionary.json support.type.property-name.json	#ab43aa	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#ce4559	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#ce4559	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#ce4458	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#C17E70	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#008a8e	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#f07178	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#ab43aa	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#0e639c	—
text.html.markdown, punctuation.definition.list_item.markdown	#3f5060	—
text.html.markdown markup.inline.raw.markdown	#ab43aa	—
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown	#65737E	—
markdown.heading, markup.heading \| markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown	#0e639c	—
markup.italic	#f07178	italic
markup.bold, markup.bold string	#f07178	bold
markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold string	#f07178	bold
markup.underline	#ce4559	underline
markup.quote punctuation.definition.blockquote.markdown	#65737E	—
markup.quote	—	italic
string.other.link.title.markdown	#008a8e	—
string.other.link.description.title.markdown	#ab43aa	—
constant.other.reference.link.markdown	#ce4559	—
markup.raw.block	#ab43aa	—
markup.raw.block.fenced.markdown	#00000050	—
punctuation.definition.fenced.markdown	#00000050	—
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end	#1880a1	—
variable.language.fenced.markdown	#65737E	—
meta.separator	#65737E	bold
markup.table	#1880a1	—
punctuation.section.tag.twig	#0e9bd1	italic bold
keyword.control.twig	#ce4559	—
keyword.operator.logical.twig	#008a8e	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}!`;
}