Codex Theme Collection

Color themes

• 

  Codex — GitHub Light

• 

  Codex — Gruvbox Dark

• 

  Codex — Gruvbox Light

• 

  Codex — Monokai

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#458588
• activityBar.background#f2e5bc
• activityBar.foreground#3c3836
• activityBar.inactiveForeground#7a6d5a
• activityBarBadge.background#458588
• activityBarBadge.foreground#fbf1c7
• badge.background#458588
• badge.foreground#fbf1c7
• button.background#458588
• button.foreground#fbf1c7
• button.hoverBackground#36686a
• editor.background#fbf1c7
• editor.findMatchBackground#b5761260
• editor.findMatchHighlightBackground#b5761230
• editor.foreground#3c3836
• editor.inactiveSelectionBackground#d5c4a140
• editor.lineHighlightBackground#f2e5bc
• editor.selectionBackground#d5c4a180
• editorBracketMatch.background#45858830
• editorBracketMatch.border#458588
• editorCursor.foreground#458588
• editorGroupHeader.tabsBackground#f2e5bc
• editorGutter.addedBackground#79740e
• editorGutter.deletedBackground#9d0006
• editorGutter.modifiedBackground#b57614
• editorIndentGuide.activeBackground1#bdae93
• editorIndentGuide.background1#ebdbb2
• editorLineNumber.activeForeground#3c3836
• editorLineNumber.foreground#bdae93
• focusBorder#458588
• input.background#fbf1c7
• input.border#d5c4a1
• input.foreground#3c3836
• list.activeSelectionBackground#45858820
• list.activeSelectionForeground#3c3836
• list.highlightForeground#458588
• list.hoverBackground#45858810
• panel.background#f2e5bc
• panel.border#ebdbb2
• panelTitle.activeForeground#458588
• panelTitle.inactiveForeground#7a6d5a
• scrollbarSlider.activeBackground#3c383660
• scrollbarSlider.background#3c383620
• scrollbarSlider.hoverBackground#3c383640
• sideBar.background#f2e5bc
• sideBar.foreground#3c3836
• sideBarSectionHeader.background#ebdbb2
• sideBarSectionHeader.foreground#3c3836
• statusBar.background#458588
• statusBar.foreground#fbf1c7
• tab.activeBackground#fbf1c7
• tab.activeBorder#458588
• tab.activeForeground#3c3836
• tab.border#ebdbb2
• tab.inactiveBackground#f2e5bc
• tab.inactiveForeground#7a6d5a
• terminal.ansiBlue#076678
• terminal.ansiBrightBlack#928374
• terminal.ansiBrightBlue#458588
• terminal.ansiBrightCyan#689d6a
• terminal.ansiBrightGreen#98971a
• terminal.ansiBrightMagenta#b16286
• terminal.ansiBrightRed#cc241d
• terminal.ansiBrightWhite#fbf1c7
• terminal.ansiBrightYellow#d79921
• terminal.ansiCyan#427b58
• terminal.ansiGreen#79740e
• terminal.ansiMagenta#8f3f71
• terminal.ansiRed#9d0006
• terminal.ansiWhite#3c3836
• terminal.ansiYellow#b57614
• terminal.background#fbf1c7
• terminal.foreground#3c3836
• titleBar.activeBackground#f2e5bc
• titleBar.activeForeground#3c3836
• titleBar.inactiveBackground#ebdbb2
• titleBar.inactiveForeground#7a6d5a

tokenColors

TextMate scopes and font styles (syntax highlighting rules).