Tyrian Night

Name: Tyrian Night
Author: renbkna

Publisher: renbknaThemes in package: 5

Ultra-saturated Tyrian Abyss, Night, Nocturne, Night Old comparison, and Dawn themes with built-in Island UI controls

Open in VS Code GitHub

Color themes

VS Code preview

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

Tyrian Night — Tyrian Abyss

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#8652FF
activityBar.background#030207
activityBar.foreground#A199C0
activityBar.inactiveForeground#7A679C
activityBarBadge.background#8652FF
activityBarBadge.foreground#030207
badge.background#8652FF
badge.foreground#FFFFFF
breadcrumb.activeSelectionForeground#C2A6FF
breadcrumb.background#030207
breadcrumb.focusForeground#DED7EE
breadcrumb.foreground#7A679C
breadcrumbPicker.background#07040D
button.background#8652FF
button.foreground#FFFFFF
button.hoverBackground#8050F0
button.secondaryBackground#100A1B
button.secondaryForeground#DED7EE
button.secondaryHoverBackground#24134A
checkbox.background#07040D
commandCenter.background#030207
commandCenter.border#24134A
debugIcon.breakpointDisabledForeground#7A679C
debugIcon.breakpointForeground#E05270
debugIcon.pauseForeground#D8893A
debugIcon.startForeground#39A96B
debugIcon.stopForeground#E05270
debugToolBar.background#07040D
debugToolBar.border#24134A
descriptionForeground#B2A8C8
diffEditor.insertedLineBackground#39A96B10
diffEditor.insertedTextBackground#39A96B1C
diffEditor.removedLineBackground#E0527010
diffEditor.removedTextBackground#E052701C
disabledForeground#6D5B8A
dropdown.background#07040D
dropdown.border#24134A
dropdown.foreground#DED7EE
dropdown.listBackground#07040D
editor.background#030207
editor.findMatchBackground#8652FF60
editor.findMatchBorder#8652FF
editor.findMatchForeground#DED7EE
editor.findMatchHighlightBackground#8652FF35
editor.findMatchHighlightForeground#DED7EE
editor.foreground#DED7EE
editor.hoverHighlightBackground#8652FF20
editor.inactiveSelectionBackground#4B2A8230
editor.lineHighlightBackground#100A1B
editor.lineHighlightBorder#2E1B52
editor.rangeHighlightBackground#8652FF18
editor.selectionBackground#8652FF40
editor.selectionForeground#DED7EE
editor.wordHighlightBackground#8652FF35
editor.wordHighlightBorder#8652FF50
editor.wordHighlightStrongBackground#8652FF50
editorBracketHighlight.foreground1#8652FF
editorBracketHighlight.foreground2#4A7DFF
editorBracketHighlight.foreground3#D7586E
editorBracketHighlight.foreground4#39A96B
editorBracketHighlight.foreground5#D8893A
editorBracketHighlight.foreground6#C764FF
editorBracketHighlight.unexpectedBracket.foreground#E05270
editorBracketMatch.background#00000000
editorBracketMatch.border#8652FF70
editorCursor.background#030207
editorCursor.foreground#B48CFF
editorError.border#E0527000
editorError.foreground#E05270
editorGroup.border#24134A
editorGroupHeader.noTabsBackground#030207
editorGroupHeader.tabsBackground#030207
editorGroupHeader.tabsBorder#24134A
editorGutter.addedBackground#39A96B
editorGutter.background#050309
editorGutter.deletedBackground#E05270
editorGutter.modifiedBackground#4A7DFF
editorHint.border#39A96B00
editorHint.foreground#39A96B
editorHoverWidget.background#07040D
editorHoverWidget.border#24134A
editorHoverWidget.foreground#C2A6FF
editorHoverWidget.statusBarBackground#07040D
editorIndentGuide.activeBackground1#21123E
editorIndentGuide.background1#1B0E35
editorInfo.border#4A7DFF00
editorInfo.foreground#4A7DFF
editorInlayHint.background#100A1B80
editorInlayHint.foreground#7A679C
editorInlayHint.parameterBackground#100A1B80
editorInlayHint.parameterForeground#D8893A
editorInlayHint.typeBackground#100A1B80
editorInlayHint.typeForeground#4A7DFF
editorLineNumber.activeForeground#9B8FB5
editorLineNumber.foreground#6D5B8A
editorOverviewRuler.addedForeground#39A96B88
editorOverviewRuler.border#24134A
editorOverviewRuler.bracketMatchForeground#8652FF70
editorOverviewRuler.commonContentForeground#7A679C
editorOverviewRuler.currentContentForeground#4A7DFF
editorOverviewRuler.deletedForeground#E0527088
editorOverviewRuler.errorForeground#E0527088
editorOverviewRuler.findMatchForeground#8652FF60
editorOverviewRuler.incomingContentForeground#39A96B
editorOverviewRuler.infoForeground#4A7DFF88
editorOverviewRuler.modifiedForeground#4A7DFF88
editorOverviewRuler.selectionHighlightForeground#4B2A8280
editorOverviewRuler.warningForeground#D8893A88
editorRuler.foreground#24134A
editorStickyScroll.background#030207
editorStickyScrollHover.background#100A1B
editorSuggestWidget.background#07040D
editorSuggestWidget.border#24134A
editorSuggestWidget.focusHighlightForeground#C2A6FF
editorSuggestWidget.foreground#C2A6FF
editorSuggestWidget.highlightForeground#8652FF
editorSuggestWidget.selectedBackground#21123E
editorWarning.border#D8893A00
editorWarning.foreground#D8893A
editorWhitespace.foreground#24134A
editorWidget.background#07040D
editorWidget.border#24134A
editorWidget.foreground#DED7EE
errorForeground#E05270
focusBorder#8652FF
foreground#DED7EE
icon.foreground#B2A8C8
input.background#07040D
input.border#24134A
input.foreground#DED7EE
input.placeholderForeground#7A679C
inputOption.activeBorder#8652FF
inputOption.activeForeground#C2A6FF
inputValidation.errorBackground#E0527020
inputValidation.errorBorder#E05270
inputValidation.infoBackground#4A7DFF20
inputValidation.infoBorder#4A7DFF
inputValidation.warningBackground#D8893A20
inputValidation.warningBorder#D8893A
list.activeSelectionBackground#21123E
list.activeSelectionForeground#DED7EE
list.errorForeground#E05270
list.focusBackground#21123E
list.focusForeground#DED7EE
list.highlightForeground#8652FF
list.hoverBackground#100A1B
list.hoverForeground#C9B8E8
list.inactiveSelectionBackground#150D29
list.inactiveSelectionForeground#C2A6FF
list.warningForeground#D8893A
menu.background#07040D
menu.foreground#C2A6FF
menu.selectionBackground#21123E
menu.selectionForeground#DED7EE
menu.separatorBackground#24134A
menubar.selectionBackground#21123E
menubar.selectionForeground#DED7EE
merge.border#24134A
merge.commonContentBackground#7A679C20
merge.commonHeaderBackground#7A679C40
merge.currentContentBackground#4A7DFF20
merge.currentHeaderBackground#4A7DFF40
merge.incomingContentBackground#39A96B20
merge.incomingHeaderBackground#39A96B40
minimap.background#030207
minimapSlider.activeBackground#8652FF60
minimapSlider.background#4B2A8240
minimapSlider.hoverBackground#8652FF50
notificationCenter.border#24134A
notificationCenterHeader.background#07040D
notificationCenterHeader.foreground#DED7EE
notificationLink.foreground#4A7DFF
notifications.background#07040D
notifications.border#24134A
notifications.foreground#C2A6FF
notificationToast.border#24134A
panel.background#030207
panel.border#24134A
panel.foreground#DED7EE
panelTitle.activeBorder#8652FF
panelTitle.activeForeground#DED7EE
panelTitle.inactiveForeground#7A679C
peekView.border#8652FF
peekViewEditor.background#07040D
peekViewEditor.matchHighlightBackground#8652FF40
peekViewEditorGutter.background#030207
peekViewResult.background#030207
peekViewResult.fileForeground#C2A6FF
peekViewResult.lineForeground#7A679C
peekViewResult.matchHighlightBackground#8652FF40
peekViewResult.selectionBackground#21123E
peekViewResult.selectionForeground#DED7EE
peekViewTitle.background#07040D
peekViewTitleDescription.foreground#7A679C
peekViewTitleLabel.foreground#DED7EE
pickerGroup.border#24134A
problemsErrorIcon.foreground#E05270
problemsInfoIcon.foreground#4A7DFF
problemsWarningIcon.foreground#D8893A
progressBar.background#8652FF
quickInput.background#07040D
quickInput.foreground#DED7EE
quickInputList.focusBackground#21123E
quickInputList.focusForeground#DED7EE
quickInputTitle.background#030207
scrollbarSlider.activeBackground#4B2A829A
scrollbarSlider.background#24134A60
scrollbarSlider.hoverBackground#351D6380
selection.background#8652FF40
sideBar.background#07040D
sideBar.border#24134A
sideBar.foreground#B2A8C8
sideBarSectionHeader.background#07040D
sideBarSectionHeader.border#24134A
sideBarSectionHeader.foreground#DED7EE
sideBarTitle.foreground#B2A8C8
statusBar.background#030207
statusBar.border#24134A
statusBar.debuggingBackground#2F1A59
statusBar.debuggingForeground#DED7EE
statusBar.foreground#8E82B0
statusBar.noFolderBackground#030207
statusBarItem.remoteBackground#8652FF
statusBarItem.remoteForeground#030207
symbolIcon.arrayForeground#C764FF
symbolIcon.booleanForeground#8652FF
symbolIcon.classForeground#4A7DFF
symbolIcon.colorForeground#C764FF
symbolIcon.constantForeground#D8893A
symbolIcon.constructorForeground#D7586E
symbolIcon.enumeratorForeground#4A7DFF
symbolIcon.enumeratorMemberForeground#D8893A
symbolIcon.eventForeground#8652FF
symbolIcon.fieldForeground#DED7EE
symbolIcon.fileForeground#C2A6FF
symbolIcon.folderForeground#4A7DFF
symbolIcon.functionForeground#D7586E
symbolIcon.interfaceForeground#4A7DFF
symbolIcon.keyForeground#D8893A
symbolIcon.keywordForeground#8652FF
symbolIcon.methodForeground#D7586E
symbolIcon.moduleForeground#4A7DFF
symbolIcon.namespaceForeground#8652FF
symbolIcon.nullForeground#7A679C
symbolIcon.numberForeground#D8893A
symbolIcon.objectForeground#4A7DFF
symbolIcon.operatorForeground#8652FF
symbolIcon.packageForeground#4A7DFF
symbolIcon.propertyForeground#DED7EE
symbolIcon.referenceForeground#4A7DFF
symbolIcon.snippetForeground#39A96B
symbolIcon.stringForeground#39A96B
symbolIcon.structForeground#4A7DFF
symbolIcon.textForeground#DED7EE
symbolIcon.typeParameterForeground#4A7DFF
symbolIcon.unitForeground#D8893A
symbolIcon.variableForeground#DED7EE
tab.activeBackground#07040D
tab.activeBorder#8652FF
tab.activeBorderTop#8652FF00
tab.activeForeground#DED7EE
tab.border#24134A
tab.hoverBackground#07040D
tab.hoverForeground#C2A6FF
tab.inactiveBackground#030207
tab.inactiveForeground#836EA6
tab.unfocusedActiveBackground#07040D
tab.unfocusedInactiveBackground#030207
terminal.ansiBlack#120A1F
terminal.ansiBlue#4A7DFF
terminal.ansiBrightBlack#5A4A73
terminal.ansiBrightBlue#7DA0FF
terminal.ansiBrightCyan#FF7A90
terminal.ansiBrightGreen#66C98D
terminal.ansiBrightMagenta#D0B6FF
terminal.ansiBrightRed#F07A91
terminal.ansiBrightWhite#F0E9FF
terminal.ansiBrightYellow#E3AA56
terminal.ansiCyan#D7586E
terminal.ansiGreen#39A96B
terminal.ansiMagenta#8652FF
terminal.ansiRed#E05270
terminal.ansiWhite#DED7EE
terminal.ansiYellow#D8893A
terminal.background#030207
terminal.foreground#DED7EE
terminal.selectionBackground#8652FF60
terminalCursor.foreground#B48CFF
textBlockQuote.background#07040D
titleBar.activeBackground#030207
titleBar.activeForeground#A199C0
titleBar.border#24134A
titleBar.inactiveBackground#030207
titleBar.inactiveForeground#6D5B8A
walkThrough.embeddedEditorBackground#030207
welcomePage.background#030207
welcomePage.tileBackground#07040D
welcomePage.tileBorder#24134A
welcomePage.tileHoverBackground#100A1B

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#8E82B0	italic
comment.block.documentation	#A199C0	italic
string, string.template, punctuation.definition.string	#39A96B	—
keyword, keyword.control, keyword.operator, entity.name.tag, entity.name.tag.js, entity.name.tag.css, meta.import, keyword.control.import	#8652FF	—
constant.numeric, constant.language, constant.character, keyword.other.unit, variable.other.enummember, entity.other.attribute-name.id.css	#D8893A	—
entity.name.type, entity.name.type.interface, entity.name.type.class, support.type, support.class, support.class.component, entity.other.attribute-name.class.css	#4A7DFF	—
entity.name.function, support.function, meta.function-call, entity.name.method, support.type.property-name.css	#D7586E	—
variable, support.constant.property-value.css	#DED7EE	—
storage.type, storage.modifier	#8652FF	—
variable.parameter, meta.parameter, entity.other.attribute-name, support.type.property-name.json	#C764FF	—
string.regexp, constant.character.escape	#C764FF	—
variable.language, entity.name.function.decorator	#D8893A	—
variable.other.constant, meta.decorator, punctuation.decorator, markup.list	#D8893A	—
punctuation, meta.brace, punctuation.separator, punctuation.terminator, punctuation.definition.tag	#A69ABC	—
markup.heading	#8652FF	bold
markup.bold	#DED7EE	bold
markup.italic	#C764FF	italic
markup.inline.raw	#D7586E	—
markup.underline.link	#4A7DFF	—
markup.quote	#39A96B	italic
invalid	#E05270	—
invalid.deprecated	#D8893A	strikethrough