Siberia

Name: Siberia
Author: Pavel

Publisher: PavelThemes in package: 2

GitHub

Color themes

VS Code preview

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

Siberia — Siberia Night

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.activeBackground#22232e
activityBar.activeBorder#90aecd
activityBar.activeFocusBorder#b0c9e4
activityBar.background#1e1f29
activityBar.border#1e1f29
activityBar.dropBorder#1e1f29
activityBar.foreground#b7bad7
activityBar.inactiveForeground#56586f
activityBarBadge.background#90aecd
activityBarBadge.foreground#4a5b6c
badge.background#90aecd
badge.foreground#0e1419
button.background#16171f
button.border#0000
button.foreground#a7aac5
button.hoverBackground#1a1b24
button.secondaryBackground#a2a5bf
button.secondaryForeground#1a1b24
button.secondaryHoverBackground#979ab2
button.separator#07070c
checkbox.background#2a2b38
checkbox.border#2a2b38
checkbox.foreground#b7bad7
commandCenter.activeBackground#262733
commandCenter.activeBorder#22232e
commandCenter.background#22232e
commandCenter.border#22232e
commandCenter.foreground#b7bad7
commandCenter.inactiveBorder#22232e
debugIcon.breakpointForeground#bc808c
debugToolBar.background#1e1f29
descriptionForeground#696b87
diffEditor.border#1e1f29
diffEditor.diagonalFill#2a2b38
diffEditor.insertedLineBackground#364152
diffEditor.insertedTextBackground#3e4a5d
diffEditor.removedLineBackground#bc808c1A
diffEditor.removedTextBackground#bc808c1A
dropdown.background#2a2b38
dropdown.border#2a2b38
dropdown.foreground#b7bad7
dropdown.listBackground#2a2b38
editor.background#22232e
editor.findMatchBackground#444658
editor.findMatchHighlightBackground#2a2b38
editor.findRangeHighlightBackground#2a2b38
editor.foldBackground#323443
editor.foreground#b7bad7
editor.hoverHighlightBackground#2a2b38
editor.inactiveSelectionBackground#323443
editor.lineHighlightBackground#262733
editor.lineHighlightBorder#262733
editor.linkedEditingBackground#2a2b38
editor.selectionBackground#323443
editor.selectionHighlightBackground#0000
editor.snippetFinalTabstopHighlightBackground#2a2b38
editor.snippetTabstopHighlightBackground#2a2b38
editor.wordHighlightBackground#0000
editor.wordHighlightStrongBackground#0000
editorBracketHighlight.foreground1#b7bad7
editorBracketHighlight.foreground2#b7bad7
editorBracketHighlight.foreground3#b7bad7
editorBracketHighlight.foreground4#b7bad7
editorBracketHighlight.foreground5#b7bad7
editorBracketHighlight.foreground6#b7bad7
editorBracketHighlight.unexpectedBracket.foreground#bc808c
editorBracketMatch.background#323443
editorBracketMatch.border#323443
editorCodeLens.foreground#444658
editorCursor.background#22232e
editorCursor.foreground#9094b8
editorError.foreground#bc808c99
editorGroup.border#1e1f29
editorGroup.emptyBackground#22232e
editorGroup.focusedEmptyBorder#22232e
editorGroupHeader.border#22232e
editorGroupHeader.tabsBackground#1e1f29
editorGroupHeader.tabsBorder#22232e
editorGutter.addedBackground#9cb0a8
editorGutter.background#22232e
editorGutter.deletedBackground#bc808c
editorGutter.foldingControlForeground#666778
editorGutter.modifiedBackground#d6b4af
editorHint.foreground#7993ae
editorHoverWidget.background#1e1f29
editorHoverWidget.border#1e1f29
editorHoverWidget.foreground#696b87
editorHoverWidget.highlightForeground#9094b8
editorHoverWidget.statusBarBackground#1e1f29
editorIndentGuide.activeBackground#323443
editorIndentGuide.background#2a2b38
editorInfo.foreground#7993ae
editorInlayHint.background#22232e
editorInlayHint.foreground#6a6c7e
editorLightBulb.foreground#d6b4af
editorLightBulbAutoFix.foreground#d6b4af
editorLineNumber.activeForeground#e6e7f6
editorLineNumber.foreground#646681
editorLink.activeForeground#c3c5dd
editorOverviewRuler.addedForeground#9cb0a8
editorOverviewRuler.background#22232e
editorOverviewRuler.border#22232e
editorOverviewRuler.deletedForeground#bc808c99
editorOverviewRuler.errorForeground#bc808c
editorOverviewRuler.warningForeground#d6b4af
editorPane.background#22232e
editorRuler.foreground#2a2b38
editorSuggestWidget.background#1e1f29
editorSuggestWidget.border#1e1f29
editorSuggestWidget.focusHighlightForeground#9094b8
editorSuggestWidget.foreground#696b87
editorSuggestWidget.highlightForeground#9094b8
editorSuggestWidget.selectedBackground#22232e
editorSuggestWidget.selectedForeground#9094b8
editorSuggestWidget.selectedIconForeground#90aecd
editorSuggestWidgetStatus.foreground#9094b8
editorUnnecessaryCode.border#44465833
editorUnnecessaryCode.opacity#00000099
editorWarning.foreground#d6b4af
editorWhitespace.foreground#2e303d
editorWidget.background#1e1f29
editorWidget.border#1e1f29
editorWidget.foreground#b7bad7
editorWidget.resizeBorder#444658
errorForeground#bc808c
focusBorder#1e1f29
foreground#696b87
gitDecoration.addedResourceForeground#9cb0a8
gitDecoration.conflictingResourceForeground#bc808c
gitDecoration.deletedResourceForeground#bc808c
gitDecoration.ignoredResourceForeground#444658
gitDecoration.modifiedResourceForeground#d6b4af
gitDecoration.renamedResourceForeground#b7bad7
gitDecoration.stageDeletedResourceForeground#bc808c
gitDecoration.stageModifiedResourceForeground#d6b4af
gitDecoration.untrackedResourceForeground#90aecd
icon.foreground#b7bad7
input.background#2a2b38
input.border#2a2b38
input.foreground#b7bad7
input.placeholderForeground#666778
inputOption.activeBackground#323443
inputOption.activeBorder#00000000
inputOption.activeForeground#bc808c
inputOption.hoverBackground#323443
inputValidation.errorBackground#c98996
inputValidation.errorBorder#c98996
inputValidation.errorForeground#000000
keybindingLabel.background#444658
keybindingLabel.border#1e1f29
keybindingLabel.bottomBorder#1a1b24
list.activeSelectionBackground#364351
list.activeSelectionForeground#9dbfe1
list.dropBackground#2a2b38
list.errorForeground#bc808c
list.filterMatchBackground#2a2b38
list.filterMatchBorder#2a2b38
list.focusBackground#2a2b38
list.focusForeground#9094b8
list.focusOutline#0000
list.highlightForeground#90aecd
list.hoverBackground#2a2b38
list.hoverForeground#9094b8
list.inactiveFocusBackground#262733
list.inactiveSelectionBackground#2a2b38
list.inactiveSelectionForeground#9094b8
list.inactiveSelectionIconForeground#9094b8
list.warningForeground#d6b4af
notificationCenter.border#00000000
notificationCenterHeader.background#1e1f29
notifications.background#1e1f29
notifications.border#00000000
notificationToast.border#00000000
panel.background#22232e
panel.border#22232e
panel.dropBorder#1e1f29
panelTitle.activeBorder#22232e
panelTitle.activeForeground#b7bad7
panelTitle.inactiveForeground#646681
peekView.border#1e1f29
peekViewEditor.background#1e1f29
peekViewEditor.matchHighlightBackground#262733
peekViewEditor.matchHighlightBorder#262733
peekViewEditorGutter.background#1e1f29
peekViewResult.background#1e1f29
peekViewResult.fileForeground#b7bad7
peekViewResult.lineForeground#696b87
peekViewResult.matchHighlightBackground#262733
peekViewResult.selectionBackground#262733
peekViewResult.selectionForeground#696b87
peekViewTitle.background#1e1f29
peekViewTitleDescription.foreground#696b87
peekViewTitleLabel.foreground#9094b8
pickerGroup.border#1e1f29
pickerGroup.foreground#7993ae
progressBar.background#90aecd
quickInput.background#1e1f29
quickInput.foreground#b7bad7
quickInputList.focusBackground#262733
quickInputList.focusForeground#e6e7f6
quickInputList.focusIconForeground#90aecd
quickInputTitle.background#262733
scrollbar.shadow#0000
scrollbarSlider.activeBackground#2a2b38
scrollbarSlider.background#2a2b38
scrollbarSlider.hoverBackground#2a2b38
settings.focusedRowBackground#1e1f29
settings.modifiedItemIndicator#90aecd
settings.rowHoverBackground#1e1f29
sideBar.background#1e1f29
sideBar.border#1e1f29
sideBar.dropBackground#2a2b38
sideBar.foreground#9094b8
sideBarSectionHeader.background#1e1f29
sideBarSectionHeader.border#1e1f29
sideBarSectionHeader.foreground#9094b8
sideBarTitle.foreground#90aecd
statusBar.background#1e1f29
statusBar.border#1e1f29
statusBar.debuggingBackground#1e1f29
statusBar.debuggingBorder#00000000
statusBar.debuggingForeground#6a6c7e
statusBar.focusBorder#90aecd
statusBar.foreground#646681
statusBar.noFolderBackground#1e1f29
statusBar.noFolderBorder#1e1f29
statusBar.noFolderForeground#6a6c7e
statusBarItem.activeBackground#22232e
statusBarItem.hoverBackground#262733
statusBarItem.remoteBackground#1e1f29
statusBarItem.remoteForeground#b7bad7
symbolIcon.arrayForeground#6a6c7e
symbolIcon.booleanForeground#6a6c7e
symbolIcon.classForeground#6a6c7e
symbolIcon.colorForeground#6a6c7e
symbolIcon.constantForeground#6a6c7e
symbolIcon.constructorForeground#6a6c7e
symbolIcon.enumeratorForeground#6a6c7e
symbolIcon.enumeratorMemberForeground#6a6c7e
symbolIcon.eventForeground#6a6c7e
symbolIcon.fieldForeground#6a6c7e
symbolIcon.fileForeground#6a6c7e
symbolIcon.folderForeground#6a6c7e
symbolIcon.functionForeground#6a6c7e
symbolIcon.interfaceForeground#6a6c7e
symbolIcon.keyForeground#6a6c7e
symbolIcon.keywordForeground#6a6c7e
symbolIcon.methodForeground#6a6c7e
symbolIcon.moduleForeground#6a6c7e
symbolIcon.namespaceForeground#6a6c7e
symbolIcon.nullForeground#6a6c7e
symbolIcon.numberForeground#6a6c7e
symbolIcon.objectForeground#6a6c7e
symbolIcon.operatorForeground#6a6c7e
symbolIcon.packageForeground#6a6c7e
symbolIcon.propertyForeground#6a6c7e
symbolIcon.referenceForeground#6a6c7e
symbolIcon.snippetForeground#6a6c7e
symbolIcon.stringForeground#6a6c7e
symbolIcon.structForeground#6a6c7e
symbolIcon.textForeground#6a6c7e
symbolIcon.typeParameterForeground#6a6c7e
symbolIcon.unitForeground#6a6c7e
symbolIcon.variableForeground#6a6c7e
tab.activeBackground#22232e
tab.activeBorder#22232e
tab.activeBorderTop#22232e
tab.activeForeground#b7bad7
tab.border#1e1f29
tab.hoverBackground#2a2b38
tab.hoverBorder#1e1f29
tab.hoverForeground#b7bad7
tab.inactiveBackground#1e1f29
tab.inactiveForeground#b7bad7
terminal.ansiBlack#696b87
terminal.ansiBlue#5b7a97
terminal.ansiBrightBlack#bbbee7
terminal.ansiBrightBlue#6396c0
terminal.ansiBrightCyan#76b1e2
terminal.ansiBrightGreen#77b8a1
terminal.ansiBrightMagenta#ac7fc7
terminal.ansiBrightRed#ce7789
terminal.ansiBrightWhite#e6e7f6
terminal.ansiBrightYellow#edaba2
terminal.ansiCyan#6f94b7
terminal.ansiGreen#75988b
terminal.ansiMagenta#8a6b9d
terminal.ansiRed#a36572
terminal.ansiWhite#b7bad7
terminal.ansiYellow#c29690
terminal.background#22232e
terminal.border#22232e
terminal.findMatchBackground#2a2b38
terminal.findMatchHighlightBackground#2a2b38
terminal.foreground#e6e7f6
terminal.selectionBackground#2e303d
terminal.tab.activeBorder#90aecd
terminalCursor.background#b7bad7
terminalCursor.foreground#b7bad7
textBlockQuote.background#262733
textBlockQuote.border#90aecd
textCodeBlock.background#2a2b38
textLink.activeForeground#e7e8f1
textLink.foreground#c3c5dd
textPreformat.foreground#c3c5dd
titleBar.activeBackground#1e1f29
titleBar.activeForeground#b7bad7
titleBar.border#1e1f29
titleBar.inactiveBackground#1e1f29
titleBar.inactiveForeground#b7bad7
toolbar.activeBackground#22232e
toolbar.hoverBackground#22232e
toolbar.hoverOutline#22232e
tree.indentGuidesStroke#2a2b38
tree.tableOddRowsBackground#262733
widget.shadow#00000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, string.comment, comment.block, punctuation.definition.comment	#5c5d6d	—
comment	—	italic
constant.numeric	#bc808c	—
constant.language	#90aecd	—
constant.other	#b7bad7	—
storage.modifier	#7993ae	—
punctuation.definition.parameters, punctuation.definition.arguments, punctuation.definition.begin, punctuation.definition.end, punctuation.terminator, punctuation.section, punctuation.definition.storage-type, meta.brace, keyword.operator, keyword.operator.type.annotation	#797b8f	—
keyword.operator.ternary, keyword.operator.null-coalescing	#a286b5	—
variable	#b7bad7	—
variable.other.property	#e6e7f6	—
string.quoted	#d6b4af	italic
entity.name.type.class, entity.other.inherited-class	#90aecd	—
meta.method-call, support.function	#dbdce9	—
keyword.other.type, support.type.primitive	#90aecd	—
keyword.control	#7993ae	—
keyword.operator.logical	#a286b5	—
meta.decorator	#d6b4af	—
keyword.other.new, keyword.operator.new, entity.name.tag	#7993ae	—
string.regexp	#84948e	—
punctuation.definition.variable.php	#6a6c7e	—
keyword.operator.type	#a286b5	—
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php	#63798f	—
keyword.other.use.php, storage.type.function.php, storage.type.class.php	#7993ae	—
meta.function.parameter.typehinted.php	#90aecd	—
meta.class.body.php, support.class.php, support.class.builtin.php, entity.other.alias.php, storage.type.php	#90aecd	—
meta.attribute.php	#a286b5	—
keyword.operator.nullable-type.php	#b0c9e4	—
meta.attribute.php entity.name.variable.parameter.php, meta.attribute.php support.other.namespace.php, meta.attribute.php keyword.other.class, entity.name.goto-label.php, meta.class.php, meta.method-call.php constant.other.php	#797b8f	—
meta.attribute.php support.attribute.php, meta.other.type.phpdoc.php support.class.php, meta.other.type.phpdoc.php support.class.builtin.php, meta.other.type.phpdoc.php keyword.other.type.php	#797b8f	—
support.other.namespace.php, keyword.other.class.php	#b7bad7	—
entity.name.function.php	#dbdce9	—
meta.method-call.php constant.other.php, meta.attribute.php entity.name.variable.parameter.php, entity.name.goto-label.php	—	italic
storage.type.js, storage.type.interface.js, storage.type.class.js	#7993ae	—
support.type.object.module.js	#7993ae	—
keyword.operator.new.js	#7993ae	—
keyword.operator.new.ts	#7993ae	—
entity.name.type.alias.ts, entity.name.type.enum.ts, entity.name.type.ts	#90aecd	—
storage.type.ts, keyword.operator.expression, storage.type.interface.ts, storage.type.class.ts	#7993ae	—
storage.type.tsx	#7993ae	—
entity.name.tag.tsx	#90aecd	—
entity.name.type, support.type.primitive	#90aecd	—
string.quoted.single.tsx, string.quoted.double.tsx	—
entity.other.attribute-name.tsx	#b7bad7	—
string.quoted.double.html, string.quoted.single.html	#e6e7f6
keyword.other.special-method.dockerfile	#90aecd	—
entity.name.section.group-title.ini	#90aecd	—
entity.name.tag.yaml	#7993ae	—
string.unquoted.plain.out.yaml	#b7bad7	—
entity.name.function.target.makefile	#90aecd	—
variable.other.env	#7993ae	—
entity.name.function.just	#7993ae	—
entity.other.attribute-name.class.css, entity.other.attribute-name.id.css	#7993ae	—
punctuation.definition.heading.markdown	#90aecd	—
entity.name.section.markdown	#90aecd	—
markup.underline.link.markdown	#d6b4af	—
markup.heading.marker.asciidoc	#90aecd	—
markup.heading.heading-0.asciidoc, markup.heading.heading-1.asciidoc, markup.heading.heading-2.asciidoc, markup.heading.heading-3.asciidoc, markup.heading.heading-4.asciidoc, markup.heading.heading-5.asciidoc	#90aecd	—
markup.list.bullet.asciidoc	#6a6c7e	—
markup.link.asciidoc	#d6b4af	—
entity.name.function.asciidoc	#7993ae	—
punctuation.section.tag.twig	#63798f	—
keyword.operator.logical.twig	#a286b5	—
meta.function-call.other.twig	#e6e7f6	—
meta.function-call.twig	#e6e7f6	—

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