Cyber Pastel Theme Pack

Name: Cyber Pastel Theme Pack
Author: cyber-pastel-themes

Publisher: cyber-pastel-themesThemes in package: 4

🚀 A futuristic light theme pack with 4 accent colors: Violet, Matrix Green, Sunset Orange & Cyber Cyan. Optimized for Space Mono font!

Open in VS Code GitHub

Color themes

VS Code preview

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

Cyber Pastel Theme Pack — Cyber Pastel - Cyber Cyan

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.ts

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...

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Light+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.background#ffffff
activityBar.border#e5e7eb
activityBar.foreground#06b6d4
activityBar.inactiveForeground#9ca3af
activityBarBadge.background#06b6d4
activityBarBadge.foreground#ffffff
badge.background#06b6d4
badge.foreground#ffffff
button.background#06b6d4
button.foreground#ffffff
button.hoverBackground#0891b2
editor.background#fefeff
editor.findMatchBackground#fbbf24
editor.findMatchHighlightBackground#fef3c7
editor.foreground#374151
editor.lineHighlightBackground#ecfeff
editor.selectionBackground#cffafe
editor.selectionHighlightBackground#f0fdfa
editor.wordHighlightBackground#cffafe
editor.wordHighlightStrongBackground#a5f3fc
editorBracketMatch.background#cffafe
editorBracketMatch.border#06b6d4
editorCursor.foreground#06b6d4
editorLineNumber.activeForeground#06b6d4
editorLineNumber.foreground#67e8f9
explorer.decorations.badges#06b6d4
explorer.decorations.colors#06b6d4
explorer.decorations.errorForeground#ef4444
explorer.decorations.infoForeground#3b82f6
explorer.decorations.warningForeground#f59e0b
explorerItem.fileForeground#374151
explorerItem.fileHoverForeground#6b7280
explorerItem.fileSelectedForeground#6b7280
explorerItem.folderForeground#06b6d4
explorerItem.folderHoverForeground#0891b2
explorerItem.folderSelectedForeground#0891b2
explorerItem.resourceForeground#374151
explorerItem.resourceGroupForeground#6b7280
explorerItem.resourceGroupIconForeground#06b6d4
explorerItem.resourceHoverForeground#06b6d4
explorerItem.resourceSelectedForeground#06b6d4
list.activeSelectionBackground#cffafe
list.activeSelectionForeground#374151
list.focusBackground#cffafe
list.hoverBackground#f0fdfa
progressBar.background#06b6d4
sideBar.background#ffffff
sideBar.border#e5e7eb
sideBar.foreground#374151
sideBarSectionHeader.background#f9fafb
sideBarSectionHeader.border#e5e7eb
sideBarSectionHeader.foreground#374151
sideBarTitle.foreground#06b6d4
statusBar.background#a7f3d0
statusBar.border#86efac
statusBar.debuggingBackground#06b6d4
statusBar.debuggingForeground#ffffff
statusBar.foreground#065f46
statusBar.noFolderBackground#cffafe
tab.activeBackground#fefeff
tab.activeBorder#06b6d4
tab.activeBorderTop#06b6d4
tab.activeForeground#374151
tab.border#e5e7eb
tab.inactiveBackground#ffffff
tab.inactiveForeground#6b7280
titleBar.activeBackground#ffffff
titleBar.activeForeground#374151
titleBar.border#e5e7eb
titleBar.inactiveBackground#f9fafb
titleBar.inactiveForeground#6b7280

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#67e8f9	italic
keyword, storage.type, storage.modifier	#06b6d4	bold
string, punctuation.definition.string	#10b981	—
constant.numeric	#f59e0b	—
entity.name.function, meta.function-call, support.function	#3b82f6	—
entity.name.type, entity.name.class, support.type, support.class	#ec4899	—
keyword.operator	#06b6d4	—