PaperColor Redux Theme

Name: PaperColor Redux Theme
Author: mrworkman

Publisher: mrworkmanThemes in package: 1

Updated papercolor theme for vscode.

GitHub

VS Code preview

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

PaperColor Redux Theme — PaperColor Redux

fetchUser.ts

index.ts

README.md

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Light+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.background#eeeeee
activityBar.border#B0BEC5
activityBar.foreground#155f87
activityBarBadge.background#d70087
activityBarBadge.foreground#eeeeee
badge.background#d70087
badge.foreground#eeeeee
button.background#0277BD
button.foreground#eeeeee
button.hoverBackground#155f87
contrastActiveBorder#00000000
contrastBorder#ffffff00
debugExceptionWidget.background#eeeeee
debugExceptionWidget.border#0d3a58
debugToolBar.background#eeeeee
descriptionForeground#aaa
diffEditor.diagonalFill#878787
diffEditor.insertedLineBackground#00870020
diffEditor.insertedTextBackground#00870030
diffEditor.removedLineBackground#D7000020
diffEditor.removedTextBackground#D7000030
diffEditorGutter.insertedLineBackground#008700
diffEditorGutter.removedLineBackground#d70000
dropdown.background#ffffff
dropdown.border#eeeeee
dropdown.foreground#444444
editor.background#f3f3f3
editor.findMatchBackground#ffff5f
editor.findMatchBorder#ffff5f
editor.findMatchHighlightBackground#ffff5f66
editor.findMatchHighlightBorder#ffff5f88
editor.findRangeHighlightBackground#CFD8DC60
editor.foreground#444444
editor.hoverHighlightBackground#B0BEC5dd
editor.inactiveSelectionBackground#0087af77
editor.lineHighlightBackground#e4e4e4
editor.lineHighlightBorder#e4e4e4
editor.rangeHighlightBackground#e4e4e4
editor.selectionBackground#0087af88
editor.selectionHighlightBackground#B3E5FC88
editor.wordHighlightBackground#ffffff21
editor.wordHighlightStrongBackground#ffffff21
editorBracketMatch.background#e0e0e0
editorBracketMatch.border#9e9e9e
editorCodeLens.foreground#aaa
editorCursor.foreground#005f87
editorError.border#00000000
editorError.foreground#F50057
editorGroup.border#CFD8DC
editorGroup.dropBackground#12273899
editorGroupHeader.noTabsBackground#eeeeee
editorGroupHeader.tabsBackground#eeeeee
editorGroupHeader.tabsBorder#B0BEC5
editorGutter.addedBackground#3C9F4A
editorGutter.background#eeeeee
editorGutter.deletedBackground#A22929
editorGutter.modifiedBackground#26506D
editorHoverWidget.background#ffffff
editorHoverWidget.border#005f87
editorIndentGuide.activeBackground#155f87a8
editorIndentGuide.background#155f8766
editorLineNumber.activeForeground#78909C
editorLineNumber.foreground#bdbdbd
editorLink.activeForeground#aaa
editorMarkerNavigation.background#3B536433
editorMarkerNavigationError.background#A22929
editorMarkerNavigationWarning.background#ffc600
editorOverviewRuler.border#0d3a58
editorOverviewRuler.commonContentForeground#ffc60055
editorOverviewRuler.currentContentForeground#ee3a4355
editorOverviewRuler.incomingContentForeground#3ad90055
editorRuler.foreground#ff408133
editorSuggestWidget.background#eeeeee
editorSuggestWidget.border#0d3a58
editorSuggestWidget.foreground#444444
editorSuggestWidget.highlightForeground#d70087
editorSuggestWidget.selectedBackground#B3E5FCe8
editorSuggestWidget.selectedForeground#444444
editorWarning.border#ffffff00
editorWarning.foreground#ffc600
editorWhitespace.foreground#0D47A148
editorWidget.background#eeeeee
editorWidget.border#0d3a58
editorWidget.resizeBorder#155f87
errorForeground#FF1744
extensionButton.prominentBackground#0088ff
extensionButton.prominentForeground#fff
extensionButton.prominentHoverBackground#ff9d00
focusBorder#0d3a58
foreground#444444
gitDecoration.conflictingResourceForeground#FF3D00
gitDecoration.deletedResourceForeground#FF1744
gitDecoration.ignoredResourceForeground#616161
gitDecoration.modifiedResourceForeground#F57F17
gitDecoration.untrackedResourceForeground#33691E
input.background#ffffff
input.border#eeeeee
input.foreground#444444
input.placeholderForeground#9E9E9E
inputOption.activeBorder#d70087
inputValidation.errorBackground#FCE4EC
inputValidation.errorBorder#EC407A
inputValidation.errorForeground#444444
inputValidation.infoBackground#fff
inputValidation.infoBorder#0277BD
inputValidation.infoForeground#444444
inputValidation.warningBackground#ffff8d
inputValidation.warningBorder#edd740
inputValidation.warningForeground#444444
list.activeSelectionBackground#0091EA
list.activeSelectionForeground#eeeeee
list.dropBackground#81D4FA
list.errorForeground#D50000
list.focusBackground#B3E5FC
list.focusForeground#444444
list.highlightForeground#d70087
list.hoverBackground#B3E5FC
list.hoverForeground#444444
list.inactiveFocusBackground#4FC3F7
list.inactiveSelectionBackground#0091EA88
list.inactiveSelectionForeground#444444
list.warningForeground#FF6F00
menu.background#eeeeee
menu.foreground#444444
menu.selectionBackground#0087af
menu.selectionForeground#eeeeee
menubar.selectionBackground#0087af
menubar.selectionForeground#eeeeee
merge.border#444444
merge.commonContentBackground#d7008736
merge.commonHeaderBackground#d70087
merge.currentContentBackground#78c2a354
merge.currentHeaderBackground#398d3d
merge.incomingContentBackground#0091EA36
merge.incomingHeaderBackground#0091EA
mergeEditor.change.background#4FC3F720
mergeEditor.change.word.background#4FC3F740
mergeEditor.conflict.handled.minimapOverViewRuler#008700
mergeEditor.conflict.handledFocused.border#00870040
mergeEditor.conflict.handledUnfocused.border#00870020
mergeEditor.conflict.unhandled.minimapOverViewRuler#4FC3F7
mergeEditor.conflict.unhandledFocused.border#4FC3F7
mergeEditor.conflict.unhandledUnfocused.border#4FC3F720
minimap.background#eeeeee
notificationCenter.border#0d3a58
notificationCenterHeader.background#eeeeee
notificationCenterHeader.foreground#444444
notificationLink.foreground#444444
notifications.background#ffffff
notifications.border#005f87
notifications.foreground#444444
notificationsErrorIcon.foreground#d70000
notificationsInfoIcon.foreground#005faf
notificationsWarningIcon.foreground#d75f00
notificationToast.border#0d3a58
panel.background#eeeeee
panel.border#B0BEC5
panelTitle.activeBorder#4A148C
panelTitle.activeForeground#444444
panelTitle.inactiveForeground#757575
peekView.border#B0BEC5
peekViewEditor.background#ECEFF1
peekViewEditor.matchHighlightBackground#19354900
peekViewEditorGutter.background#E0E0E0
peekViewResult.background#ECEFF1
peekViewResult.fileForeground#f00
peekViewResult.lineForeground#444444
peekViewResult.matchHighlightBackground#ffff8d
peekViewResult.selectionBackground#B3E5FC
peekViewResult.selectionForeground#444444
peekViewTitle.background#CFD8DC
peekViewTitleDescription.foreground#263238
peekViewTitleLabel.foreground#d70087
pickerGroup.border#0d3a58
pickerGroup.foreground#aaa
progressBar.background#d70087
scrollbar.shadow#00000000
scrollbarSlider.activeBackground#58585880
scrollbarSlider.background#58585820
scrollbarSlider.hoverBackground#58585840
selection.background#B3E5FC
settings.checkboxBackground#ffffff
settings.checkboxForeground#d70087
settings.headerForeground#155f87
sideBar.background#f3f3f3
sideBar.border#B0BEC5
sideBar.foreground#444444
sideBarSectionHeader.background#E0E0E0
sideBarSectionHeader.foreground#444444
sideBarTitle.foreground#444444
statusBar.background#155f87
statusBar.border#4A148C
statusBar.debuggingBackground#D50000
statusBar.debuggingBorder#4A148C
statusBar.debuggingForeground#eeeeee
statusBar.foreground#eeeeee
statusBar.noFolderBackground#155f87
statusBar.noFolderBorder#4A148C
statusBar.noFolderForeground#eeeeee
statusBarItem.activeBackground#039BE5
statusBarItem.errorBackground#ff0000
statusBarItem.errorForeground#ffffff
statusBarItem.hoverBackground#0277BD
statusBarItem.prominentBackground#039BE5
statusBarItem.prominentHoverBackground#0277BD
statusBarItem.warningBackground#f9f97a
statusBarItem.warningForeground#000000
tab.activeBackground#eeeeee
tab.activeBorder#eeeeee
tab.activeForeground#444444
tab.border#B0BEC5
tab.inactiveBackground#E0E0E0
tab.inactiveForeground#757575
tab.unfocusedActiveForeground#757575
tab.unfocusedInactiveForeground#9E9E9E
terminal.ansiBlack#000000
terminal.ansiBlue#005F87
terminal.ansiBrightBlack#738287
terminal.ansiBrightBlue#0087AF
terminal.ansiBrightCyan#00B0B0
terminal.ansiBrightGreen#6DB525
terminal.ansiBrightMagenta#AD7FA8
terminal.ansiBrightRed#EF2929
terminal.ansiBrightWhite#193549
terminal.ansiBrightYellow#FF8412
terminal.ansiCyan#008787
terminal.ansiGreen#508A18
terminal.ansiMagenta#75507B
terminal.ansiRed#CC0000
terminal.ansiWhite#ffffff
terminal.ansiYellow#EA780C
terminal.background#f3f3f3
terminal.foreground#444444
terminal.selectionBackground#155f8740
terminalCursor.background#dddddd
terminalCursor.foreground#757575
textBlockQuote.background#EDE7F6
textBlockQuote.border#6200EA
textCodeBlock.background#E0E0E0
textLink.activeForeground#7E57C2
textLink.foreground#311B92
textPreformat.foreground#d70087
textSeparator.foreground#f00
titleBar.activeBackground#eeeeee
titleBar.activeForeground#444444
titleBar.border#00000008
titleBar.inactiveBackground#c7c7c7aa
titleBar.inactiveForeground#01579B
walkThrough.embeddedEditorBackground#e0e0e068
welcomePage.background#ECEFF1
widget.shadow#155f8766

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
invalid	#af0000
entity.name.type.option, entity.name.type.result	#008700
constant.language.bool, constant.language.boolean, constant.language.java, constant.language.json, constant.language.kotlin, constant.language.php, constant.language.python, constant.other.boolean	#008700	bold
string, text.html.markdown markup.fenced_code.block, text.html.markdown markup.inline.raw.string, text.html.markdown markup.raw.block	#5f8700
entity.string.template.element punctuation.definition, entity.string.template.element punctuation.section.block, keyword.control.new, keyword.mnemonic, keyword.operator, keyword.other.new, meta.interpolation punctuation.definition.interpolation, meta.preprocessor keyword.control.directive, meta.template.expression punctuation, punctuation.brackets.angle, punctuation.separator, source.cpp keyword.control.directive, source.css constant.other.color punctuation.definition, source.css meta.function support.function, source.css meta.function punctuation.section.function, source.dockerfile punctuation.separator constant.numeric.version, source.dockerfile variable.other.dockerfile, source.python meta.fstring constant.character.format.placeholder, source.shell punctuation.section.bracket.curly, source.shell variable.other.normal, source.shell variable.parameter.positional, source.sass entity.name.function, source.viml entity.tag.name, source.viml constant.character.escape, source.viml punctuation.expression.bracket.curly, source.viml punctuation.expression.bracket.round, storage.type.function.arrow, support.function.mnemonic, text.html.markdown heading punctuation, text.html.php meta.embedded.block punctuation.section.embedded	#0087af
keyword.declaration.enum storage.type, keyword.declaration.struct storage.type, keyword.operator.logical, keyword.other.class, keyword.other.enum, meta.attribute.rust, meta.class meta.class.identifier storage.modifier, meta.class meta.definition.class.inherited storage.modifier.extends, meta.declaration.annotation, meta.decorator meta.brace.round, meta.decorator meta.function-call entity.name.function, meta.decorator punctuation.decorator, meta.function.decorator entity.name.function.decorator, meta.function.decorator punctuation.definition, meta.function.decorator support.type, source.js storage.modifier, storage.type.class, storage.type.struct, support.function.magic	#0087af	bold
string.json punctuation.support.type.property-name, text.html meta.tag.metadata.doctype, text.html meta.tag.metadata.doctype entity.other.attribute-name, meta.tag punctuation.separator	#878787
comment.line.quotes support.constant.field	#878787	bold
comment	#878787	italic
constant.language.registers, entity.name.type, entity.name.type.class, entity.name.type.struct, entity.name.type.trait, source.cs meta.tag entity.other.attribute-name, source.dockerfile variable.other.assignment, source.js meta.tag.attributes string.quoted, source.shell variable.other.assignment, source.viml support.variable, source.viml variable.other, source.viml variable.other storage.modifier, source.vue meta.attribute, source.vue meta.attribute string.quoted punctuation.definition, storage.register, text meta.tag meta.attribute.style punctuation.definition, text.html entity.other.attribute-name, text.html meta.attribute string.quoted punctuation.definition, text.xml entity.other.attribute-name, text.xml meta.tag string.quoted punctuation.definition	#005f87
source.css support.type.property-name, source.rust storage.type, source.sass support.type.property-name, storage.modifier, storage.type.modifier	#005f87	bold
meta.interpolation, meta.template.expression, meta.import storage.modifier.import, meta.package storage.modifier.package, meta.use entity.name.type, source.json punctuation.separator.dictionary.key-value, source.kotlin entity.string.template.element, source.toml meta.tag punctuation.definition.table.array, source.ts punctuation.separator.key-value, source.viml entity.name.function storage.modifier.scope, source.viml punctuation.separator.comma, string.unquoted.plain.out	#444444
text.html.markdown markup.italic	#444444	italic
meta.macro entity.name, source.dockerfile entity.name.image, text.html.markdown markup.bold	#444444	bold
keyword.control.try, keyword.control.catch, keyword.control.finally, keyword.control.trycatch, keyword.control.throw, keyword.control.flow.throw, source.makefile entity.name.function.target, support.type.exception.python	#d70000
keyword.declaration.trait, keyword.other storage.type, keyword.control.directive.include, keyword.control.flow.return, keyword.control.from, keyword.control.import, keyword.control.return, keyword.other.fn, keyword.other.using, keyword.other.rust, keyword.other.kotlin, meta.import keyword, meta.package keyword, meta.use keyword, meta.var.expr storage.type, punctuation.definition.block.sequence.item, punctuation.separator.dictionary.key-value, punctuation.separator.key-value.mapping, source.arm variable.named, source.cs meta.tag, source.css meta.selector entity.name.tag, source.dockerfile meta.command constant.character.escape.line-continuation, source.css meta.selector entity.other.attribute-name, source.ini entity.name.section.group-title, source.js entity.other.attribute-name, source.makefile string.interpolated punctuation.definition, source.sass entity.other.attribute-name, source.shell entity.name.command, source.toml entity.other.attribute-name.table, source.toml meta.tag punctuation.definition.table, source.viml storage.function, source.viml support.function, source.vue entity.name.tag, storage.type.function, text meta.tag, text.html.markdown meta string.other.link, text.html.markdown markup.quote punctuation.definition.quote, text.html.php variable punctuation.definition, text.xml meta.tag.preprocessor punctuation.definition.tag	#d70087
entity.name.type.anchor, entity.name.type.numeric, entity.name.type.primitive, keyword.control.property.anchor punctuation.definition.anchor, keyword.other.rust storage.type, keyword.other.typedef, keyword.other.var, keyword.type, punctuation.definition.alias, source.dockerfile constant.numeric.version, source.js meta.var.expr storage.type, storage.type.built-in.primitive, storage.type.kotlin, storage.type.ts, storage.type.let, storage.type.primitive, support.class.kotlin, text.html.markdown heading entity.name.section, variable.other.alias	#d70087	bold
entity.name.type.lifetime, meta.import punctuation.definition, source.js meta.tag, source.shell string.interpolated punctuation.definition, text.html.markdown markup.list punctuation.definition, text.html.markdown meta punctuation.definition.link	#8700af
keyword.control	#8700af	bold
constant, keyword.control.unit, keyword.other.unit, variable.language.self, source.css support.constant.property-value, source.python variable.parameter.function-call, source.sass support.constant.property-value, text meta.tag entity.name.tag.namespace	#d75f00
constant.other.caps, entity.name.label, entity.name.namespace, keyword, meta.preprocessor entity.name, meta.preprocessor keyword.control, meta.use entity.name, source.cs meta.tag punctuation.definition, source.ts meta.object-literal.key, source.viml meta.parameter entity.name.parameter, source.viml support.variable.environment, source.vue punctuation.definition.tag, string entity.name.tag, string support.type.property-name, text meta.tag punctuation.definition.tag, text.html.markdown markup.fenced_code punctuation.definition, text.html.markdown markup.fenced_code fenced_code.block.language, text.html.markdown markup.inline.raw.string punctuation.definition, text.html.markdown meta markup.underline.link, variable.language.super, variable.other.constant, variable.other.makefile	#005faf
keyword.other.namespace, keyword.other.struct, keyword.other.typedef, source.css constant.other.color, source.css support.constant.color, source.shell support.function.builtin, source.python meta.function-call support.type, source.python support.function.builtin, source.viml entity.name.function, source.vue constant.language.color, support.function.kotlin, text.html.php support.function	#005faf	bold

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