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#83a598
• activityBar.background#1d2021
• activityBar.foreground#ebdbb2
• activityBar.inactiveForeground#928374
• activityBarBadge.background#83a598
• activityBarBadge.foreground#282828
• badge.background#83a598
• badge.foreground#282828
• button.background#83a598
• button.foreground#282828
• button.hoverBackground#6b8c80
• editor.background#282828
• editor.findMatchBackground#d7992160
• editor.findMatchHighlightBackground#d7992130
• editor.foreground#ebdbb2
• editor.inactiveSelectionBackground#50494580
• editor.lineHighlightBackground#3c3836
• editor.selectionBackground#504945
• editorBracketMatch.background#83a59830
• editorBracketMatch.border#83a598
• editorCursor.foreground#ebdbb2
• editorGroupHeader.tabsBackground#1d2021
• editorGutter.addedBackground#98971a
• editorGutter.deletedBackground#cc241d
• editorGutter.modifiedBackground#d79921
• editorIndentGuide.activeBackground1#504945
• editorIndentGuide.background1#3c3836
• editorLineNumber.activeForeground#ebdbb2
• editorLineNumber.foreground#504945
• focusBorder#83a598
• input.background#1d2021
• input.border#3c3836
• input.foreground#ebdbb2
• list.activeSelectionBackground#3c3836
• list.activeSelectionForeground#ebdbb2
• list.highlightForeground#83a598
• list.hoverBackground#3c383680
• panel.background#1d2021
• panel.border#3c3836
• panelTitle.activeForeground#83a598
• panelTitle.inactiveForeground#504945
• scrollbarSlider.activeBackground#ebdbb260
• scrollbarSlider.background#ebdbb220
• scrollbarSlider.hoverBackground#ebdbb240
• sideBar.background#1d2021
• sideBar.foreground#ebdbb2
• sideBarSectionHeader.background#282828
• sideBarSectionHeader.foreground#ebdbb2
• statusBar.background#1d2021
• statusBar.foreground#ebdbb2
• tab.activeBackground#282828
• tab.activeBorder#83a598
• tab.activeForeground#ebdbb2
• tab.border#1d2021
• tab.inactiveBackground#1d2021
• tab.inactiveForeground#928374
• terminal.ansiBlue#458588
• terminal.ansiBrightBlack#928374
• terminal.ansiBrightBlue#83a598
• terminal.ansiBrightCyan#8ec07c
• terminal.ansiBrightGreen#b8bb26
• terminal.ansiBrightMagenta#d3869b
• terminal.ansiBrightRed#fb4934
• terminal.ansiBrightWhite#ebdbb2
• terminal.ansiBrightYellow#fabd2f
• terminal.ansiCyan#689d6a
• terminal.ansiGreen#98971a
• terminal.ansiMagenta#b16286
• terminal.ansiRed#cc241d
• terminal.ansiWhite#a89984
• terminal.ansiYellow#d79921
• terminal.background#282828
• terminal.foreground#ebdbb2
• titleBar.activeBackground#1d2021
• titleBar.activeForeground#ebdbb2
• titleBar.inactiveBackground#282828
• titleBar.inactiveForeground#928374

tokenColors

TextMate scopes and font styles (syntax highlighting rules).