All Blue

Name: All Blue
Author: njshockey

Publisher: njshockeyThemes in package: 3

A theme that's a little too obsessed with a certain primary color

GitHub

Color themes

VS Code preview

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

All Blue — All Blue Calm

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.background#001E33
activityBar.foreground#00CCFF
activityBarBadge.background#007FFF
activityBarBadge.foreground#ffffff
badge.background#007FFF
badge.foreground#ffffff
breadcrumb.activeSelectionForeground#ffffff
breadcrumb.focusForeground#ffffff
breadcrumb.foreground#63C5DA
breadcrumbPicker.background#001E33
button.background#003A63
button.foreground#eceff4
button.separator#006680
commandCenter.activeBackground#003459
commandCenter.activeBorder#003459
commandCenter.activeForeground#AEC6CF
commandCenter.background#001E33
commandCenter.foreground#63C5DA
commandCenter.inactiveBorder#002C4C
debugIcon.breakpointCurrentStackframeForeground#00CCFF
debugIcon.breakpointDisabledForeground#006680
debugIcon.breakpointForeground#00CCFF
debugIcon.breakpointStackframeForeground#00CCFF
debugIcon.breakpointUnverifiedForeground#00CCFF
debugIcon.continueForeground#00CCFF
debugIcon.disconnectForeground#FF7566
debugIcon.pauseForeground#00CCFF
debugIcon.restartForeground#50C878
debugIcon.startForeground#00CCFF
debugIcon.stepBackForeground#00CCFF
debugIcon.stepIntoForeground#00CCFF
debugIcon.stepOutForeground#00CCFF
debugIcon.stepOverForeground#00CCFF
debugIcon.stopForeground#FF7566
debugToolBar.background#002E4F
descriptionForeground#63C5DA
dropdown.background#001E33
dropdown.foreground#63C5DA
editor.background#002138
editor.findMatchBackground#00528C8e
editor.findMatchBorder#00CCFF
editor.findMatchHighlightBackground#00528C8e
editor.foldBackground#002138
editor.foreground#63C5DA
editor.hoverHighlightBackground#00528C8e
editor.lineHighlightBackground#002C4C
editor.rangeHighlightBackground#00528C8e
editor.selectionBackground#003A63
editor.wordHighlightBackground#00528C8e
editor.wordHighlightStrongBackground#00528C8e
editor.wordHighlightStrongBorder#4F86F7
editorBracketHighlight.foreground1#8BC6FC
editorBracketHighlight.foreground2#FEF08A
editorBracketHighlight.foreground3#63C5DA
editorBracketHighlight.foreground4#FFAC40
editorBracketHighlight.foreground5#85A1F2
editorBracketHighlight.foreground6#50C878
editorBracketHighlight.unexpectedBracket.foreground#FF7566
editorBracketMatch.background#00528C8e
editorBracketMatch.border#00000000
editorCodeLens.foreground#006680
editorCursor.foreground#0094FF
editorError.foreground#FF7566
editorGhostText.foreground#006680
editorGroup.border#003459
editorGroup.dropBackground#003A638e
editorGroupHeader.tabsBackground#001E33
editorGutter.addedBackground#2E8B57
editorGutter.commentRangeForeground#006680
editorGutter.deletedBackground#FF7566
editorGutter.modifiedBackground#005999
editorHoverWidget.background#001E33
editorHoverWidget.border#003459
editorHoverWidget.foreground#00CCFF
editorHoverWidget.statusBarBackground#002540
editorIndentGuide.activeBackground1#63C5DA
editorIndentGuide.background1#003459
editorInfo.foreground#85A1F2
editorInlayHint.background#002138
editorInlayHint.foreground#006680
editorInlayHint.parameterBackground#002138
editorInlayHint.parameterForeground#006680
editorInlayHint.typeForeground#00CCFF
editorLightBulb.foreground#FEF08A
editorLineNumber.activeForeground#63C5DA
editorLineNumber.foreground#006680
editorLink.activeForeground#0892D0
editorOverviewRuler.addedForeground#2E8B57
editorOverviewRuler.border#00000000
editorOverviewRuler.bracketMatchForeground#00528C8e
editorOverviewRuler.deletedForeground#FF7566
editorOverviewRuler.errorForeground#FF7566
editorOverviewRuler.findMatchForeground#00528C8e
editorOverviewRuler.infoForeground#85A1F2
editorOverviewRuler.modifiedForeground#005999
editorOverviewRuler.rangeHighlightForeground#00528C8e
editorOverviewRuler.selectionHighlightForeground#00528C8e
editorOverviewRuler.warningForeground#FFAC40
editorOverviewRuler.wordHighlightForeground#00528C8e
editorOverviewRuler.wordHighlightStrongForeground#4F86F7
editorSuggestWidget.background#002540
editorSuggestWidget.border#003459
editorSuggestWidget.focusHighlightForeground#00CCFF
editorSuggestWidget.foreground#63C5DA
editorSuggestWidget.highlightForeground#00CCFF
editorSuggestWidget.selectedBackground#003A63
editorSuggestWidget.selectedForeground#D8DEE9
editorWarning.foreground#FFAC40
editorWhitespace.foreground#006680
editorWidget.background#001E33
editorWidget.foreground#63C5DA
editorWidget.resizeBorder#0094FF
errorForeground#FF7566
extensionButton.background#003A63
extensionButton.foreground#eceff4
extensionButton.separator#006680
extensionIcon.verifiedForeground#0094FF
focusBorder#003459
foreground#63C5DA
gitDecoration.addedResourceForeground#FEF08A
gitDecoration.conflictingResourceForeground#FF7566
gitDecoration.deletedResourceForeground#FF7566
gitDecoration.ignoredResourceForeground#006680
gitDecoration.modifiedResourceForeground#85A1F2
gitDecoration.renamedResourceForeground#85A1F2
gitDecoration.stageDeletedResourceForeground#FF7566
gitDecoration.stageModifiedResourceForeground#FEF08A
gitDecoration.untrackedResourceForeground#50C878
icon.foreground#63C5DA
input.background#001E33
input.border#002C4C
input.foreground#63C5DA
input.placeholderForeground#006680
inputValidation.errorBackground#002138
inputValidation.errorBorder#FF7566
inputValidation.errorForeground#63C5DA
inputValidation.infoBackground#002138
inputValidation.infoBorder#85A1F2
inputValidation.infoForeground#63C5DA
inputValidation.warningBackground#002138
inputValidation.warningBorder#FFAC40
inputValidation.warningForeground#63C5DA
keybindingLabel.background#002C4C
keybindingLabel.border#003459
keybindingLabel.foreground#63C5DA
keybindingTable.headerBackground#002C4C
keybindingTable.rowsBackground#001E33
list.activeSelectionForeground#eceff4
list.dropBackground#003A638e
list.errorForeground#FF7566
list.focusOutline#002138
list.hoverBackground#002540
list.inactiveFocusOutline#002138
list.inactiveSelectionBackground#002138
list.warningForeground#FFAC40
menu.background#002138
menu.foreground#63C5DA
menu.selectionBackground#003459
menu.selectionForeground#eceff4
menu.separatorBackground#003459
menubar.selectionBackground#003459
menubar.selectionForeground#eceff4
minimap.errorHighlight#FF7566
minimap.findMatchHighlight#00528C8e
minimap.selectionHighlight#00528C8e
minimap.selectionOccurrenceHighlight#00528C8e
minimap.warningHighlight#FFAC40
minimapGutter.addedBackground#2E8B57
minimapGutter.deletedBackground#FF7566
minimapGutter.modifiedBackground#005999
panel.border#003459
panelSection.dropBackground#003A638e
panelTitle.activeForeground#eceff4
panelTitle.inactiveForeground#63C5DA
peekView.border#003459
peekViewEditor.background#001E33
peekViewEditor.matchHighlightBackground#003A63
peekViewResult.background#001E33
peekViewResult.fileForeground#63C5DA
peekViewTitle.background#002138
peekViewTitleDescription.foreground#006680
peekViewTitleLabel.foreground#63C5DA
pickerGroup.border#003459
pickerGroup.foreground#8BC6FC
problemsErrorIcon.foreground#FF7566
problemsInfoIcon.foreground#85A1F2
problemsWarningIcon.foreground#FFAC40
quickInput.background#001E33
quickInput.foreground#63C5DA
quickInputList.focusBackground#003459
quickInputList.focusForeground#eceff4
quickInputList.focusIconForeground#eceff4
quickInputTitle.background#003459
sash.hoverBorder#0094FF
scrollbarSlider.activeBackground#0059998e
scrollbarSlider.background#003A638e
scrollbarSlider.hoverBackground#004b808e
selection.background#003A63
settings.checkboxBackground#001E33
settings.checkboxBorder#003459
settings.checkboxForeground#63C5DA
settings.dropdownBackground#001E33
settings.dropdownBorder#003459
settings.dropdownForeground#63C5DA
settings.dropdownListBorder#003459
settings.focusedRowBackground#001E33
settings.focusedRowBorder#003459
settings.headerBorder#003459
settings.headerForeground#eceff4
settings.modifiedItemIndicator#0094FF
settings.numberInputBackground#001E33
settings.numberInputBorder#003459
settings.numberInputForeground#63C5DA
settings.rowHoverBackground#001E33
settings.sashBorder#003459
settings.settingsHeaderHoverForeground#eceff4
settings.textInputBackground#001E33
settings.textInputBorder#003459
settings.textInputForeground#63C5DA
sideBar.background#001E33
sideBar.dropBackground#003A638e
sideBar.foreground#63C5DA
sideBarSectionHeader.background#001E33
sideBarTitle.foreground#63C5DA
statusBar.background#001E33
statusBar.debuggingBackground#004B80
statusBar.debuggingForeground#eceff4
statusBar.focusBorder#00000000
statusBar.foreground#63C5DA
statusBar.noFolderBackground#001E33
statusBar.noFolderForeground#63C5DA
statusBarItem.activeBackground#003A63
statusBarItem.focusBorder#00000000
statusBarItem.hoverBackground#003459
statusBarItem.remoteBackground#006680
statusBarItem.remoteForeground#eceff4
tab.activeBackground#002540
tab.activeBorder#00CCFF
tab.activeForeground#eceff4
tab.activeModifiedBorder#0094FF
tab.border#00000000
tab.inactiveBackground#001E33
tab.inactiveForeground#006680
tab.inactiveModifiedBorder#0094FF
terminal.ansiBlack#000000
terminal.ansiBlue#4F86F7
terminal.ansiBrightBlack#2E3440
terminal.ansiBrightBlue#079BF5
terminal.ansiBrightCyan#00CCFF
terminal.ansiBrightGreen#0BDA51
terminal.ansiBrightMagenta#F77FBE
terminal.ansiBrightRed#FF7566
terminal.ansiBrightWhite#FFFFFF
terminal.ansiBrightYellow#FFFD37
terminal.ansiCyan#AEC6CF
terminal.ansiGreen#50C878
terminal.ansiMagenta#FC8EAC
terminal.ansiRed#F9968B
terminal.ansiWhite#E5E9F0
terminal.ansiYellow#FEF08A
terminal.dropBackground#003A638e
terminal.findMatchBackground#00528C8e
terminal.findMatchBorder#00CCFF
terminal.foreground#63C5DA
terminal.inactiveSelectionBackground#002E4F
terminal.selectionBackground#003A63
terminalCommandDecoration.defaultBackground#63C5DA
terminalCommandDecoration.errorBackground#FF7566
terminalCommandDecoration.successBackground#85A1F2
terminalCursor.foreground#0094FF
terminalOverviewRuler.cursorForeground#0094FF
terminalOverviewRuler.findMatchForeground#00528C8e
textBlockQuote.background#001E33
textBlockQuote.border#0094FF
textCodeBlock.background#001E33
textLink.activeForeground#AEC6CF
textLink.foreground#0094FF
textPreformat.foreground#85A1F2
textSeparator.foreground#006680
titleBar.activeBackground#001E33
titleBar.activeForeground#63C5DA
titleBar.inactiveBackground#002138
titleBar.inactiveForeground#006680
tree.indentGuidesStroke#004B80
walkThrough.embeddedEditorBackground#001E33
walkthrough.stepTitle.foreground#63C5DA
welcomePage.progress.foreground#0094FF
welcomePage.tileBackground#001E33
welcomePage.tileHoverBackground#003459

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#006680	italic
keyword.other.definition	#ff0000	—
keyword.control, constant.other.color, 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, keyword.other.fn.rust, keyword.other.rust	#8BC6FC	—
keyword, storage.type, storage.modifier, keyword.other.definition, support.type.property-name	#8BC6FC	—
keyword.other.unit	#8BC6FC	—
variable, string constant.other.placeholder	#FFAC40	—
meta.block variable.other	#FFAC40	—
variable.parameter, support.other.variable, string.other.link, meta.attribute.python	#FFAC40	—
entity.other.attribute-name.id.css, source.sass keyword.control	#FFAC40	—
variable.other.object	#50C878	—
variable.other.property, variable.other.object.property	#8BC6FC	italic
constant.numeric, constant.language, support.constant, constant.character, constant.escape	#FC8EAC	italic
keyword.other	#FC8EAC
constant.other.color	#FC8EAC	italic
variable.language	#FC8EAC	italic
source.js constant.other.object.key.js string.unquoted.label.js	#FC8EAC	italic
support.type, entity.name.type.numeric.rust, entity.name.type.primitive	#FEF08A	—
entity.other.attribute-name	#FEF08A	italic
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name	#FEF08A	italic
entity.name, support.type, support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types	#FEF08A	—
entity.other.attribute-name.class	#FEF08A	—
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method	#85A1F2	—
entity.name.module.js, variable.import.parameter.js, variable.other.class.js	#85A1F2	—
entity.name.method.js	#85A1F2	italic
meta.class-method.js entity.name.function.js, variable.function.constructor	#85A1F2	—
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js, meta.decorator.js, meta.decorator.ts	#85A1F2	italic
entity.other.attribute-name.pseudo-class.css, meta.selector.css	#85A1F2	—
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter	#F9968B	—
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	#63C5DA	—
support.class.component	#50C878	—
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	#D5C2A5	—
invalid, invalid.illegal	#FF7566	—
markup.inserted	#FEF08A	—
markup.deleted	#FF7566	—
markup.changed	#85A1F2	—
string.regexp	#50C878	—
constant.character.escape	#85A1F2	—
url, link, uri	—	underline
source.json meta.structure.dictionary.json support.type.property-name.json	#8BC6FC	—
text.html.markdown, punctuation.definition.list_item.markdown	#63C5DA	—
text.html.markdown markup.inline.raw.markdown	#8BC6FC	—
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown	#50C878	—
markdown.heading, entity.name.section.markdown, markup.heading \| markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown	#85A1F2	—
markup.quote punctuation.definition.blockquote.markdown	#001E33	—
string.other.link.title.markdown	#FFAC40	—
string.other.link.description.title.markdown	#D5C2A5	—
constant.other.reference.link.markdown	#FFAC40	—
markup.raw.block.fenced.markdown	#000000	—
punctuation.definition.fenced.markdown	#00000050	—
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end	#FFAC40	—
variable.language.fenced.markdown	#50C878	—
meta.separator	#eceff4	bold
markup.italic	#85A1F2	italic
markup.bold, markup.bold string	#85A1F2	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	#85A1F2	italic bold
markup.underline	#85A1F2	underline
markup.raw.block	#85A1F2	—
markup.quote	—	italic
markup.table	#63C5DA	—

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