Newspaper

Name: Newspaper
Author: rphlmr

Publisher: rphlmrThemes in package: 1

A simple light theme with few colors

GitHub

VS Code preview

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

Newspaper — Newspaper

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#fafafa
activityBar.border#fafafa
activityBar.foreground#09090b
activityBarBadge.background#09090b
activityBarBadge.foreground#fafafa
badge.background#09090b
badge.foreground#fafafa
button.background#09090b
button.foreground#fafafa
button.hoverBackground#09090bcc
button.secondaryBackground#e4e4e7
button.secondaryForeground#09090b
button.secondaryHoverBackground#e4e4e780
commandCenter.activeBackground#e4e4e780
commandCenter.activeBorder#e4e4e7
commandCenter.activeForeground#09090b
commandCenter.background#fafafa
commandCenter.border#e4e4e7
commandCenter.foreground#09090b
debugConsole.errorForeground#991b1b
debugConsole.infoForeground#1e40af
debugConsole.warningForeground#92400e
debugIcon.breakpointForeground#991b1b
debugIcon.continueForeground#1e40af
debugIcon.pauseForeground#1e40af
debugIcon.restartForeground#115e59
debugIcon.startForeground#1e40af
debugIcon.stepBackForeground#1e40af
debugIcon.stepIntoForeground#1e40af
debugIcon.stepOutForeground#1e40af
debugIcon.stepOverForeground#1e40af
debugIcon.stopForeground#991b1b
debugView.exceptionLabelBackground#dc2626
debugView.exceptionLabelForeground#fafafa
debugView.stateLabelBackground#09090b
debugView.stateLabelForeground#fafafa
diffEditor.insertedLineBackground#4d7c0f1a
diffEditor.insertedTextBackground#4d7c0f26
diffEditor.removedLineBackground#be123c1a
diffEditor.removedTextBackground#be123c26
editor.background#fafafa
editor.findMatchBackground#d4d4d866
editor.findMatchHighlightBackground#d4d4d866
editor.findRangeHighlightBackground#d4d4d833
editor.findRangeHighlightBorder#f4f4f5
editor.foldBackground#f4f4f5e6
editor.foreground#09090b
editor.hoverHighlightBackground#d4d4d866
editor.lineHighlightBackground#f4f4f5
editor.linkedEditingBackground#e4e4e7
editor.rangeHighlightBackground#f4f4f5
editor.selectionBackground#d4d4d8cc
editor.selectionHighlightBackground#d4d4d8cc
editor.wordHighlightBackground#d4d4d800
editor.wordHighlightStrongBackground#d4d4d866
editorBracketHighlight.foreground1#71717a
editorBracketHighlight.foreground2#71717a
editorBracketHighlight.foreground3#71717a
editorBracketHighlight.foreground4#71717a
editorBracketHighlight.foreground5#71717a
editorBracketHighlight.foreground6#71717a
editorBracketMatch.background#e4e4e7
editorCodeLens.foreground#a1a1aa
editorCursor.foreground#09090b
editorGhostText.foreground#a1a1aa
editorGroupHeader.tabsBackground#fafafa
editorGutter.addedBackground#4d7c0f80
editorGutter.deletedBackground#be123c80
editorGutter.modifiedBackground#0369a180
editorIndentGuide.activeBackground1#d4d4d8
editorIndentGuide.background1#f4f4f5
editorLineNumber.activeForeground#09090b
editorLineNumber.foreground#d4d4d8
editorLink.activeForeground#09090b
editorOverviewRuler.background#fafafa
editorOverviewRuler.border#fafafa
editorWidget.background#fafafa
editorWidget.border#e4e4e7
errorForeground#dc2626
errorLens.statusBarErrorForeground#dc2626
focusBorder#e4e4e780
foreground#52525b
gitDecoration.addedResourceForeground#4d7c0f
gitDecoration.deletedResourceForeground#be123c
gitDecoration.ignoredResourceForeground#a1a1aa
gitDecoration.modifiedResourceForeground#0369a1
gitDecoration.stageModifiedResourceForeground#0369a1
gitDecoration.untrackedResourceForeground#4d7c0f
icon.foreground#09090b
list.activeSelectionBackground#e4e4e780
list.activeSelectionForeground#09090b
list.errorForeground#dc2626
list.hoverBackground#e4e4e780
list.hoverForeground#09090b
list.inactiveSelectionBackground#e4e4e780
list.inactiveSelectionForeground#09090b
list.warningForeground#ca8a04
panel.background#fafafa
panel.border#e4e4e780
panelTitle.activeBorder#09090b
panelTitle.activeForeground#09090b
panelTitle.inactiveForeground#52525b
peekView.border#e4e4e7
peekViewEditor.background#fafafa
peekViewEditor.matchHighlightBackground#e4e4e7
peekViewResult.background#fafafa
peekViewResult.lineForeground#09090b
peekViewResult.matchHighlightBackground#e4e4e7
peekViewResult.selectionBackground#e4e4e780
peekViewResult.selectionForeground#09090b
peekViewTitle.background#fafafa
peekViewTitleDescription.foreground#09090b
peekViewTitleLabel.foreground#09090b
scrollbarSlider.activeBackground#e4e4e780
scrollbarSlider.background#e4e4e780
scrollbarSlider.hoverBackground#e4e4e7cc
settings.headerForeground#09090b
settings.modifiedItemIndicator#0369a1
settings.settingsHeaderHoverForeground#09090b
settings.textInputForeground#09090b
sideBar.background#fafafa
sideBar.border#fafafa
sideBarSectionHeader.background#fafafa
sideBarSectionHeader.foreground#09090b
statusBar.background#fafafa
statusBar.debuggingBackground#dbeafe
statusBar.foreground#09090b
statusBar.noFolderBackground#fafafa
statusBarItem.errorBackground#dc2626
statusBarItem.errorForeground#fafafa
statusBarItem.errorHoverBackground#dc2626
statusBarItem.errorHoverForeground#fafafa
statusBarItem.remoteBackground#fafafa00
statusBarItem.remoteForeground#09090b
statusBarItem.remoteHoverBackground#fafafa00
statusBarItem.remoteHoverForeground#09090b
statusBarItem.warningBackground#ca8a04
statusBarItem.warningForeground#fafafa
statusBarItem.warningHoverBackground#ca8a04
statusBarItem.warningHoverForeground#fafafa
tab.activeBackground#e4e4e780
tab.activeBorderTop#09090b
tab.activeForeground#09090b
tab.hoverBackground#e4e4e780
tab.hoverForeground#09090b
tab.inactiveBackground#fafafa
tab.inactiveForeground#52525b
terminal.ansiBlack#fafafa
terminal.ansiBlue#1e40af
terminal.ansiBrightBlack#09090b
terminal.ansiBrightBlue#1e40af
terminal.ansiBrightCyan#155e75
terminal.ansiBrightGreen#115e59
terminal.ansiBrightMagenta#86198f
terminal.ansiBrightRed#991b1b
terminal.ansiBrightWhite#fafafa
terminal.ansiBrightYellow#92400e
terminal.ansiCyan#155e75
terminal.ansiGreen#115e59
terminal.ansiMagenta#86198f
terminal.ansiRed#991b1b
terminal.ansiWhite#09090b
terminal.ansiYellow#92400e
terminal.background#fafafa
terminal.foreground#09090b
textLink.activeForeground#075985
textLink.foreground#075985
textPreformat.foreground#075985
titleBar.activeBackground#fafafa
titleBar.activeForeground#09090b
titleBar.border#fafafa
titleBar.inactiveBackground#fafafa
titleBar.inactiveForeground#09090b80
tree.inactiveIndentGuidesStroke#e4e4e7
tree.indentGuidesStroke#d4d4d8

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#a1a1aa	—
punctuation.definition, punctuation.support.type.property-name, punctuation.terminator.statement, punctuation.section, punctuation.separator, meta.brace, keyword.operator.assignment, keyword.operator.expression.typeof, punctuation.accessor, keyword.operator, constant.language, storage, storage.type.class.jsdoc	#71717a	—
punctuation.definition.heading.markdown, punctuation.definition.bold.markdown, punctuation.definition.italic.markdown, punctuation.definition.strikethrough.markdown, punctuation.definition.link.title.begin.markdown, punctuation.definition.link.title.end.markdown, punctuation.definition.metadata.markdown, storage.type.function, storage.type.type, storage.type.interface	#86198f
string, markup.inline.raw.string.markdown, markup.underline.link	#075985	—
constant.numeric, constant.language	#5b21b6
constant.character, constant.other	#86198f	—
variable, support.type.property-name.json	#09090b	—
keyword, storage.modifier, storage.type.class	#86198f
keyword.control.flow, keyword.control.loop, keyword.control.trycatch, keyword.control.default, storage.modifier.async	—	bold
entity.name.class, markup.bold.markdown, markup.heading.markdown	#09090b	bold
markup.italic.markdown	#09090b	italic
entity.name.function	#09090b	bold
entity.other.attribute-name	#09090b
support.class	#09090b	bold
keyword.control.export	#86198f	bold
entity.name.type, entity.other.inherited-class, support.type.primitive, support.type.builtin	#a1a1aa
variable.object.property.ts, meta.object-literal.key	#09090b
support.class.component, entity.name.tag	#09090b	bold
entity.name.type.class, entity.name.type.alias, entity.other.inherited-class	#09090b	bold
entity.other.attribute-name	#71717a
meta.tag.without-attributes, meta.jsx.children	#09090b
support.other.variable	#09090b
invalid.illegal	#dc2626	italic
invalid.deprecated	#dc2626	italic strikethrough
meta.diff.header.from-file	#434343	—
meta.diff.header.to-file	#434343	—
meta.diff.range, meta.diff.index, meta.separator	#434343	—
token.info-token	#316BCD	—
token.warn-token	#CD9731	—
token.error-token	#CD3131	—
token.debug-token	#800080	—

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