Codex Palette for VS Code
Publisher: smallyuThemes in package: 43
All 43 Codex appearance presets for VS Code, with faithful colors and one-click system appearance switching.
Color themes
VS Code preview
Full workbench mockup using this variant's colors and tokenColors.
Loading...
colors
Workbench UI color keys from the theme JSON colors map.
- activityBar.activeBorder#2AA198
- activityBar.background#003847
- activityBar.border#2b2b4a
- activityBar.foreground#839496
- activityBar.inactiveForeground#93A1A1AA
- activityBarBadge.background#2AA198
- activityBarBadge.foreground#ffffff
- badge.background#2AA198
- badge.foreground#ffffff
- breadcrumb.activeSelectionForeground#839496
- breadcrumb.background#002B36
- breadcrumb.focusForeground#839496
- breadcrumb.foreground#5e747a
- button.background#2AA19899
- button.foreground#ffffff
- button.hoverBackground#839496
- button.secondaryBackground#00212B
- button.secondaryForeground#839496
- button.secondaryHoverBackground#004454AA
- checkbox.background#00212B
- checkbox.border#2b2b4a
- commandCenter.background#00212B
- commandCenter.border#2b2b4a
- commandCenter.foreground#5e747a
- 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#00212B
- descriptionForeground#5e747a
- diffEditor.diagonalFill#5e747a26
- diffEditor.insertedLineBackground#85990018
- diffEditor.insertedTextBackground#85990030
- diffEditor.removedLineBackground#dc322f18
- diffEditor.removedTextBackground#dc322f30
- disabledForeground#83949666
- dropdown.background#00212B
- dropdown.border#2b2b4a
- dropdown.foreground#839496
- editor.background#002B36
- editor.findMatchBackground#83949666
- editor.findMatchHighlightBackground#83949635
- editor.findRangeHighlightBackground#2AA19818
- editor.foreground#839496
- editor.hoverHighlightBackground#2AA19818
- editor.inactiveSelectionBackground#2AA19833
- editor.lineHighlightBackground#00212B
- editor.selectionBackground#274642
- editor.selectionHighlightBackground#2AA19833
- editor.wordHighlightBackground#268bd225
- editor.wordHighlightStrongBackground#d3368230
- editorBracketHighlight.foreground1#dc322f
- editorBracketHighlight.foreground2#839496
- editorBracketHighlight.foreground3#859900
- editorBracketHighlight.foreground4#268bd2
- editorBracketHighlight.foreground5#d33682
- editorBracketHighlight.foreground6#839496
- editorBracketMatch.background#2AA19822
- editorBracketMatch.border#2AA198
- editorBracketPairGuide.activeBackground1#2AA198a6
- editorBracketPairGuide.activeBackground2#2AA198a6
- editorBracketPairGuide.activeBackground3#2AA198a6
- editorBracketPairGuide.activeBackground4#2AA198a6
- editorBracketPairGuide.activeBackground5#2AA198a6
- editorBracketPairGuide.activeBackground6#2AA198a6
- editorBracketPairGuide.background1#83949624
- editorBracketPairGuide.background2#83949624
- editorBracketPairGuide.background3#83949624
- editorBracketPairGuide.background4#83949624
- editorBracketPairGuide.background5#83949624
- editorBracketPairGuide.background6#83949624
- editorCursor.foreground#D30102
- editorError.foreground#dc322f
- editorGroup.border#2b2b4a
- editorGroupHeader.tabsBackground#004052
- editorGroupHeader.tabsBorder#2b2b4a
- editorGutter.addedBackground#859900
- editorGutter.deletedBackground#dc322f
- editorGutter.modifiedBackground#268bd2
- editorHint.foreground#859900
- editorHoverWidget.background#00212B
- editorHoverWidget.border#2b2b4a
- editorIndentGuide.activeBackground1#2AA198a6
- editorIndentGuide.background1#83949624
- editorInfo.foreground#268bd2
- editorLineNumber.activeForeground#5e747a
- editorLineNumber.foreground#93A1A1AA
- editorSuggestWidget.background#00212B
- editorSuggestWidget.border#2b2b4a
- editorSuggestWidget.selectedBackground#004454AA
- editorWarning.foreground#b58900
- editorWhitespace.foreground#83949624
- editorWidget.background#00212B
- editorWidget.border#2b2b4a
- editorWidget.foreground#839496
- errorForeground#ffeaea
- focusBorder#2AA19899
- foreground#839496
- gitDecoration.addedResourceForeground#859900
- gitDecoration.conflictingResourceForeground#839496
- gitDecoration.deletedResourceForeground#dc322f
- gitDecoration.ignoredResourceForeground#93A1A1AA
- gitDecoration.modifiedResourceForeground#268bd2
- gitDecoration.renamedResourceForeground#d33682
- gitDecoration.untrackedResourceForeground#859900
- icon.foreground#5e747a
- input.background#00212B
- input.border#2b2b4a
- input.foreground#839496
- input.placeholderForeground#93A1A1AA
- inputOption.activeBackground#2AA19855
- inputOption.activeBorder#2AA198
- inputValidation.errorBackground#dc322f22
- inputValidation.errorBorder#dc322f
- inputValidation.infoBackground#268bd222
- inputValidation.infoBorder#268bd2
- inputValidation.warningBackground#b5890022
- inputValidation.warningBorder#b58900
- list.activeSelectionBackground#2AA19855
- list.activeSelectionForeground#839496
- list.errorForeground#dc322f
- list.focusBackground#2AA19844
- list.highlightForeground#2AA198
- list.hoverBackground#004454AA
- list.inactiveSelectionBackground#2AA19833
- list.warningForeground#b58900
- menu.background#00212B
- menu.foreground#839496
- menu.selectionBackground#274642
- menu.separatorBackground#2b2b4a
- minimap.background#002B36
- minimap.findMatchHighlight#83949680
- minimap.selectionHighlight#2AA19866
- notificationCenter.border#2b2b4a
- notificationCenterHeader.background#00212B
- notifications.background#00212B
- notifications.border#2b2b4a
- notifications.foreground#839496
- panel.background#00212B
- panel.border#2b2b4a
- panelTitle.activeBorder#2AA198
- panelTitle.activeForeground#839496
- panelTitle.inactiveForeground#5e747a
- peekView.border#2AA198
- peekViewEditor.background#002B36
- peekViewResult.background#00212B
- peekViewResult.selectionBackground#274642
- peekViewTitle.background#00212B
- pickerGroup.border#2b2b4a
- pickerGroup.foreground#2AA198
- progressBar.background#2AA198
- quickInput.background#00212B
- quickInput.foreground#839496
- scrollbar.shadow#00000088
- scrollbarSlider.activeBackground#83949645
- scrollbarSlider.background#83949618
- scrollbarSlider.hoverBackground#8394962e
- sideBar.background#00212B
- sideBar.border#2b2b4a
- sideBar.foreground#5e747a
- sideBarSectionHeader.background#00212B
- sideBarSectionHeader.border#2b2b4a
- sideBarSectionHeader.foreground#839496
- sideBarTitle.foreground#93A1A1
- statusBar.background#00212B
- statusBar.border#2b2b4a
- statusBar.debuggingBackground#dc322f
- statusBar.debuggingForeground#111111
- statusBar.foreground#5e747a
- statusBar.noFolderBackground#00212B
- tab.activeBackground#002B36
- tab.activeBorder#002B36
- tab.activeBorderTop#2AA198
- tab.activeForeground#839496
- tab.border#2b2b4a
- tab.inactiveBackground#00212B
- tab.inactiveForeground#5e747a
- 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#002B36
- terminal.foreground#839496
- terminal.selectionBackground#274642
- terminalCursor.foreground#2AA198
- textBlockQuote.background#00212B
- textBlockQuote.border#2AA198
- textCodeBlock.background#00212B
- textLink.activeForeground#839496
- textLink.foreground#2AA198
- titleBar.activeBackground#00212B
- titleBar.activeForeground#839496
- titleBar.border#2b2b4a
- titleBar.inactiveBackground#00212B
- titleBar.inactiveForeground#93A1A1AA
- tree.inactiveIndentGuidesStroke#83949624
- tree.indentGuidesStroke#83949652
- widget.shadow#00000088
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #5e747a | — |
| string, constant.other.symbol, markup.inline.raw | #859900 | — |
| constant.numeric, constant.language.boolean, constant.language.null | #268bd2 | — |
| constant, variable.other.constant | #839496 | — |
| keyword, storage.type, storage.modifier | #dc322f | — |
| variable, meta.object-literal.key, support.variable.property, meta.property-name | #839496 | — |
| variable.parameter, function.parameter | #5e747a | — |
| 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 | #839496 | — |
| keyword.operator.arithmetic, keyword.operator.comparison, keyword.operator.logical, keyword.operator.assignment | #268bd2 | — |
| punctuation, meta.brace | #5e747a | — |
| 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 | #839496 | bold |
| markup.italic, punctuation.definition.italic | #dc322f | italic |
| markup.underline.link, string.other.link | #2AA198 | underline |
| markup.inserted | #859900 | — |
| markup.deleted | #dc322f | — |
| markup.changed | #839496 | — |
| invalid | #ffffff | — |