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#75715E
- activityBar.background#272822
- activityBar.border#414339
- activityBar.foreground#f8f8f2
- activityBar.inactiveForeground#90908a
- activityBarBadge.background#75715E
- activityBarBadge.foreground#ffffff
- badge.background#75715E
- badge.foreground#ffffff
- breadcrumb.activeSelectionForeground#f8f8f2
- breadcrumb.background#272822
- breadcrumb.focusForeground#f8f8f2
- breadcrumb.foreground#88846f
- button.background#75715E
- button.foreground#ffffff
- button.hoverBackground#819aff
- button.secondaryBackground#1e1f1c
- button.secondaryForeground#f8f8f2
- button.secondaryHoverBackground#3e3d32
- checkbox.background#1e1f1c
- checkbox.border#414339
- commandCenter.background#1e1f1c
- commandCenter.border#414339
- commandCenter.foreground#88846f
- debugIcon.continueForeground#86B42B
- debugIcon.disconnectForeground#C4265E
- debugIcon.pauseForeground#6A7EC8
- debugIcon.restartForeground#86B42B
- debugIcon.startForeground#86B42B
- debugIcon.stepIntoForeground#6A7EC8
- debugIcon.stepOutForeground#6A7EC8
- debugIcon.stepOverForeground#6A7EC8
- debugIcon.stopForeground#C4265E
- debugToolBar.background#1e1f1c
- descriptionForeground#88846f
- diffEditor.diagonalFill#88846f26
- diffEditor.insertedLineBackground#86B42B18
- diffEditor.insertedTextBackground#86B42B30
- diffEditor.removedLineBackground#C4265E18
- diffEditor.removedTextBackground#C4265E30
- disabledForeground#f8f8f266
- dropdown.background#1e1f1c
- dropdown.border#414339
- dropdown.foreground#f8f8f2
- editor.background#272822
- editor.findMatchBackground#F8F8F266
- editor.findMatchHighlightBackground#F8F8F235
- editor.findRangeHighlightBackground#75715E18
- editor.foreground#f8f8f2
- editor.hoverHighlightBackground#75715E18
- editor.inactiveSelectionBackground#75715E33
- editor.lineHighlightBackground#1e1f1c
- editor.selectionBackground#878b9180
- editor.selectionHighlightBackground#75715E33
- editor.wordHighlightBackground#6A7EC825
- editor.wordHighlightStrongBackground#8C6BC830
- editorBracketHighlight.foreground1#C4265E
- editorBracketHighlight.foreground2#F8F8F2
- editorBracketHighlight.foreground3#86B42B
- editorBracketHighlight.foreground4#6A7EC8
- editorBracketHighlight.foreground5#8C6BC8
- editorBracketHighlight.foreground6#819aff
- editorBracketMatch.background#75715E22
- editorBracketMatch.border#75715E
- editorBracketPairGuide.activeBackground1#75715Ea6
- editorBracketPairGuide.activeBackground2#75715Ea6
- editorBracketPairGuide.activeBackground3#75715Ea6
- editorBracketPairGuide.activeBackground4#75715Ea6
- editorBracketPairGuide.activeBackground5#75715Ea6
- editorBracketPairGuide.activeBackground6#75715Ea6
- editorBracketPairGuide.background1#f8f8f224
- editorBracketPairGuide.background2#f8f8f224
- editorBracketPairGuide.background3#f8f8f224
- editorBracketPairGuide.background4#f8f8f224
- editorBracketPairGuide.background5#f8f8f224
- editorBracketPairGuide.background6#f8f8f224
- editorCursor.foreground#f8f8f0
- editorError.foreground#C4265E
- editorGroup.border#414339
- editorGroupHeader.tabsBackground#1e1f1c
- editorGroupHeader.tabsBorder#414339
- editorGutter.addedBackground#86B42B
- editorGutter.deletedBackground#C4265E
- editorGutter.modifiedBackground#6A7EC8
- editorHint.foreground#86B42B
- editorHoverWidget.background#1e1f1c
- editorHoverWidget.border#414339
- editorIndentGuide.activeBackground1#75715Ea6
- editorIndentGuide.background1#f8f8f224
- editorInfo.foreground#6A7EC8
- editorLineNumber.activeForeground#88846f
- editorLineNumber.foreground#90908a
- editorSuggestWidget.background#1e1f1c
- editorSuggestWidget.border#414339
- editorSuggestWidget.selectedBackground#3e3d32
- editorWarning.foreground#B3B42B
- editorWhitespace.foreground#f8f8f224
- editorWidget.background#1e1f1c
- editorWidget.border#414339
- editorWidget.foreground#f8f8f2
- errorForeground#C4265E
- focusBorder#99947c
- foreground#f8f8f2
- gitDecoration.addedResourceForeground#86B42B
- gitDecoration.conflictingResourceForeground#F8F8F2
- gitDecoration.deletedResourceForeground#C4265E
- gitDecoration.ignoredResourceForeground#90908a
- gitDecoration.modifiedResourceForeground#6A7EC8
- gitDecoration.renamedResourceForeground#8C6BC8
- gitDecoration.untrackedResourceForeground#86B42B
- icon.foreground#88846f
- input.background#1e1f1c
- input.border#414339
- input.foreground#f8f8f2
- input.placeholderForeground#90908a
- inputOption.activeBackground#75715E55
- inputOption.activeBorder#75715E
- inputValidation.errorBackground#C4265E22
- inputValidation.errorBorder#C4265E
- inputValidation.infoBackground#6A7EC822
- inputValidation.infoBorder#6A7EC8
- inputValidation.warningBackground#B3B42B22
- inputValidation.warningBorder#B3B42B
- list.activeSelectionBackground#75715E55
- list.activeSelectionForeground#f8f8f2
- list.errorForeground#C4265E
- list.focusBackground#75715E44
- list.highlightForeground#75715E
- list.hoverBackground#3e3d32
- list.inactiveSelectionBackground#75715E33
- list.warningForeground#B3B42B
- menu.background#1e1f1c
- menu.foreground#f8f8f2
- menu.selectionBackground#878b9180
- menu.separatorBackground#414339
- minimap.background#272822
- minimap.findMatchHighlight#F8F8F280
- minimap.selectionHighlight#75715E66
- notificationCenter.border#414339
- notificationCenterHeader.background#1e1f1c
- notifications.background#1e1f1c
- notifications.border#414339
- notifications.foreground#f8f8f2
- panel.background#1e1f1c
- panel.border#414339
- panelTitle.activeBorder#75715E
- panelTitle.activeForeground#f8f8f2
- panelTitle.inactiveForeground#88846f
- peekView.border#75715E
- peekViewEditor.background#272822
- peekViewResult.background#1e1f1c
- peekViewResult.selectionBackground#878b9180
- peekViewTitle.background#1e1f1c
- pickerGroup.border#414339
- pickerGroup.foreground#75715E
- progressBar.background#75715E
- quickInput.background#1e1f1c
- quickInput.foreground#f8f8f2
- scrollbar.shadow#00000088
- scrollbarSlider.activeBackground#f8f8f245
- scrollbarSlider.background#f8f8f218
- scrollbarSlider.hoverBackground#f8f8f22e
- sideBar.background#1e1f1c
- sideBar.border#414339
- sideBar.foreground#88846f
- sideBarSectionHeader.background#272822
- sideBarSectionHeader.border#414339
- sideBarSectionHeader.foreground#f8f8f2
- sideBarTitle.foreground#f8f8f2
- statusBar.background#1e1f1c
- statusBar.border#414339
- statusBar.debuggingBackground#C4265E
- statusBar.debuggingForeground#111111
- statusBar.foreground#88846f
- statusBar.noFolderBackground#1e1f1c
- tab.activeBackground#272822
- tab.activeBorder#272822
- tab.activeBorderTop#75715E
- tab.activeForeground#f8f8f2
- tab.border#414339
- tab.inactiveBackground#1e1f1c
- tab.inactiveForeground#88846f
- terminal.ansiBlack#333333
- terminal.ansiBlue#6A7EC8
- terminal.ansiBrightBlack#666666
- terminal.ansiBrightBlue#819aff
- terminal.ansiBrightCyan#66D9EF
- terminal.ansiBrightGreen#A6E22E
- terminal.ansiBrightMagenta#AE81FF
- terminal.ansiBrightRed#f92672
- terminal.ansiBrightWhite#f8f8f2
- terminal.ansiBrightYellow#e2e22e
- terminal.ansiCyan#56ADBC
- terminal.ansiGreen#86B42B
- terminal.ansiMagenta#8C6BC8
- terminal.ansiRed#C4265E
- terminal.ansiWhite#e3e3dd
- terminal.ansiYellow#B3B42B
- terminal.background#272822
- terminal.foreground#f8f8f2
- terminal.selectionBackground#878b9180
- terminalCursor.foreground#75715E
- textBlockQuote.background#1e1f1c
- textBlockQuote.border#75715E
- textCodeBlock.background#1e1f1c
- textLink.activeForeground#819aff
- textLink.foreground#75715E
- titleBar.activeBackground#1e1f1c
- titleBar.activeForeground#f8f8f2
- titleBar.border#414339
- titleBar.inactiveBackground#1e1f1c
- titleBar.inactiveForeground#90908a
- tree.inactiveIndentGuidesStroke#f8f8f224
- tree.indentGuidesStroke#f8f8f252
- widget.shadow#00000088
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #88846f | — |
| string, constant.other.symbol, markup.inline.raw | #86B42B | — |
| constant.numeric, constant.language.boolean, constant.language.null | #6A7EC8 | — |
| constant, variable.other.constant | #F8F8F2 | — |
| keyword, storage.type, storage.modifier | #C4265E | — |
| variable, meta.object-literal.key, support.variable.property, meta.property-name | #F8F8F2 | — |
| variable.parameter, function.parameter | #88846f | — |
| entity.name.function, support.function, variable.function, meta.function-call | #8C6BC8 | — |
| entity.name.type, entity.name.class, support.type, support.class, entity.other.inherited-class | #8C6BC8 | — |
| entity.name.namespace, entity.name.type.namespace | #F8F8F2 | — |
| keyword.operator.arithmetic, keyword.operator.comparison, keyword.operator.logical, keyword.operator.assignment | #6A7EC8 | — |
| punctuation, meta.brace | #88846f | — |
| entity.name.tag, punctuation.definition.tag | #C4265E | — |
| entity.other.attribute-name | #6A7EC8 | — |
| string.regexp, constant.regexp | #819aff | — |
| markup.heading, entity.name.section | #C4265E | bold |
| markup.bold, punctuation.definition.bold | #F8F8F2 | bold |
| markup.italic, punctuation.definition.italic | #C4265E | italic |
| markup.underline.link, string.other.link | #75715E | underline |
| markup.inserted | #86B42B | — |
| markup.deleted | #C4265E | — |
| markup.changed | #F8F8F2 | — |
| invalid | #ffffff | — |