Claude Theme for VS Code

Color themes

• 

  Claude VSCode Dark Brand

• 

  Claude VSCode Dark Parchment

• 

  Claude VSCode Light Brand

• 

  Claude VSCode Light Parchment

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.background#1f1e1d
• activityBar.border#3e3e38
• activityBar.foreground#f1f1ef
• activityBar.inactiveForeground#52514a
• activityBarBadge.background#d97757
• activityBarBadge.foreground#141413
• badge.background#d97757
• badge.foreground#141413
• breadcrumb.activeSelectionForeground#d97757
• breadcrumb.focusForeground#f1f1ef
• breadcrumb.foreground#b7b5a9
• breadcrumbPicker.background#30302e
• button.background#d97757
• button.foreground#141413
• button.hoverBackground#B26842
• button.secondaryBackground#1a1915
• button.secondaryForeground#c3c0b6
• button.secondaryHoverBackground#3e3e38
• contrastBorder#00000000
• dropdown.background#30302e
• dropdown.border#3e3e38
• dropdown.foreground#f1f1ef
• editor.background#262624
• editor.findMatchBackground#d9775750
• editor.findMatchHighlightBackground#d9775730
• editor.foreground#f1f1ef
• editor.inactiveSelectionBackground#1a191580
• editor.lineHighlightBackground#2c2c2b
• editor.selectionBackground#2c84db50
• editor.selectionHighlightBackground#2c84db30
• editor.wordHighlightBackground#1b1b1980
• editorBracketMatch.background#2f2b4880
• editorBracketMatch.border#61AAF2
• editorCursor.foreground#d97757
• editorGroupHeader.tabsBackground#2c2c2b
• editorGutter.background#262624
• editorIndentGuide.activeBackground1#52514a
• editorIndentGuide.background1#3e3e38
• editorLineNumber.activeForeground#b7b5a9
• editorLineNumber.foreground#52514a
• editorOverviewRuler.border#3e3e38
• editorRuler.foreground#3e3e38
• editorWhitespace.foreground#3e3e38
• focusBorder#d97757
• gitDecoration.conflictingResourceForeground#61AAF2
• gitDecoration.deletedResourceForeground#B26842
• gitDecoration.ignoredResourceForeground#52514a
• gitDecoration.modifiedResourceForeground#d97757
• gitDecoration.untrackedResourceForeground#b7b5a9
• input.background#30302e
• input.border#52514a
• input.foreground#f1f1ef
• input.placeholderForeground#52514a
• inputOption.activeBackground#1a1915
• inputOption.activeBorder#d97757
• list.activeSelectionBackground#2c84db35
• list.activeSelectionForeground#f5f4ee
• list.dropBackground#2f2b48
• list.focusBackground#1a1915
• list.focusForeground#f5f4ee
• list.highlightForeground#2c84db
• list.hoverBackground#1b1b19
• list.hoverForeground#f1f1ef
• list.inactiveSelectionBackground#1b1b19
• list.inactiveSelectionForeground#c3c0b6
• notificationCenterHeader.background#2c2c2b
• notificationLink.foreground#d97757
• notifications.background#30302e
• notifications.border#3e3e38
• panel.background#2c2c2b
• panel.border#3e3e38
• panelTitle.activeBorder#d97757
• panelTitle.activeForeground#d97757
• panelTitle.inactiveForeground#b7b5a9
• progressBar.background#d97757
• quickInput.background#30302e
• quickInput.foreground#f1f1ef
• quickInputList.focusBackground#1a1915
• scrollbarSlider.activeBackground#52514a
• scrollbarSlider.background#3e3e3880
• scrollbarSlider.hoverBackground#52514a80
• selection.background#2c84db50
• sideBar.background#1f1e1d
• sideBar.border#3e3e38
• sideBar.foreground#c3c0b6
• sideBarSectionHeader.background#1b1b19
• sideBarSectionHeader.border#3e3e38
• sideBarSectionHeader.foreground#b7b5a9
• sideBarTitle.foreground#b7b5a9
• statusBar.background#1f1e1d
• statusBar.border#3e3e38
• statusBar.debuggingBackground#B26842
• statusBar.foreground#c3c0b6
• statusBar.noFolderBackground#52514a
• statusBarItem.activeBackground#3e3e38
• statusBarItem.hoverBackground#3e3e38
• statusBarItem.prominentBackground#d97757
• statusBarItem.prominentForeground#141413
• tab.activeBackground#262624
• tab.activeBorder#d97757
• tab.activeForeground#f1f1ef
• tab.border#3e3e38
• tab.hoverBackground#1a1915
• tab.inactiveBackground#1b1b19
• tab.inactiveForeground#b7b5a9
• tab.unfocusedActiveBackground#2c2c2b
• tab.unfocusedActiveForeground#b7b5a9
• terminal.ansiBlack#1b1b19
• terminal.ansiBlue#61AAF2
• terminal.ansiBrightBlack#52514a
• terminal.ansiBrightBlue#61AAF2
• terminal.ansiBrightCyan#b7b5a9
• terminal.ansiBrightGreen#c3c0b6
• terminal.ansiBrightMagenta#C3DDF7
• terminal.ansiBrightRed#B26842
• terminal.ansiBrightWhite#faf9f5
• terminal.ansiBrightYellow#d97757
• terminal.ansiCyan#c3c0b6
• terminal.ansiGreen#b7b5a9
• terminal.ansiMagenta#C3DDF7
• terminal.ansiRed#d97757
• terminal.ansiWhite#f1f1ef
• terminal.ansiYellow#B26842
• terminal.background#262624
• terminal.foreground#f1f1ef
• terminalCursor.foreground#d97757
• textLink.activeForeground#B26842
• textLink.foreground#d97757
• titleBar.activeBackground#1f1e1d
• titleBar.activeForeground#f1f1ef
• titleBar.border#3e3e38
• titleBar.inactiveBackground#262624
• titleBar.inactiveForeground#b7b5a9
• widget.shadow#1b1b19

tokenColors

TextMate scopes and font styles (syntax highlighting rules).