What the Hell

Name: What the Hell
Author: Barkerbg001

Publisher: Barkerbg001Themes in package: 1

A sleek, high‑contrast theme for VS Code designed to improve focus and readability with vibrant, clearly defined code elements.

GitHub

VS Code preview

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

What the Hell — What the Hell

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#8000ff
activityBar.border#ff00ff
activityBar.dropBorder#00ffff
activityBar.foreground#ff0000
activityBar.inactiveForeground#00ff00
activityBarBadge.background#00ffff
activityBarBadge.foreground#ff0000
badge.background#00ffff
badge.foreground#ff00ff
breadcrumb.activeSelectionForeground#ff0000
breadcrumb.background#8000ff
breadcrumb.focusForeground#00ff00
breadcrumb.foreground#ff00ff
breadcrumbPicker.background#ff0080
button.background#8000ff
button.foreground#0080ff
button.hoverBackground#800080
debugExceptionWidget.background#ff0000
debugExceptionWidget.border#00ffff
debugToolBar.background#ff0080
debugToolBar.border#00ffff
descriptionForeground#321654
diffEditor.border#ff8000
diffEditor.insertedTextBackground#ff00ff
diffEditor.insertedTextBorder#0000ff
diffEditor.removedTextBackground#ff0000
diffEditor.removedTextBorder#00ffff
dropdown.background#ff0000
dropdown.border#0000ff
dropdown.foreground#ffff00
dropdown.listBackground#00ff00
editor.background#80ff00
editor.findMatchBackground#ff0080
editor.findMatchBorder#00ffff
editor.findMatchHighlightBackground#8000ff
editor.findRangeHighlightBackground#ff0000
editor.foreground#ff00ff
editor.hoverHighlightBackground#ff8000
editor.inactiveSelectionBackground#ff00ff
editor.lineHighlightBackground#0080ff
editor.lineHighlightBorder#ff00ff
editor.rangeHighlightBackground#ff0000
editor.selectionBackground#ff0080
editor.selectionForeground#8000ff
editor.selectionHighlightBackground#0000ff
editor.wordHighlightBackground#80ff00
editor.wordHighlightStrongBackground#ff00ff
editorBracketMatch.background#ff8000
editorBracketMatch.border#0080ff
editorCodeLens.foreground#00ffff
editorCursor.background#ff8000
editorCursor.foreground#0080ff
editorError.foreground#ff0000
editorGroup.border#00ff00
editorGroup.dropBackground#0000ff
editorGroup.emptyBackground#ff0000
editorGroup.focusedEmptyBorder#00ff00
editorGroupHeader.noTabsBackground#ff8000
editorGroupHeader.tabsBackground#00ffff
editorGroupHeader.tabsBorder#ff00ff
editorGutter.addedBackground#00ffff
editorGutter.background#ff0080
editorGutter.deletedBackground#ff0000
editorGutter.modifiedBackground#8000ff
editorHint.foreground#0000ff
editorHoverWidget.background#ff00ff
editorHoverWidget.border#8000ff
editorIndentGuide.activeBackground#0000ff
editorIndentGuide.background#ff00ff
editorInfo.foreground#00ff00
editorInlayHint.background#ff0080
editorInlayHint.foreground#8000ff
editorLineNumber.activeForeground#00ffff
editorLineNumber.foreground#ff0000
editorLink.activeForeground#00ff80
editorMarkerNavigation.background#ff0080
editorMarkerNavigationError.background#8000ff
editorMarkerNavigationInfo.background#ff00ff
editorMarkerNavigationWarning.background#00ff80
editorOverviewRuler.addedForeground#ff0080
editorOverviewRuler.border#ff00ff
editorOverviewRuler.bracketMatchForeground#ff00ff
editorOverviewRuler.commonContentForeground#ff00ff
editorOverviewRuler.currentContentForeground#ff0000
editorOverviewRuler.deletedForeground#80ff00
editorOverviewRuler.errorForeground#0000ff
editorOverviewRuler.findMatchForeground#00ff80
editorOverviewRuler.incomingContentForeground#ff8000
editorOverviewRuler.infoForeground#00ffff
editorOverviewRuler.modifiedForeground#ff00ff
editorOverviewRuler.rangeHighlightForeground#ff8000
editorOverviewRuler.selectionHighlightForeground#0080ff
editorOverviewRuler.warningForeground#ff8000
editorOverviewRuler.wordHighlightForeground#ff0000
editorOverviewRuler.wordHighlightStrongForeground#00ffff
editorPane.background#ff0080
editorRuler.foreground#80ff00
editorSuggestWidget.background#ff0080
editorSuggestWidget.border#00ff80
editorSuggestWidget.foreground#0000ff
editorSuggestWidget.highlightForeground#ff0000
editorSuggestWidget.selectedBackground#00ffff
editorWarning.foreground#ff00ff
editorWhitespace.foreground#00ffff
editorWidget.background#ff00ff
editorWidget.border#8000ff
errorForeground#ff0000
extensionButton.prominentBackground#ff0000
extensionButton.prominentForeground#00ffff
extensionButton.prominentHoverBackground#ff8000
focusBorder#123456
foreground#654321
gitDecoration.conflictingResourceForeground#ff0080
gitDecoration.deletedResourceForeground#ff00ff
gitDecoration.ignoredResourceForeground#ff8000
gitDecoration.modifiedResourceForeground#ff0000
gitDecoration.untrackedResourceForeground#00ffff
input.background#ff8000
input.border#ff0080
input.foreground#80ff00
input.placeholderForeground#0080ff
inputOption.activeBorder#8000ff
inputValidation.errorBackground#00ff80
inputValidation.errorBorder#ff00ff
inputValidation.errorForeground#800080
inputValidation.infoBackground#ff0000
inputValidation.infoBorder#0000ff
inputValidation.infoForeground#00ff00
inputValidation.warningBackground#ffff00
inputValidation.warningBorder#ff0080
inputValidation.warningForeground#ff8000
list.activeSelectionBackground#ff8000
list.activeSelectionForeground#8000ff
list.dropBackground#00ff00
list.errorForeground#ff0000
list.focusBackground#0000ff
list.focusForeground#ffff00
list.highlightForeground#ff00ff
list.hoverBackground#ff0080
list.hoverForeground#80ff00
list.inactiveFocusBackground#00ff80
list.inactiveSelectionBackground#0080ff
list.inactiveSelectionForeground#800080
list.invalidItemForeground#abcdef
list.warningForeground#ff00ff
listFilterWidget.background#ff0000
listFilterWidget.noMatchesOutline#0000ff
listFilterWidget.outline#00ff00
menu.background#ff0000
menu.foreground#00ffff
menu.selectionBackground#0000ff
menu.selectionForeground#00ff80
menubar.selectionBackground#ff8000
menubar.selectionForeground#ff00ff
merge.border#ff00ff
merge.commonContentBackground#0000ff
merge.commonHeaderBackground#00ffff
merge.currentContentBackground#ff0000
merge.currentHeaderBackground#00ff00
merge.incomingContentBackground#ff8000
merge.incomingHeaderBackground#00ff80
notificationCenter.border#ff00ff
notificationCenterHeader.background#ff0000
notificationCenterHeader.foreground#00ffff
notificationLink.foreground#ff00ff
notifications.background#0000ff
notifications.border#00ff80
notifications.foreground#ff0080
notificationToast.border#ff8000
panel.background#ff0080
panel.border#00ffff
panel.dropBorder#ff00ff
panelInput.border#00ff80
panelSection.border#ff00ff
panelSection.dropBackground#0000ff
panelSectionHeader.background#ff0080
panelSectionHeader.foreground#8000ff
panelTitle.activeBorder#ff0000
panelTitle.activeForeground#00ffff
panelTitle.inactiveForeground#ff8000
peekView.border#00ffff
peekViewEditor.background#ff0080
peekViewEditor.matchHighlightBackground#00ff00
peekViewEditor.matchHighlightBorder#0000ff
peekViewEditorGutter.background#8000ff
peekViewResult.background#ff8000
peekViewResult.fileForeground#ff0000
peekViewResult.lineForeground#00ffff
peekViewResult.matchHighlightBackground#00ff80
peekViewResult.selectionBackground#ff0080
peekViewResult.selectionForeground#8000ff
peekViewTitle.background#ff00ff
peekViewTitleDescription.foreground#ff0000
peekViewTitleLabel.foreground#00ffff
pickerGroup.border#ff0080
pickerGroup.foreground#8000ff
progressBar.background#ff0000
scrollbar.shadow#abcdef
scrollbarSlider.activeBackground#123456
scrollbarSlider.background#654321
scrollbarSlider.hoverBackground#fedcba
selection.background#fedcba
settings.checkboxBackground#ff0080
settings.checkboxBorder#8000ff
settings.checkboxForeground#00ffff
settings.dropdownBackground#ff00ff
settings.dropdownBorder#00ff00
settings.dropdownForeground#ff8000
settings.dropdownListBorder#ff0000
settings.headerForeground#00ffff
settings.modifiedItemIndicator#ff0000
settings.numberInputBackground#0000ff
settings.numberInputBorder#00ffff
settings.numberInputForeground#ff0000
settings.textInputBackground#00ff80
settings.textInputBorder#ff8000
settings.textInputForeground#ff00ff
sideBar.background#00ff80
sideBar.foreground#8000ff
sideBarSectionHeader.background#00ffff
sideBarSectionHeader.border#ff00ff
sideBarSectionHeader.foreground#ff0000
sideBarTitle.foreground#ff8000
statusBar.background#ff00ff
statusBar.border#00ffff
statusBar.debuggingBackground#ff0000
statusBar.debuggingForeground#00ff00
statusBar.foreground#ff8000
statusBar.noFolderBackground#0000ff
statusBar.noFolderForeground#ff00ff
statusBarItem.activeBackground#ff8000
statusBarItem.hoverBackground#00ffff
statusBarItem.remoteBackground#ff00ff
statusBarItem.remoteForeground#ff0000
tab.activeBackground#ff0080
tab.activeBorder#ff8000
tab.activeBorderTop#00ff80
tab.activeForeground#0080ff
tab.border#800080
tab.hoverBackground#ff00ff
tab.hoverBorder#ff8000
tab.inactiveBackground#8000ff
tab.inactiveForeground#00ffff
tab.unfocusedActiveBackground#80ff00
tab.unfocusedActiveBorder#ff00ff
tab.unfocusedActiveBorderTop#ff0080
tab.unfocusedActiveForeground#ff0000
tab.unfocusedHoverBackground#0000ff
tab.unfocusedHoverBorder#8000ff
tab.unfocusedInactiveForeground#00ff00
terminal.ansiBlack#ff0080
terminal.ansiBlue#8000ff
terminal.ansiBrightBlack#ff8000
terminal.ansiBrightBlue#00ff00
terminal.ansiBrightCyan#ff00ff
terminal.ansiBrightGreen#0000ff
terminal.ansiBrightMagenta#00ff80
terminal.ansiBrightRed#ff0000
terminal.ansiBrightWhite#ff00ff
terminal.ansiBrightYellow#ff8000
terminal.ansiCyan#00ffff
terminal.ansiGreen#ff0080
terminal.ansiMagenta#8000ff
terminal.ansiRed#ff0000
terminal.ansiWhite#00ff00
terminal.ansiYellow#00ffff
terminal.background#ff00ff
terminal.border#ff8000
terminal.foreground#00ffff
terminal.selectionBackground#ff8000
terminalCursor.background#ff00ff
terminalCursor.foreground#0000ff
textBlockQuote.background#00ff00
textBlockQuote.border#ff00ff
textCodeBlock.background#0000ff
textLink.activeForeground#00ffff
textLink.foreground#ff8000
textPreformat.foreground#ff0080
textSeparator.foreground#80ff00
titleBar.activeBackground#ff0080
titleBar.activeForeground#00ffff
titleBar.border#00ff00
titleBar.inactiveBackground#ff00ff
titleBar.inactiveForeground#ff8000
tree.indentGuidesStroke#ff8000
walkThrough.embeddedEditorBackground#0000ff
welcomePage.buttonBackground#ff00ff
welcomePage.buttonHoverBackground#ff8000
widget.shadow#abcdef

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
	#ff0000	—
comment, punctuation.definition.comment	#00ff00	bold
variable, string constant.other.placeholder, source	#0000ff	—
constant.other.color, punctuation.definition.entity, constant.character.entity, punctuation.definition.template-expression, punctuation.section.tag.twig	#ff00ff	—
invalid, invalid.illegal	#8000ff	—
keyword, storage.type, storage.modifier, constant.numeric, constant.language, support.constant, constant.character, constant.escape	#ff0000	—
punctuation, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution, meta.brace, meta.block, meta.jsx, meta.embedded.expression, meta.template.expression, meta.tag.block.any.html, string.unquoted.tag-string.nunjucks, text.html.nunjucks	#00ffff	—
punctuation.separator.key-value.html, keyword.control, keyword.operator, constant.other.color, punctuation.definition.constant, meta.function.block.start.handlebars, meta.function.inline.other, meta.property-value, support.constant.mathematical-symbols, support.constant.vendored.property-value, punctuation.definition.keyword, punctuation.accessor, punctuation.separator.property, string.unquoted.filter-pipe	#ff00ff	—
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter, support.variable.dom, meta.import, meta.export, meta.export.default, support.class.builtin, support.class.component, variable.other.object	#ff0000	—
entity.name.function, variable.function, support.function, keyword.other.special-method, meta.function-call, keyword.control.filter	#00ff00	—
meta.block variable.other	#0000ff	—
variable.parameter, text.html, punctuation.section.property-list, meta.property-value.scss punctuation, meta.property-list, keyword.operator.type.annotation, variable.other.object.property	#ff00ff	—
string, constant.other.symbol, constant.other.key, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js, punctuation.definition.string, entity.name.section.markdown, meta.attribute-selector, entity.name.import.go, storage.type.attr.nunjucks	#ff8000	—
entity.name, support.type, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types, meta.object-literal.key	#ff00ff	—
support.type, support.class, keyword.other.debugger, entity.other.inherited-class, meta.property-name, punctuation.definition.raw.markdown, variable.graphql, variable.other.readwrite	#ff0000	—
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, support.type.property-name, support.variable.object.node, support.variable.object.process	#ff00ff	—
entity.name.module.js, variable.import.parameter.js	#00ff80	—
variable.language	#ff0080	italic
entity.name.method.js	#00ffff	italic
meta.class-method.js entity.name.function.js, variable.function.constructor	#ff8000	—
entity.other.attribute-name	#ff00ff	—
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name	#00ff00	—
entity.other.attribute-name.class, punctuation.definition.entity.css	#ff0000	—
source.sass keyword.control	#00ffff	—
markup.inserted	#ff00ff	—
markup.deleted	#ff0000	—
markup.changed	#ff00ff	—
string.regexp	#00ffff	—
constant.character.escape	#ff0000	—
url, link, uri	—	underline
meta.decorator, tag.decorator.js entity.name.tag, tag.decorator.js punctuation.definition.tag	#ff00ff	—
source.js constant.other.object.key.js string.unquoted.label.js	#ff0080	italic
source.json meta.structure.dictionary.json support.type.property-name.json	#ff8000	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#ff00ff	—
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	#ff0080	—
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	#00ff00	—
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	#ff0000	—
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	#ff8000	—
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	#ff0080	—
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	#ff00ff	—
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	#ff0000	—
markup.italic	#ff00ff	italic
markup.bold	#ff0000	bold
markup.underline	#00ffff	underline
markup.strike	#ff0080	italic
markup.quote	#ff00ff	italic
markup.raw.block	#ff0000	—
markup.table	#ff00ff	—
text.html.markdown, punctuation.definition.list_item.markdown	#ff8000	—
text.html.markdown markup.raw.inline, text.html.markdown markup.inline.raw.string.markdown	#ff00ff	—
text.html.markdown meta.dummy.line-break	#ff0000	—
markdown.heading, markup.heading, markup.heading entity.name, markup.heading.markdown, punctuation.definition.heading.markdown	#00ffff	—
markup.quote, punctuation.definition.blockquote.markdown	#ff00ff	italic
string.other.link.title.markdown	#ff0000	underline
markup.raw.block.fenced.markdown	#ff00ff	—
punctuation.definition.fenced.markdown, variable.language.fenced.markdown	#00ff80	—
variable.language.fenced.markdown	#ff0080
meta.separator	#00ffff
token.info-token	#ff00ff	—
token.warn-token	#ff0000	—
token.error-token	#ff8000	—
token.debug-token	#00ffff	—
storage.type.error.go	#ff0080	—
punctuation.other.period.go	#00ff00	—

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