BittBott

Name: BittBott
Author: bittbott

Publisher: bittbottThemes in package: 1

A warm, autumn-toned dark theme with first-class token coverage for TypeScript/JSX, CSS/SCSS, Python, and config formats.

Open in VS Code GitHub

VS Code preview

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

BittBott — BittBott Autumn

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
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}!`;
}

Problems1

Output

Debug Console

Terminal

Ports

~/my-project $ pnpm dev
▲ Next.js ready on http://localhost:3000
✓ compiled client and server successfully in 412ms
wait - compiling /theme/vscode...
~/my-project $

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Dark+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBorder#fe8019
activityBar.background#1c1613
activityBar.border#3c322b
activityBar.foreground#ebdbb2
activityBar.inactiveForeground#a89984
activityBarBadge.background#d65d0e
activityBarBadge.foreground#fbf1c7
badge.background#d65d0e
badge.foreground#fbf1c7
breadcrumb.activeSelectionForeground#fe8019
breadcrumb.background#1c1613
breadcrumb.focusForeground#d5c4a1
breadcrumb.foreground#a89984
button.background#d65d0e
button.foreground#fbf1c7
button.hoverBackground#fe8019
button.secondaryBackground#50423a
button.secondaryForeground#ebdbb2
button.secondaryHoverBackground#665549
chat.avatarBackground#3c322b
chat.avatarForeground#fe8019
chat.checkpointSeparator#50423a
chat.editedFileForeground#85ad8c
chat.linesAddedForeground#a3a84f
chat.linesRemovedForeground#fb4934
chat.requestBackground#28201a80
chat.requestBorder#3c322b
chat.requestBubbleBackground#d65d0e1a
chat.requestBubbleHoverBackground#d65d0e2a
chat.requestCodeBorder#50423a
chat.slashCommandBackground#fe801920
chat.slashCommandForeground#fe8019
chat.thinkingShimmer#fe801930
commandCenter.activeBackground#3c322b
commandCenter.activeBorder#fe801980
commandCenter.activeForeground#fbf1c7
commandCenter.background#1c1613
commandCenter.border#3c322b
commandCenter.debuggingBackground#d65d0e40
commandCenter.foreground#d5c4a1
commandCenter.inactiveBorder#3c322b
commandCenter.inactiveForeground#a89984
debugIcon.breakpointForeground#fb4934
debugToolBar.background#28201a
descriptionForeground#a89984
diffEditor.insertedLineBackground#a3a84f10
diffEditor.insertedTextBackground#a3a84f20
diffEditor.removedLineBackground#fb493410
diffEditor.removedTextBackground#fb493420
dropdown.background#28201a
dropdown.border#50423a
dropdown.foreground#ebdbb2
editor.background#1c1613
editor.findMatchBackground#c9962e50
editor.findMatchHighlightBackground#c9962e30
editor.foreground#ebdbb2
editor.hoverHighlightBackground#50423a60
editor.inactiveSelectionBackground#50423a80
editor.lineHighlightBackground#3c322b60
editor.selectionBackground#50423a
editor.selectionHighlightBackground#85ad8c20
editor.wordHighlightBackground#78a3bf20
editor.wordHighlightStrongBackground#78a3bf30
editorBracketHighlight.foreground1#fe8019
editorBracketHighlight.foreground2#e6b450
editorBracketHighlight.foreground3#85ad8c
editorBracketHighlight.foreground4#d3869b
editorBracketHighlight.foreground5#78a3bf
editorBracketHighlight.foreground6#a3a84f
editorBracketMatch.background#85ad8c30
editorBracketMatch.border#5f9172
editorCodeLens.foreground#a89984
editorCursor.foreground#ebdbb2
editorError.foreground#fb4934
editorGroup.border#3c322b
editorGroupHeader.noTabsBackground#1c1613
editorGroupHeader.tabsBackground#28201a
editorGutter.addedBackground#7f8b38
editorGutter.deletedBackground#cc241d
editorGutter.modifiedBackground#5f9172
editorHint.foreground#85ad8c
editorHoverWidget.background#28201a
editorHoverWidget.border#50423a
editorIndentGuide.activeBackground1#665549
editorIndentGuide.background1#3c322b
editorInfo.foreground#78a3bf
editorInlayHint.background#3c322b80
editorInlayHint.foreground#a89984
editorLineNumber.activeForeground#bdae93
editorLineNumber.foreground#665549
editorLink.activeForeground#78a3bf
editorOverviewRuler.border#3c322b
editorRuler.foreground#3c322b
editorStickyScroll.background#1c1613
editorStickyScroll.shadow#1c161380
editorStickyScrollHover.background#28201a
editorSuggestWidget.background#28201a
editorSuggestWidget.border#50423a
editorSuggestWidget.foreground#ebdbb2
editorSuggestWidget.highlightForeground#fe8019
editorSuggestWidget.selectedBackground#3c322b
editorWarning.foreground#e6b450
editorWhitespace.foreground#50423a
editorWidget.background#28201a
editorWidget.border#50423a
errorForeground#fb4934
focusBorder#fe8019
foreground#ebdbb2
gitDecoration.addedResourceForeground#a3a84f
gitDecoration.conflictingResourceForeground#fe8019
gitDecoration.deletedResourceForeground#fb4934
gitDecoration.ignoredResourceForeground#665549
gitDecoration.modifiedResourceForeground#85ad8c
gitDecoration.untrackedResourceForeground#7f8b38
icon.foreground#bdae93
inlineChat.background#28201a
inlineChat.border#50423a
inlineChat.foreground#ebdbb2
inlineChat.shadow#1c161380
inlineChatDiff.inserted#a3a84f20
inlineChatDiff.removed#fb493420
inlineChatInput.background#28201a
inlineChatInput.border#50423a
inlineChatInput.focusBorder#fe8019
inlineChatInput.placeholderForeground#a89984
input.background#28201a
input.border#50423a
input.foreground#ebdbb2
input.placeholderForeground#a89984
inputOption.activeBackground#fe801930
inputOption.activeBorder#fe8019
inputValidation.errorBackground#28201a
inputValidation.errorBorder#fb4934
list.activeSelectionBackground#3c322b
list.activeSelectionForeground#fbf1c7
list.errorForeground#fb4934
list.focusBackground#3c322b
list.highlightForeground#fe8019
list.hoverBackground#28201a
list.inactiveSelectionBackground#28201a
list.inactiveSelectionForeground#d5c4a1
list.warningForeground#e6b450
menu.background#28201a
menu.foreground#ebdbb2
menu.selectionBackground#3c322b
menu.selectionForeground#fbf1c7
menu.separatorBackground#50423a
merge.currentContentBackground#85ad8c20
merge.currentHeaderBackground#85ad8c40
merge.incomingContentBackground#78a3bf20
merge.incomingHeaderBackground#78a3bf40
minimap.background#1c1613
minimap.chatEditHighlight#85ad8c60
minimap.errorHighlight#fb4934
minimap.findMatchHighlight#c9962e80
minimap.infoHighlight#78a3bf
minimap.selectionHighlight#fe801960
minimap.selectionOccurrenceHighlight#85ad8c60
minimap.warningHighlight#e6b450
minimapSlider.activeBackground#66554950
minimapSlider.background#66554930
minimapSlider.hoverBackground#66554940
notificationCenterHeader.background#3c322b
notificationLink.foreground#78a3bf
notifications.background#28201a
notifications.foreground#ebdbb2
notificationsErrorIcon.foreground#fb4934
notificationsInfoIcon.foreground#78a3bf
notificationsWarningIcon.foreground#e6b450
panel.background#1c1613
panel.border#3c322b
panelStickyScroll.background#1c1613
panelTitle.activeBorder#fe8019
panelTitle.activeForeground#ebdbb2
panelTitle.inactiveForeground#a89984
peekView.border#fe8019
peekViewEditor.background#28201a
peekViewResult.background#28201a
peekViewResult.matchHighlightBackground#c9962e30
peekViewTitle.background#3c322b
pickerGroup.border#50423a
pickerGroup.foreground#fe8019
problemsErrorIcon.foreground#fb4934
problemsInfoIcon.foreground#78a3bf
problemsWarningIcon.foreground#e6b450
progressBar.background#fe8019
quickInput.background#28201a
quickInput.foreground#ebdbb2
quickInputList.focusBackground#3c322b
quickInputList.focusForeground#fbf1c7
quickInputList.focusIconForeground#fe8019
quickInputTitle.background#3c322b
scrollbar.shadow#1c161380
scrollbarSlider.activeBackground#665549a0
scrollbarSlider.background#66554960
scrollbarSlider.hoverBackground#66554980
selection.background#fe801940
sideBar.background#28201a
sideBar.border#3c322b
sideBar.foreground#d5c4a1
sideBarSectionHeader.background#28201a
sideBarSectionHeader.foreground#bdae93
sideBarStickyScroll.background#28201a
sideBarStickyScroll.shadow#1c161380
sideBarTitle.foreground#bdae93
statusBar.background#28201a
statusBar.border#3c322b
statusBar.debuggingBackground#d65d0e
statusBar.debuggingForeground#fbf1c7
statusBar.foreground#d5c4a1
statusBar.noFolderBackground#28201a
statusBarItem.remoteBackground#5f9172
statusBarItem.remoteForeground#fbf1c7
tab.activeBackground#1c1613
tab.activeBorderTop#fe8019
tab.activeForeground#ebdbb2
tab.border#3c322b
tab.hoverBackground#1c1613
tab.inactiveBackground#28201a
tab.inactiveForeground#a89984
terminal.ansiBlack#28201a
terminal.ansiBlue#45789e
terminal.ansiBrightBlack#8d7e6b
terminal.ansiBrightBlue#78a3bf
terminal.ansiBrightCyan#85ad8c
terminal.ansiBrightGreen#a3a84f
terminal.ansiBrightMagenta#d3869b
terminal.ansiBrightRed#fb4934
terminal.ansiBrightWhite#ebdbb2
terminal.ansiBrightYellow#e6b450
terminal.ansiCyan#5f9172
terminal.ansiGreen#7f8b38
terminal.ansiMagenta#b16286
terminal.ansiRed#cc241d
terminal.ansiWhite#a89984
terminal.ansiYellow#c9962e
terminal.background#1c1613
terminal.foreground#ebdbb2
terminal.selectionBackground#50423a80
terminalCursor.foreground#ebdbb2
terminalStickyScroll.background#1c1613
terminalStickyScrollHover.background#28201a
textBlockQuote.background#28201a
textLink.activeForeground#85ad8c
textLink.foreground#78a3bf
textPreformat.foreground#85ad8c
titleBar.activeBackground#1c1613
titleBar.activeForeground#d5c4a1
titleBar.border#3c322b
titleBar.inactiveBackground#1c1613
titleBar.inactiveForeground#a89984
tree.indentGuidesStroke#50423a
widget.shadow#1c161380

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#8d7e6b	italic
string, string.quoted, string.template	#e39b57	—
constant.character.escape, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end	#d5643c	—
string.regexp	#d5643c	—
constant.numeric	#fe8019	—
constant.language	#d3869b	—
constant.language.boolean.true	#4ade80	bold
constant.language.boolean.false	#ff4d4d	bold
constant.language.boolean, constant.language.bool, constant.language.json	#4ade80	bold
constant.other, variable.other.enummember, support.constant	#d3869b	—
keyword, keyword.control	#d5643c	—
storage, storage.type, storage.modifier	#d5643c	—
keyword.operator	#fe8019	—
entity.name.function, support.function, meta.function-call entity.name.function	#e6b450	—
entity.name.type, entity.name.class, entity.other.inherited-class, support.class, support.type	#5f9172	bold
support.type.primitive, keyword.type	#5f9172	—
variable, meta.definition.variable.name	#ebdbb2	—
variable.parameter	#d5c4a1	italic
variable.language	#d3869b	italic
variable.other.property, variable.other.object.property, support.variable.property, meta.object-literal.key	#78a3bf	—
punctuation, meta.brace	#bdae93	—
entity.name.tag	#78a3bf	—
punctuation.definition.tag	#bdae93	—
entity.other.attribute-name	#a3a84f	italic
invalid, invalid.illegal	#fb4934	—
meta.decorator, punctuation.decorator, meta.decorator entity.name.function	#fe8019	—
support.class.component	#e6b450	—
support.type.property-name.css	#78a3bf	—
support.constant.property-value.css	#ebdbb2	—
keyword.other.unit	#fe8019	—
entity.other.attribute-name.class.css	#e6b450	—
entity.other.attribute-name.id.css	#fe8019	—
entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css	#5f9172	—
constant.other.color	#d3869b	—
variable.scss, variable.sass	#cc241d	—
support.function.misc.scss, support.function.scss	#e6b450	—
string.quoted.docstring	#7f8b38	italic
constant.character.format.placeholder, punctuation.definition.interpolation	#d5643c	—
entity.name.function.decorator.python, meta.function.decorator.python punctuation.definition.decorator.python	#fe8019	—
support.function.magic.python, support.variable.magic.python	#e6b450	italic
markup.heading, entity.name.section.markdown, punctuation.definition.heading.markdown	#fe8019	bold
markup.bold	#fbf1c7	bold
markup.italic	—	italic
markup.inline.raw, markup.fenced_code.block	#85ad8c	—
markup.underline.link, string.other.link.title.markdown, string.other.link.description	#78a3bf	—
markup.quote	#8d7e6b	italic
punctuation.definition.list.begin.markdown	#fe8019	—
entity.name.tag.yaml	#85ad8c	—
entity.name.type.anchor.yaml, variable.other.alias.yaml, punctuation.definition.anchor.yaml, punctuation.definition.alias.yaml	#d3869b	—
support.type.property-name.toml	#85ad8c	—
source.json meta.structure.dictionary.json support.type.property-name.json	#e6b450	—
source.json meta.structure.dictionary.json meta.structure.dictionary.json support.type.property-name.json	#45789e	—
source.json meta.structure.dictionary.json meta.structure.dictionary.json meta.structure.dictionary.json support.type.property-name.json	#fe8019	—