Bersk Dark Theme

Name: Bersk Dark Theme
Author: Bersk Dark Theme for VS Code

Publisher: Bersk Dark Theme for VS CodeThemes in package: 1

(Gustavo J. Baierski) - Bersk's theme for VS Code!

Open in VS Code GitHub

VS Code preview

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

Bersk Dark Theme — Bersk

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#292D31
activityBar.foreground#ffffff
activityBarBadge.background#1BE7A3
activityBarBadge.foreground#1c1d1d
badge.background#1BE7A3
badge.foreground#1c1d1d
button.background#2e363a
button.foreground#ffffff
button.hoverBackground#1BE7A3
checkbox.border#ffffff
checkbox.foreground#1BE7A3
debugToolBar.background#1e1f1c
diffEditor.insertedLineBackground#116e4f8c
diffEditor.insertedTextBackground#19c28a8c
diffEditor.insertedTextBorder#2ab184
diffEditor.removedLineBackground#361d298a
diffEditor.removedTextBackground#8d1e557e
diffEditor.removedTextBorder#793c5a
diffEditorGutter.insertedLineBackground#1a946b8c
diffEditorGutter.removedLineBackground#4e22378a
dropdown.background#1c1d1d
dropdown.listBackground#1c1d1d
editor.background#1c1d1d
editor.findMatchBackground#1be7a38c
editor.findMatchHighlightBackground#ffffff42
editor.foreground#ffffff
editor.lineHighlightBackground#282b2c
editor.selectionBackground#30394680
editor.selectionHighlightBackground#2e363afb
editor.wordHighlightBackground#2e363afb
editor.wordHighlightStrongBackground#2e363afa
editorBracketHighlight.foreground1#c5c5c5
editorBracketHighlight.foreground2#c5c5c5
editorBracketHighlight.foreground3#c5a2fd
editorBracketHighlight.foreground4#b8f2fa
editorBracketHighlight.foreground5#c5c5c5
editorBracketHighlight.foreground6#c5c5c5
editorBracketMatch.background#292d3146
editorBracketMatch.border#cccccc
editorCursor.foreground#ffffff
editorGroup.border#34352f
editorGroup.dropBackground#1be7a38c
editorGroupHeader.tabsBackground#1c1d1d
editorGutter.addedBackground#1be7a38c
editorGutter.deletedBackground#FA4DA4
editorGutter.modifiedBackground#1BE7A3
editorHoverWidget.background#1c1d1d
editorHoverWidget.border#2e363a
editorIndentGuide.activeBackground1#777777
editorIndentGuide.background1#555555
editorLineNumber.activeForeground#1BE7A3
editorLineNumber.foreground#637479
editorLink.activeForeground#1BE7A3
editorOverviewRuler.addedForeground#1BE7A3
editorOverviewRuler.background#1c1d1d
editorOverviewRuler.deletedForeground#FA4DA4
editorOverviewRuler.errorForeground#FA4DA4
editorOverviewRuler.findMatchForeground#ccccccfa
editorOverviewRuler.infoForeground#23c1ff
editorOverviewRuler.modifiedForeground#FF7D4A
editorOverviewRuler.warningForeground#FF7D4A
editorSuggestWidget.background#1e1f1c
editorWhitespace.foreground#555555
editorWidget.background#1e1f1c
errorForeground#FA4DA4
focusBorder#00000000
gitDecoration.addedResourceForeground#1BE7A3
gitDecoration.conflictingResourceForeground#FA4DA4
gitDecoration.deletedResourceForeground#FA4DA4
gitDecoration.modifiedResourceForeground#FF7D4A
gitDecoration.renamedResourceForeground#FF7D4A
gitDecoration.stageDeletedResourceForeground#FA4DA4
gitlens.decorations.addedForegroundColor#1BE7A3
gitlens.trailingLineForegroundColor#aaaaaa
icon.foreground#ffffff
input.background#202223
inputOption.activeBorder#1e1f1c
inputValidation.errorBackground#612040
inputValidation.errorBorder#FA4DA4
inputValidation.infoBackground#28637a
inputValidation.infoBorder#23c1ff
inputValidation.warningBackground#a7502d
inputValidation.warningBorder#FF7D4A
keybindingLabel.background#2e363a
keybindingLabel.foreground#1BE7A3
list.activeSelectionBackground#1abb85c2
list.activeSelectionForeground#ffffff
list.dropBackground#1c1d1d
list.highlightForeground#1BE7A3
list.hoverBackground#2e363a
list.hoverForeground#ffffff
list.inactiveSelectionBackground#2e363a
menu.background#1c1d1d
menu.foreground#cccccc
merge.currentContentBackground#1be7a38c
merge.currentHeaderBackground#1be7a3f5
merge.incomingContentBackground#612040f5
merge.incomingHeaderBackground#fa4da3f6
minimap.background#1c1d1d
minimap.errorHighlight#FA4DA4
minimap.findMatchHighlight#ccccccf5
minimap.selectionHighlight#1be7a3f5
minimap.selectionOccurrenceHighlight#75bce0fa
minimap.warningHighlight#FF7D4A
notificationCenterHeader.background#1e1f1c
notificationCenterHeader.foreground#ffffff
notificationLink.foreground#1BE7A3
notifications.background#1e1f1c
notificationsErrorIcon.foreground#FA4DA4
notificationsInfoIcon.foreground#23c1ff
notificationsWarningIcon.foreground#FF7D4A
panel.border#2e363a
panelTitle.activeBorder#1BE7A3
panelTitle.activeForeground#1BE7A3
panelTitle.inactiveForeground#7c7c7c
peekView.border#1BE7A3
peekViewEditor.background#2e363a
peekViewEditor.matchHighlightBackground#555657
peekViewEditorGutter.background#1e1f1c
peekViewResult.background#1e1f1c
peekViewResult.fileForeground#ffffff
peekViewResult.matchHighlightBackground#cccccc
peekViewResult.selectionBackground#1BE7A3
peekViewTitle.background#1e1f1c
pickerGroup.foreground#ffffff
ports.iconRunningProcessForeground#cccccc
progressBar.background#1BE7A3
quickInputList.focusBackground#2e363a
selection.background#20b68496
settings.checkboxBorder#ffffff
settings.checkboxForeground#1BE7A3
settings.focusedRowBackground#2e363a
settings.modifiedItemIndicator#1BE7A3
settings.rowHoverBackground#1be7a38c
sideBar.background#1c1d1d
sideBar.border#2e363a
sideBarSectionHeader.background#292D31
statusBar.background#2e363a
statusBar.debuggingBackground#292D31
statusBar.foreground#ffffff
statusBar.noFolderBackground#292D31
statusBarItem.hoverBackground#1BE7A3
statusBarItem.remoteBackground#1BE7A3
tab.activeForeground#ffffff
tab.border#1e1f1c
tab.hoverForeground#ffffff
tab.inactiveBackground#292D31
tab.inactiveForeground#cccccc
tab.lastPinnedBorder#1e1f1c
terminal.ansiBlack#1e1f1c
terminal.ansiBlue#23c1ff
terminal.ansiBrightBlack#1e1f1c
terminal.ansiBrightBlue#23c1ff
terminal.ansiBrightCyan#1BE7A3
terminal.ansiBrightGreen#1BE7A3
terminal.ansiBrightMagenta#c5a2fd
terminal.ansiBrightRed#FA4DA4
terminal.ansiBrightWhite#ffffff
terminal.ansiBrightYellow#1BE7A3
terminal.ansiCyan#23c1ff
terminal.ansiGreen#1BE7A3
terminal.ansiMagenta#c5a2fd
terminal.ansiRed#FA4DA4
terminal.ansiWhite#ffffff
terminal.ansiYellow#1BE7A3
textLink.activeForeground#ffffff
textLink.foreground#1BE7A3
titleBar.activeBackground#2e363a
titleBar.activeForeground#ffffff
widget.border#00000000
widget.shadow#00000098

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
—	#cccccc	—
meta.embedded, source.groovy.embedded, string meta.image.inline.markdown	#F8F8F2	—
comment	#6e7883	—
string	#75bde0	—
punctuation.definition.template-expression, punctuation.section.embedded	#637479	bold
meta.template.expression	#F8F8F2	—
constant.numeric	#ffffff	—
constant.language	#FA4DA4	—
constant.character, constant.other	#c5a2fd	bold
variable	#ffffff	bold
keyword	#fa4da4	bold
storage	#fa4d9e	italic
storage.type	#32e0d2	italic
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution	#23c1ff	bold
entity.other.inherited-class	#1BE7A3	italic underline
entity.name.function	#1BE7A3
variable.parameter	#FF7D4A	italic bold
entity.name.tag	#fa4d9e	bold
entity.name.tag.css	#fa4d9e	italic bold
entity.other.attribute-name	#1BE7A3	bold
support.function	#32e0d2
support.constant	#76fff4
support.type, support.class	#5bd0ff	bold
invalid	#1BE7A3
invalid.deprecated	#fa4d9e	—
meta.structure.dictionary.json string.quoted.double.json	#CFCFC2	—
meta.diff, meta.diff.header	#75715E	—
markup.deleted	#fa4d9e	—
markup.inserted	#1BE7A3	—
markup.changed	#FF7D4A	—
constant.numeric.line-number.find-in-files - match	#AE81FFA0	—
entity.name.filename.find-in-files	#FF7D4A	—
markup.quote	#F92672	—
markup.list	#FF7D4A	—
markup.bold, markup.italic	#66D9EF	—
markup.inline.raw	#76fff4
markup.heading	#1BE7A3	—
markup.heading.setext	#2e9ae2	bold
markup.heading.markdown	—	bold
markup.quote.markdown	#75715E	italic
markup.bold.markdown	—	bold
string.other.link.title.markdown,string.other.link.description.markdown	#2e9ae2	—
markup.underline.link.markdown,markup.underline.link.image.markdown	#cccccc	—
markup.italic.markdown	—	italic
markup.strikethrough	—	strikethrough
markup.list.unnumbered.markdown, markup.list.numbered.markdown	#f8f8f2	—
punctuation.definition.list.begin.markdown	#A6E22E	—
token.info-token	#6796e6	—
token.warn-token	#FD971F	—
token.error-token	#f44747	—
token.debug-token	#b267e6	—
variable.language	#FF7D4A	—
entity.other.attribute-name.id.css	#FF7D4A	bold
support.function.misc.css	#1BE7A3	—
string.quoted.single.sql.php, string.quoted.double.sql.php, string.interpolated.php, string.quoted.single.php, string.quoted.double.php, string.template.js, string.quoted.single.js, string.quoted.double.js, string.quoted.other.backtick.sql, string.quoted.single.sql, string.quoted.double.sql	#ecc18f	—
constant.numeric.decimal.js	#c5a2fd	—
entity.other.attribute-name.pseudo-class.css	#76fff4	italic bold underline

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