Pink Pixel Enchanted Themes

Name: Pink Pixel Enchanted Themes
Author: Pink Pixel

Publisher: Pink PixelThemes in package: 12

Dark colorful themes and contrast-heavy editor looks for Visual Studio Code by Pink Pixel.

Open in VS Code GitHub

Color themes

VS Code preview

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

Pink Pixel Enchanted Themes — Pink Pixel Nightshade

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.activeBorder#8fdfff
activityBar.activeFocusBorder#d4f2ff
activityBar.background#0a110c
activityBar.border#6fe89a
activityBar.foreground#d4f2ff
activityBar.inactiveForeground#6d9177
activityBarBadge.background#8fdfff
activityBarBadge.foreground#062230
activityBarTop.activeBorder#8fdfff
activityBarTop.foreground#d4f2ff
badge.background#6fe89a
badge.foreground#062613
breadcrumb.activeSelectionForeground#8fdfff
breadcrumb.foreground#7fae90
button.background#8fdfff
button.foreground#062230
button.hoverBackground#a8e8ff
button.secondaryBackground#17332e
button.secondaryForeground#d8efe2
button.secondaryHoverBackground#1c4038
checkbox.background#0a110c
checkbox.border#6fe89a
checkbox.foreground#d8efe2
commandCenter.activeBackground#17332e
commandCenter.activeBorder#8fdfff
commandCenter.activeForeground#d4f2ff
commandCenter.background#080e0a
commandCenter.border#4fc3f0
commandCenter.foreground#b4d6c2
contrastActiveBorder#8fdfff
contrastBorder#6fe89a
debugToolBar.border#4fc3f0
descriptionForeground#7fae90
diffEditor.diagonalFill#255440
diffEditor.insertedLineBackground#1a8a5533
diffEditor.insertedTextBackground#22b06e55
diffEditor.removedLineBackground#8a2f3533
diffEditor.removedTextBackground#b03d4455
disabledForeground#5a7a63
dropdown.background#0a110c
dropdown.border#6fe89a
dropdown.foreground#d8efe2
editor.background#101a13
editor.findMatchBackground#5c7a2aAA
editor.findMatchBorder#b8e87a
editor.findMatchHighlightBackground#4d6a2366
editor.foreground#d8efe2
editor.inactiveSelectionBackground#1f5a7055
editor.lineHighlightBackground#15241a
editor.lineHighlightBorder#1c3024
editor.rangeHighlightBackground#2a6a8a2E
editor.selectionBackground#2a6a8aAA
editor.selectionHighlightBackground#3a83a444
editor.wordHighlightBackground#8fdfff26
editor.wordHighlightStrongBackground#6fe89a2B
editorBracketHighlight.foreground1#8fdfff
editorBracketHighlight.foreground2#6fe89a
editorBracketHighlight.foreground3#a8e8ff
editorBracketHighlight.foreground4#a8f5bd
editorBracketHighlight.foreground5#7fd8c4
editorBracketHighlight.foreground6#b8e87a
editorBracketHighlight.unexpectedBracket.foreground#ff8f8f
editorBracketMatch.background#8fdfff26
editorBracketMatch.border#8fdfff
editorCodeLens.foreground#6d9177
editorCursor.foreground#d4f2ff
editorError.foreground#ff8f8f
editorGroup.border#6fe89a
editorGroupHeader.tabsBackground#0a110c
editorGroupHeader.tabsBorder#6fe89a
editorGutter.addedBackground#3fd47f
editorGutter.deletedBackground#ff8f8f
editorGutter.modifiedBackground#8fdfff
editorHint.foreground#6fe89a
editorHoverWidget.border#4fc3f0
editorIndentGuide.activeBackground1#3d6b4e
editorIndentGuide.background1#1f3527
editorInfo.foreground#8fdfff
editorInlayHint.background#162b21
editorInlayHint.foreground#9cc4ad
editorLineNumber.activeForeground#d4f2ff
editorLineNumber.foreground#6d9177
editorLink.activeForeground#a8e8ff
editorRuler.foreground#1f3527
editorSuggestWidget.background#0c150f
editorSuggestWidget.border#4fc3f0
editorSuggestWidget.foreground#b4d6c2
editorSuggestWidget.highlightForeground#8fdfff
editorSuggestWidget.selectedBackground#17332e
editorWarning.foreground#b8e87a
editorWhitespace.foreground#25422f
editorWidget.background#0c150f
editorWidget.border#4fc3f0
editorWidget.foreground#d8efe2
errorForeground#ff8f8f
focusBorder#8fdfff
foreground#d8efe2
gitDecoration.addedResourceForeground#3fd47f
gitDecoration.conflictingResourceForeground#b8e87a
gitDecoration.deletedResourceForeground#ff8f8f
gitDecoration.ignoredResourceForeground#5a7a63
gitDecoration.modifiedResourceForeground#8fdfff
gitDecoration.renamedResourceForeground#7fd8c4
gitDecoration.untrackedResourceForeground#a8f5bd
icon.foreground#b4d6c2
input.background#0a110c
input.border#6fe89a
input.foreground#d8efe2
input.placeholderForeground#6d9177
inputOption.activeBackground#1c4038
inputOption.activeBorder#8fdfff
inputValidation.errorBackground#3a1c1c
inputValidation.errorBorder#ff8f8f
inputValidation.infoBackground#13303d
inputValidation.infoBorder#8fdfff
inputValidation.warningBackground#2c3318
inputValidation.warningBorder#b8e87a
list.activeSelectionBackground#17332e
list.activeSelectionForeground#d8efe2
list.focusBackground#1c4038
list.focusForeground#d8efe2
list.focusOutline#8fdfff
list.highlightForeground#8fdfff
list.hoverBackground#132318
list.hoverForeground#d8efe2
list.inactiveSelectionBackground#142b23
list.inactiveSelectionForeground#d8efe2
list.invalidItemForeground#ff8f8f
menu.background#0c150f
menu.border#4fc3f0
menu.foreground#d8efe2
menu.selectionBackground#17332e
menu.selectionForeground#d4f2ff
menu.separatorBackground#2a4a37
minimap.background#0c150f
minimap.errorHighlight#ff8f8f
minimap.findMatchHighlight#b8e87acb
minimap.selectionHighlight#3a83a4cd
minimap.warningHighlight#b8e87a
minimapGutter.addedBackground#3fd47f
minimapGutter.deletedBackground#ff8f8f
minimapGutter.modifiedBackground#8fdfff
notificationCenterHeader.background#0c150f
notificationLink.foreground#8fdfff
notifications.background#0c150f
notifications.border#4fc3f0
notifications.foreground#d8efe2
notificationToast.border#4fc3f0
panel.background#0b130d
panel.border#6fe89a
panelInput.border#6fe89a
panelTitle.activeBorder#8fdfff
panelTitle.activeForeground#d4f2ff
panelTitle.inactiveForeground#6d9177
peekView.border#4fc3f0
peekViewEditor.background#080e0a
peekViewEditor.matchHighlightBackground#4d6a2388
peekViewResult.background#0a110c
peekViewResult.selectionBackground#17332e
peekViewTitle.background#0c150f
pickerGroup.border#4fc3f0
pickerGroup.foreground#8fdfff
progressBar.background#8fdfff
quickInput.background#0c150f
quickInput.foreground#d8efe2
quickInputList.focusBackground#17332e
quickInputList.focusForeground#d4f2ff
scrollbar.shadow#040805
scrollbarSlider.activeBackground#3a83a499
scrollbarSlider.background#2a6a8a55
scrollbarSlider.hoverBackground#3a83a477
selection.background#2a6a8a66
settings.checkboxBorder#6fe89a
settings.dropdownBorder#6fe89a
settings.headerForeground#8fdfff
settings.modifiedItemIndicator#6fe89a
settings.textInputBorder#6fe89a
sideBar.background#0c150f
sideBar.border#6fe89a
sideBar.foreground#b4d6c2
sideBarActivityBarTop.border#6fe89a
sideBarSectionHeader.background#080e0a
sideBarSectionHeader.border#6fe89a
sideBarSectionHeader.foreground#6fe89a
sideBarTitle.border#6fe89a
sideBarTitle.foreground#d4f2ff
statusBar.background#060c08
statusBar.border#4fc3f0
statusBar.debuggingBackground#1d6b8a
statusBar.debuggingForeground#d4f2ff
statusBar.foreground#6fe89a
statusBar.noFolderBackground#0a110c
statusBarItem.hoverBackground#193026
statusBarItem.remoteBackground#6fe89a
statusBarItem.remoteForeground#062613
tab.activeBackground#101a13
tab.activeBorder#8fdfff
tab.activeBorderTop#6fe89a
tab.activeForeground#d4f2ff
tab.activeModifiedBorder#b8e87a
tab.border#2a4a37
tab.hoverBackground#132318
tab.hoverForeground#d8efe2
tab.inactiveBackground#0a110c
tab.inactiveForeground#6d9177
tab.inactiveModifiedBorder#7a9c4f
tab.unfocusedActiveBorderTop#2f9e63
terminal.ansiBlack#15241a
terminal.ansiBlue#4fc3f0
terminal.ansiBrightBlack#6d9177
terminal.ansiBrightBlue#8fdfff
terminal.ansiBrightCyan#a8f0e8
terminal.ansiBrightGreen#a8f5bd
terminal.ansiBrightMagenta#a8e8ff
terminal.ansiBrightRed#ffb3b3
terminal.ansiBrightWhite#d4f2ff
terminal.ansiBrightYellow#d4f09c
terminal.ansiCyan#7fd8c4
terminal.ansiGreen#6fe89a
terminal.ansiMagenta#8fdfff
terminal.ansiRed#ff8f8f
terminal.ansiWhite#b4d6c2
terminal.ansiYellow#b8e87a
terminal.background#0a110c
terminal.border#6fe89a
terminal.foreground#d8efe2
terminal.selectionBackground#2a6a8aAA
terminalCursor.background#101a13
terminalCursor.foreground#d4f2ff
textBlockQuote.background#0c150f
textBlockQuote.border#6fe89a
textCodeBlock.background#0a110c
textLink.activeForeground#a8e8ff
textLink.foreground#8fdfff
textPreformat.foreground#6fe89a
titleBar.activeBackground#060c08
titleBar.activeForeground#6fe89a
titleBar.border#4fc3f0
titleBar.inactiveBackground#050906
titleBar.inactiveForeground#6d9177
tree.inactiveIndentGuidesStroke#1a2c20
tree.indentGuidesStroke#2a4a37
window.activeBorder#6fe89a
window.inactiveBorder#2f9e63

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#6d9177	italic
string, string.quoted, string.template	#6fe89a	—
constant.character.escape, constant.other.placeholder	#b8e87a	—
constant.numeric, constant.language, constant.other	#b8e87a	—
keyword, storage.type, storage.modifier	#7fd8c4	—
keyword.control, keyword.control.flow	#d4f2ff	bold
keyword.operator, punctuation.separator, punctuation.accessor	#7fae90	—
variable, meta.definition.variable.name	#d8efe2	—
variable.parameter, meta.parameter	#a8e8ff	—
variable.other.property, support.variable.property, meta.object-literal.key	#a8f5bd	—
entity.name.function, support.function, meta.function-call	#8fdfff	—
entity.name.type, entity.name.class, support.type, support.class	#4fc3f0	—
entity.name.tag, punctuation.definition.tag	#7fd8c4	—
entity.other.attribute-name	#b8e87a	—
string.regexp, constant.regexp	#b8e87a	—
invalid, invalid.illegal	#ff8f8f	—
markup.heading, entity.name.section.markdown	#8fdfff	bold
markup.bold, punctuation.definition.bold.markdown	#b8e87a	bold
markup.italic, punctuation.definition.italic.markdown	#7fd8c4	italic
markup.underline.link, string.other.link.title.markdown	#4fc3f0	underline
markup.inline.raw, markup.fenced_code.block	#6fe89a	—
markup.inserted	#6fe89a	—
markup.deleted	#ff8f8f	—