Codex Palette for VS Code

Name: Codex Palette for VS Code
Author: smallyu

Publisher: smallyuThemes in package: 43

All 43 Codex appearance presets for VS Code, with faithful colors and one-click system appearance switching.

Open in VS Code GitHub

Color themes

VS Code preview

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

Codex Palette for VS Code — Codex Palette — Solarized Light

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.activeBorder#9b8d4e
activityBar.background#DDD6C1
activityBar.border#DDD6C1
activityBar.foreground#584c27
activityBar.inactiveForeground#586E75AA
activityBarBadge.background#B58900
activityBarBadge.foreground#ffffff
badge.background#9b8d4e
badge.foreground#ffffff
breadcrumb.activeSelectionForeground#5b6f76
breadcrumb.background#FDF6E3
breadcrumb.focusForeground#5b6f76
breadcrumb.foreground#829294
button.background#AC9D57
button.foreground#ffffff
button.hoverBackground#839496
button.secondaryBackground#EEE8D5
button.secondaryForeground#5b6f76
button.secondaryHoverBackground#DFCA8844
checkbox.background#EEE8D5
checkbox.border#DDD6C1
commandCenter.background#EEE8D5
commandCenter.border#DDD6C1
commandCenter.foreground#829294
debugIcon.continueForeground#859900
debugIcon.disconnectForeground#dc322f
debugIcon.pauseForeground#268bd2
debugIcon.restartForeground#859900
debugIcon.startForeground#859900
debugIcon.stepIntoForeground#268bd2
debugIcon.stepOutForeground#268bd2
debugIcon.stepOverForeground#268bd2
debugIcon.stopForeground#dc322f
debugToolBar.background#EEE8D5
descriptionForeground#829294
diffEditor.diagonalFill#82929426
diffEditor.insertedLineBackground#85990012
diffEditor.insertedTextBackground#85990020
diffEditor.removedLineBackground#dc322f12
diffEditor.removedTextBackground#dc322f20
disabledForeground#5b6f7666
dropdown.background#EEE8D5
dropdown.border#DDD6C1
dropdown.foreground#5b6f76
editor.background#FDF6E3
editor.findMatchBackground#657B834d
editor.findMatchHighlightBackground#657B8326
editor.findRangeHighlightBackground#9b8d4e18
editor.foreground#657B83
editor.hoverHighlightBackground#9b8d4e18
editor.inactiveSelectionBackground#9b8d4e1f
editor.lineHighlightBackground#EEE8D5
editor.selectionBackground#EEE8D5
editor.selectionHighlightBackground#9b8d4e1f
editor.wordHighlightBackground#268bd218
editor.wordHighlightStrongBackground#d336821f
editorBracketHighlight.foreground1#dc322f
editorBracketHighlight.foreground2#657B83
editorBracketHighlight.foreground3#859900
editorBracketHighlight.foreground4#268bd2
editorBracketHighlight.foreground5#d33682
editorBracketHighlight.foreground6#839496
editorBracketMatch.background#9b8d4e22
editorBracketMatch.border#9b8d4e
editorBracketPairGuide.activeBackground1#9b8d4e8c
editorBracketPairGuide.activeBackground2#9b8d4e8c
editorBracketPairGuide.activeBackground3#9b8d4e8c
editorBracketPairGuide.activeBackground4#9b8d4e8c
editorBracketPairGuide.activeBackground5#9b8d4e8c
editorBracketPairGuide.activeBackground6#9b8d4e8c
editorBracketPairGuide.background1#5b6f7618
editorBracketPairGuide.background2#5b6f7618
editorBracketPairGuide.background3#5b6f7618
editorBracketPairGuide.background4#5b6f7618
editorBracketPairGuide.background5#5b6f7618
editorBracketPairGuide.background6#5b6f7618
editorCursor.foreground#657B83
editorError.foreground#dc322f
editorGroup.border#DDD6C1
editorGroupHeader.tabsBackground#D9D2C2
editorGroupHeader.tabsBorder#DDD6C1
editorGutter.addedBackground#859900
editorGutter.deletedBackground#dc322f
editorGutter.modifiedBackground#268bd2
editorHint.foreground#859900
editorHoverWidget.background#EEE8D5
editorHoverWidget.border#DDD6C1
editorIndentGuide.activeBackground1#9b8d4e8c
editorIndentGuide.background1#5b6f7618
editorInfo.foreground#268bd2
editorLineNumber.activeForeground#829294
editorLineNumber.foreground#586E75AA
editorSuggestWidget.background#EEE8D5
editorSuggestWidget.border#DDD6C1
editorSuggestWidget.selectedBackground#DFCA8844
editorWarning.foreground#b58900
editorWhitespace.foreground#5b6f7618
editorWidget.background#EEE8D5
editorWidget.border#DDD6C1
editorWidget.foreground#5b6f76
errorForeground#dc322f
focusBorder#b49471
foreground#5b6f76
gitDecoration.addedResourceForeground#859900
gitDecoration.conflictingResourceForeground#657B83
gitDecoration.deletedResourceForeground#dc322f
gitDecoration.ignoredResourceForeground#586E75AA
gitDecoration.modifiedResourceForeground#268bd2
gitDecoration.renamedResourceForeground#d33682
gitDecoration.untrackedResourceForeground#859900
icon.foreground#829294
input.background#EEE8D5
input.border#DDD6C1
input.foreground#5b6f76
input.placeholderForeground#586E75AA
inputOption.activeBackground#9b8d4e22
inputOption.activeBorder#9b8d4e
inputValidation.errorBackground#dc322f12
inputValidation.errorBorder#dc322f
inputValidation.infoBackground#268bd212
inputValidation.infoBorder#268bd2
inputValidation.warningBackground#b5890012
inputValidation.warningBorder#b58900
list.activeSelectionBackground#9b8d4e22
list.activeSelectionForeground#5b6f76
list.errorForeground#dc322f
list.focusBackground#9b8d4e1f
list.highlightForeground#9b8d4e
list.hoverBackground#DFCA8844
list.inactiveSelectionBackground#9b8d4e14
list.warningForeground#b58900
menu.background#EEE8D5
menu.foreground#5b6f76
menu.selectionBackground#EEE8D5
menu.separatorBackground#DDD6C1
minimap.background#FDF6E3
minimap.findMatchHighlight#657B8380
minimap.selectionHighlight#9b8d4e66
notificationCenter.border#DDD6C1
notificationCenterHeader.background#EEE8D5
notifications.background#EEE8D5
notifications.border#DDD6C1
notifications.foreground#5b6f76
panel.background#EEE8D5
panel.border#DDD6C1
panelTitle.activeBorder#9b8d4e
panelTitle.activeForeground#5b6f76
panelTitle.inactiveForeground#829294
peekView.border#9b8d4e
peekViewEditor.background#FDF6E3
peekViewResult.background#EEE8D5
peekViewResult.selectionBackground#EEE8D5
peekViewTitle.background#EEE8D5
pickerGroup.border#DDD6C1
pickerGroup.foreground#9b8d4e
progressBar.background#9b8d4e
quickInput.background#EEE8D5
quickInput.foreground#5b6f76
scrollbar.shadow#00000025
scrollbarSlider.activeBackground#5b6f7645
scrollbarSlider.background#5b6f7618
scrollbarSlider.hoverBackground#5b6f762e
sideBar.background#EEE8D5
sideBar.border#DDD6C1
sideBar.foreground#829294
sideBarSectionHeader.background#EEE8D5
sideBarSectionHeader.border#DDD6C1
sideBarSectionHeader.foreground#5b6f76
sideBarTitle.foreground#586E75
statusBar.background#EEE8D5
statusBar.border#DDD6C1
statusBar.debuggingBackground#dc322f
statusBar.debuggingForeground#ffffff
statusBar.foreground#829294
statusBar.noFolderBackground#EEE8D5
tab.activeBackground#FDF6E3
tab.activeBorder#FDF6E3
tab.activeBorderTop#9b8d4e
tab.activeForeground#5b6f76
tab.border#DDD6C1
tab.inactiveBackground#EEE8D5
tab.inactiveForeground#829294
terminal.ansiBlack#073642
terminal.ansiBlue#268bd2
terminal.ansiBrightBlack#002b36
terminal.ansiBrightBlue#839496
terminal.ansiBrightCyan#93a1a1
terminal.ansiBrightGreen#586e75
terminal.ansiBrightMagenta#6c71c4
terminal.ansiBrightRed#cb4b16
terminal.ansiBrightWhite#fdf6e3
terminal.ansiBrightYellow#657b83
terminal.ansiCyan#2aa198
terminal.ansiGreen#859900
terminal.ansiMagenta#d33682
terminal.ansiRed#dc322f
terminal.ansiWhite#eee8d5
terminal.ansiYellow#b58900
terminal.background#FDF6E3
terminal.foreground#5b6f76
terminal.selectionBackground#EEE8D5
terminalCursor.foreground#9b8d4e
textBlockQuote.background#EEE8D5
textBlockQuote.border#9b8d4e
textCodeBlock.background#EEE8D5
textLink.activeForeground#839496
textLink.foreground#9b8d4e
titleBar.activeBackground#EEE8D5
titleBar.activeForeground#5b6f76
titleBar.border#DDD6C1
titleBar.inactiveBackground#EEE8D5
titleBar.inactiveForeground#586E75AA
tree.inactiveIndentGuidesStroke#5b6f7618
tree.indentGuidesStroke#5b6f763d
widget.shadow#00000025

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#829294	—
string, constant.other.symbol, markup.inline.raw	#859900	—
constant.numeric, constant.language.boolean, constant.language.null	#268bd2	—
constant, variable.other.constant	#657B83	—
keyword, storage.type, storage.modifier	#dc322f	—
variable, meta.object-literal.key, support.variable.property, meta.property-name	#657B83	—
variable.parameter, function.parameter	#829294	—
entity.name.function, support.function, variable.function, meta.function-call	#d33682	—
entity.name.type, entity.name.class, support.type, support.class, entity.other.inherited-class	#d33682	—
entity.name.namespace, entity.name.type.namespace	#657B83	—
keyword.operator.arithmetic, keyword.operator.comparison, keyword.operator.logical, keyword.operator.assignment	#268bd2	—
punctuation, meta.brace	#829294	—
entity.name.tag, punctuation.definition.tag	#dc322f	—
entity.other.attribute-name	#268bd2	—
string.regexp, constant.regexp	#839496	—
markup.heading, entity.name.section	#dc322f	bold
markup.bold, punctuation.definition.bold	#657B83	bold
markup.italic, punctuation.definition.italic	#dc322f	italic
markup.underline.link, string.other.link	#9b8d4e	underline
markup.inserted	#859900	—
markup.deleted	#dc322f	—
markup.changed	#657B83	—
invalid	#ffffff	—