re:Theme

Name: re:Theme
Author: Cydo

Publisher: CydoThemes in package: 8

A collection of reimagined themes that I like, but felt are not completed. re:Themes is my way of bringing a form of completion to those themes while also adding my own flare to them.

Open in VS Code GitHub

Color themes

VS Code preview

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

re:Theme — re:Platinum

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

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.activeBackground#8f8f8f10
activityBar.activeBorder#8f8f8f
activityBar.background#0e0e0e
activityBar.border#050505
activityBar.foreground#8f8f8f
activityBar.inactiveForeground#545454AA
activityBarBadge.background#8f8f8f
activityBarBadge.foreground#0e0e0e
badge.background#8f8f8f
badge.foreground#141414
breadcrumb.background#141414
breadcrumbPicker.background#141414
button.background#8f8f8f75
button.border#8f8f8f75
button.foreground#c7c7c7
button.hoverBackground#8f8f8f90
button.secondaryBackground#8f8f8f20
button.secondaryForeground#c7c7c7
button.secondaryHoverBackground#8f8f8f35
charts.blue#78dce8
charts.foreground#c7c7c7
charts.green#a9dc76
charts.lines#c7c7c7
charts.orange#fc9867
charts.purple#e991e3
charts.red#fc6a67
charts.yellow#ffd866
checkbox.foreground#c7c7c7
commandCenter.activeBackground#21212160
commandCenter.activeForeground#adadad90
commandCenter.background#141414
commandCenter.border#050505
commandCenter.foreground#545454
contrastActiveBorder#00000000
contrastBorder#00000000
debugExceptionWidget.background#212121
debugExceptionWidget.border#050505
debugToolBar.background#212121
descriptionForeground#c7c7c7
diffEditor.border#050505
diffEditor.diagonalFill#05050580
diffEditor.insertedLineBackground#a9dc7620
diffEditor.insertedTextBackground#a9dc7620
diffEditor.insertedTextBorder#00000000
diffEditor.removedLineBackground#fc6a6725
diffEditor.removedTextBackground#fc6a6725
diffEditor.removedTextBorder#00000000
diffEditorGutter.insertedLineBackground#00000000
diffEditorGutter.removedLineBackground#00000000
diffEditorOverview.insertedForeground#a9dc7625
diffEditorOverview.removedForeground#fc6a6730
disabledForeground#6e6e6e
dropdown.background#141414
dropdown.border#54545450
dropdown.foreground#c7c7c7
dropdown.listBackground#141414
editor.background#141414
editor.findMatchBackground#8f8f8f20
editor.findMatchBorder#8f8f8f60
editor.findMatchHighlightBackground#8f8f8f20
editor.findMatchHighlightBorder#8f8f8f40
editor.foldBackground#0e0e0e
editor.foreground#c7c7c7
editor.hoverHighlightBackground#8f8f8f40
editor.inactiveSelectionBackground#8f8f8f20
editor.lineHighlightBackground#8f8f8f0c
editor.lineHighlightBorder#8f8f8f1a
editor.rangeHighlightBackground#8f8f8f20
editor.selectionBackground#8f8f8f30
editor.selectionForeground#c7c7c7
editor.selectionHighlightBackground#8f8f8f15
editor.selectionHighlightBorder#8f8f8f80
editor.wordHighlightBackground#8f8f8f20
editor.wordHighlightStrongBackground#8f8f8f40
editorBracketHighlight.foreground1#ffd866
editorBracketHighlight.foreground2#e991e3
editorBracketHighlight.foreground3#78dce8
editorBracketHighlight.foreground4#ab9df2
editorBracketHighlight.foreground5#78e8c6
editorBracketHighlight.foreground6#ff6188
editorBracketHighlight.unexpectedBracket.foreground#fc6a67
editorBracketMatch.background#8f8f8f20
editorBracketMatch.border#8f8f8f40
editorCodeLens.foreground#adadad80
editorCursor.background#8f8f8f
editorCursor.foreground#ffd866
editorError.border#00000000
editorError.foreground#fc6a67
editorGhostText.border#00000000
editorGhostText.foreground#c7c7c770
editorGroup.border#050505
editorGroup.dropBackground#8f8f8f15
editorGroupHeader.border#bb272700
editorGroupHeader.noTabsBackground#141414
editorGroupHeader.tabsBackground#0e0e0e
editorGroupHeader.tabsBorder#050505
editorGutter.addedBackground#a9dc76cc
editorGutter.background#141414
editorGutter.commentRangeForeground#212121
editorGutter.deletedBackground#fc6a67cc
editorGutter.modifiedBackground#78dce8cc
editorHoverWidget.background#212121
editorHoverWidget.border#050505
editorIndentGuide.activeBackground#545454bb
editorIndentGuide.background#54545430
editorInfo.border#00000000
editorInlayHint.background#adadad20
editorInlayHint.foreground#adadad90
editorInlayHint.typeBackground#ab9df230
editorInlayHint.typeForeground#ab9df2aa
editorLineNumber.activeForeground#545454
editorLineNumber.foreground#54545490
editorLink.activeForeground#c7c7c7
editorMarkerNavigation.background#0e0e0e
editorMarkerNavigationError.background#fc6a6790
editorMarkerNavigationInfo.background#78dce890
editorMarkerNavigationWarning.background#ffd86690
editorOverviewRuler.border#050505
editorOverviewRuler.commonContentForeground#ffd866
editorOverviewRuler.currentContentForeground#fc6a67
editorOverviewRuler.incomingContentForeground#a9dc76
editorRuler.foreground#54545433
editorSuggestWidget.background#141414
editorSuggestWidget.border#050505
editorSuggestWidget.foreground#adadad
editorSuggestWidget.highlightForeground#ffd866
editorSuggestWidget.selectedBackground#8f8f8f4d
editorWarning.border#00000000
editorWarning.foreground#ffd866
editorWhitespace.foreground#54545460
editorWidget.background#212121
editorWidget.resizeBorder#8f8f8f50
errorForeground#fc6a67
errorLens.errorForeground#fc6a6799
errorLens.hintForeground#78dce899
errorLens.infoForeground#78dce899
errorLens.warningForeground#ffd86699
extensionButton.background#8f8f8f60
extensionButton.foreground#c7c7c7
extensionButton.hoverBackground#8f8f8f90
extensionButton.prominentBackground#8f8f8f9d
extensionButton.prominentForeground#c7c7c7
extensionButton.prominentHoverBackground#8f8f8f
focusBorder#8f8f8f40
foreground#adadadAA
gitDecoration.conflictingResourceForeground#8f8f8f
gitDecoration.deletedResourceForeground#fc6a67
gitDecoration.ignoredResourceForeground#545454
gitDecoration.modifiedResourceForeground#78dce8
gitDecoration.untrackedResourceForeground#a9dc76
icon.foreground#adadadAA
input.background#00000000
input.border#54545460
input.foreground#c7c7c7
input.placeholderForeground#c7c7c760
inputOption.activeBorder#8f8f8f
inputValidation.errorBackground#212121
inputValidation.errorBorder#ffd866
inputValidation.infoBackground#212121
inputValidation.infoBorder#8f8f8f
inputValidation.warningBackground#212121
inputValidation.warningBorder#ffd866
keybindingLabel.background#212121
keybindingLabel.border#545454
keybindingLabel.bottomBorder#545454
keybindingLabel.foreground#878787
list.activeSelectionBackground#3b3b3b73
list.activeSelectionForeground#c7c7c7
list.dropBackground#8f8f8f15
list.errorForeground#fc6a67
list.focusBackground#8f8f8f40
list.focusForeground#adadad
list.highlightForeground#ffd866
list.hoverBackground#2e2e2e33
list.hoverForeground#d3d3d3
list.inactiveSelectionBackground#3b3b3b40
list.inactiveSelectionForeground#c7c7c7
list.warningForeground#ffd866
menu.background#212121
menu.border#050505
menu.foreground#a1a1a1
menu.selectionForeground#ededed
menu.separatorBackground#05050565
menubar.selectionBackground#212121
menubar.selectionForeground#adadad
merge.border#050505
merge.commonContentBackground#ffd86630
merge.commonHeaderBackground#ffd86680
merge.currentContentBackground#a9dc7630
merge.currentHeaderBackground#a9dc7680
merge.incomingContentBackground#78dce830
merge.incomingHeaderBackground#78dce880
notificationCenterHeader.background#212121
notificationCenterHeader.foreground#c7c7c7
notificationLink.foreground#ffd866
notifications.background#212121
notifications.border#050505
notifications.foreground#adadad
notificationsErrorIcon.foreground#fc6a67
notificationsInfoIcon.foreground#78dce8
notificationsWarningIcon.foreground#fc9867
panel.background#111111
panel.border#050505
panel.dropBorder#050505
panelSection.border#050505
panelSectionHeader.background#54545420
panelSectionHeader.border#050505
panelSectionHeader.foreground#c7c7c7
panelTitle.activeBorder#8f8f8f
panelTitle.activeForeground#8f8f8f
panelTitle.inactiveForeground#545454
peekView.border#8f8f8f
peekViewEditor.background#21212140
peekViewEditor.matchHighlightBackground#21212140
peekViewEditorGutter.background#21212140
peekViewResult.background#21212140
peekViewResult.fileForeground#c7c7c7
peekViewResult.lineForeground#c7c7c7
peekViewResult.matchHighlightBackground#212121
peekViewResult.selectionBackground#212121
peekViewResult.selectionForeground#c7c7c7
peekViewTitle.background#050505
peekViewTitleDescription.foreground#c7c7c7
peekViewTitleLabel.foreground#c7c7c7
pickerGroup.border#050505
pickerGroup.foreground#c7c7c7
profileBadge.background#8f8f8f
profileBadge.foreground#141414
progressBar.background#ffd866
quickInput.foreground#a1a1a1
quickInputList.focusBackground#47474773
quickInputList.focusForeground#ededed
quickInputTitle.background#0e0e0e
sash.hoverBorder#8f8f8f50
scrollbar.shadow#00000000
scrollbarSlider.activeBackground#8f8f8f40
scrollbarSlider.background#8f8f8f20
scrollbarSlider.hoverBackground#8f8f8f30
selection.background#8f8f8f60
settings.headerForeground#8f8f8f
settings.modifiedItemIndicator#8f8f8f
sideBar.background#0e0e0e
sideBar.border#050505
sideBar.foreground#adadadCC
sideBarSectionHeader.background#0e0e0e
sideBarSectionHeader.border#050505
sideBarSectionHeader.foreground#c7c7c7
sideBarTitle.foreground#545454
statusBar.background#0e0e0e
statusBar.border#050505
statusBar.debuggingBackground#8f8f8f44
statusBar.debuggingForeground#c7c7c7
statusBar.foreground#adadadBB
statusBar.noFolderBackground#0e0e0e
statusBar.noFolderBorder#050505
statusBar.noFolderForeground#adadadBB
statusBarItem.activeBackground#212121
statusBarItem.errorBackground#fc6a67
statusBarItem.hoverBackground#54545430
statusBarItem.prominentBackground#050505
statusBarItem.prominentHoverBackground#212121
statusBarItem.warningBackground#ffd866
tab.activeBackground#141414
tab.activeBorder#141414
tab.activeBorderTop#8f8f8f
tab.activeForeground#8f8f8f
tab.border#050505
tab.hoverBackground#141414cc
tab.inactiveBackground#0e0e0e
tab.inactiveForeground#545454
tab.lastPinnedBorder#050505
tab.unfocusedActiveForeground#c7c7c7
tab.unfocusedHoverBackground#8f8f8f10
tab.unfocusedHoverBorder#00000000
tab.unfocusedInactiveForeground#c7c7c7
terminal.ansiBlack#141414
terminal.ansiBlue#78dce8
terminal.ansiBrightBlack#78dce8
terminal.ansiBrightBlue#78dce8
terminal.ansiBrightCyan#78e8c6
terminal.ansiBrightGreen#a9dc76
terminal.ansiBrightMagenta#e991e3
terminal.ansiBrightRed#fc6a67
terminal.ansiBrightWhite#c7c7c7
terminal.ansiBrightYellow#ffd866
terminal.ansiCyan#78e8c6
terminal.ansiGreen#a9dc76
terminal.ansiMagenta#e991e3
terminal.ansiRed#fc6a67
terminal.ansiWhite#c7c7c7
terminal.ansiYellow#ffd866
terminal.background#111111
terminal.foreground#c7c7c7
terminal.selectionForeground#c7c7c7
terminalCursor.background#ffd866
terminalCursor.foreground#ffd866
textBlockQuote.background#78dce834
textBlockQuote.border#78dce8b9
textCodeBlock.background#78dce834
textLink.activeForeground#78dce8
textLink.foreground#78dce8
textPreformat.foreground#ffd866
textSeparator.foreground#8f8f8f
titleBar.activeBackground#0e0e0e
titleBar.activeForeground#545454
titleBar.border#050505
titleBar.inactiveBackground#050505
titleBar.inactiveForeground#545454
toolbar.hoverBackground#54545460
tree.indentGuidesStroke#54545470
walkThrough.embeddedEditorBackground#141414
welcomePage.progress.background#212121
welcomePage.progress.foreground#8f8f8f
welcomePage.tileBackground#adadad10
welcomePage.tileBorder#adadad20
welcomePage.tileHoverBackground#adadad20
widget.shadow#05050530

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#899397	italic
variable, string constant.other.placeholder	#d5d2d2	—
constant.other.color	#FFCB6B	—
invalid, invalid.illegal	#FF5370	italic strikethrough
keyword, storage.type, storage.modifier	#c180f7	—
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter	#7deabb	—
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method	#ffd262	—
meta.block variable.other	#6cdae7	—
support.other.variable, string.other.link	#f6c8cb	—
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other	#fd8585	—
string, constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js	#acff95	—
support.type, support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types	#fe926d	—
entity.name	#FFCB6B	—
support.type	#B2CCD6	—
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name	#B2CCD6	—
entity.name.module.js, variable.import.parameter.js, variable.other.class.js	#FF5370	—
variable.language	#FF5370	italic
entity.name.method.js	#82AAFF	italic
meta.class-method.js entity.name.function.js, variable.function.constructor	#82AAFF	—
entity.other.attribute-name	#ffd058	—
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name	#FFCB6B	italic
entity.other.attribute-name.class	#91d773	—
source.sass keyword.control	#4a79dd	—
markup.inserted	#C3E88D	—
markup.deleted	#FF5370	—
markup.changed	#ba74e9	—
string.regexp	#acff95	—
constant.character.escape	#89DDFF	—
url, link, uri	—	underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js	#82AAFF	italic
source.js constant.other.object.key.js string.unquoted.label.js	#FF5370	italic
source.json meta.structure.dictionary.json support.type.property-name.json	#fe926d	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#FFCB6B	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#FFCB6B	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#FFCB6B	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#FFCB6B	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#FFCB6B	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#FFCB6B	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#FFCB6B	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#FFCB6B	—
text.html.markdown, meta.paragraph.markdown	#d2d4d5	—
punctuation.definition.raw.markdown, markup.inline.raw.markdown, markup.inline.raw.string.markdown	#acff95	—
text.html.markdown markup.inline.raw.markdown	#C792EA	—
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown	#65737E	—
markdown.heading, markup.heading \| markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown	#fe926d	—
markup.italic	#7deabb	italic
markup.bold, markup.bold string	#7deabb	—
markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold string	#7deabb	—
markup.underline	#acff95	underline
markup.quote punctuation.definition.blockquote.markdown	#65737E	—
markup.quote	—	italic
string.other.link.title.markdown	#6cdae7	—
string.other.link.description.title.markdown	#c180f7	—
constant.other.reference.link.markdown	#FFCB6B	—
markup.raw.block	#C792EA	—
markup.raw.block.fenced.markdown	#00000050	—
punctuation.definition.fenced.markdown	#00000050	—
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end	#EEFFFF	—
variable.language.fenced.markdown	#65737E	—
meta.separator	#65737E	bold
markup.table	#EEFFFF	—
punctuation.definition.list.begin.markdown, punctuation.definition.link.title.begin.markdown, punctuation.definition.link.title.end.markdown	#c180f7	—
variable.css	#7deabb	—