Charson Theme
Publisher: Richson SimbabureThemes in package: 2
Beautiful dark themes with inline diagnostics, semantic highlighting, and modern UI - Charson Dark & Charson Ember
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.background#0e0c09
- activityBar.border#1a1510
- activityBar.foreground#e87a20
- activityBar.inactiveForeground#5a4028
- activityBarBadge.background#e87a20
- activityBarBadge.foreground#0e0c09
- badge.background#3a2510
- badge.foreground#e87a20
- breadcrumb.activeSelectionForeground#e8d5b0
- breadcrumb.focusForeground#c87a30
- breadcrumb.foreground#7a5535
- breadcrumbPicker.background#0e0c09
- button.background#3a2510
- button.foreground#e87a20
- button.hoverBackground#4a3015
- button.secondaryBackground#1a1510
- button.secondaryForeground#7a6040
- button.secondaryHoverBackground#2a1e0e
- debugIcon.breakpointDisabledForeground#5a4028
- debugIcon.breakpointForeground#c04040
- debugIcon.breakpointUnverifiedForeground#b87a20
- debugIcon.continueForeground#5a8a5a
- debugIcon.disconnectForeground#c04040
- debugIcon.pauseForeground#7aafc4
- debugIcon.restartForeground#5a8a5a
- debugIcon.startForeground#5a8a5a
- debugIcon.stepBackForeground#7aafc4
- debugIcon.stepIntoForeground#7aafc4
- debugIcon.stepOutForeground#7aafc4
- debugIcon.stepOverForeground#7aafc4
- debugIcon.stopForeground#c04040
- debugToolBar.background#0e0c09
- descriptionForeground#7a6040
- diffEditor.insertedLineBackground#3a6a3a22
- diffEditor.insertedTextBackground#3a6a3a22
- diffEditor.removedLineBackground#8a303022
- diffEditor.removedTextBackground#8a303022
- dropdown.background#0e0c09
- dropdown.border#1a1510
- dropdown.foreground#b8a080
- dropdown.listBackground#0e0c09
- editor.background#13100d
- editor.findMatchBackground#b8620040
- editor.findMatchHighlightBackground#b8620020
- editor.foreground#c9b99a
- editor.hoverHighlightBackground#3a251030
- editor.inactiveSelectionBackground#3a251080
- editor.lineHighlightBackground#1a1510
- editor.lineHighlightBorder#00000000
- editor.rangeHighlightBackground#b8620010
- editor.selectionBackground#3a2510
- editor.selectionHighlightBackground#3a251030
- editor.wordHighlightBackground#3a251025
- editor.wordHighlightStrongBackground#4a300f30
- editorBracketHighlight.foreground1#e87a20
- editorBracketHighlight.foreground2#d4a060
- editorBracketHighlight.foreground3#7aafc4
- editorBracketHighlight.foreground4#c45a10
- editorBracketHighlight.foreground5#b8956a
- editorBracketHighlight.foreground6#ffcc55
- editorBracketHighlight.unexpectedBracket.foreground#c04040
- editorBracketMatch.background#e87a2020
- editorBracketMatch.border#e87a2080
- editorBracketPairGuide.activeBackground1#e87a2018
- editorBracketPairGuide.activeBackground2#d4a06018
- editorBracketPairGuide.activeBackground3#7aafc418
- editorBracketPairGuide.background1#e87a200a
- editorBracketPairGuide.background2#d4a0600a
- editorBracketPairGuide.background3#7aafc40a
- editorCodeLens.foreground#6a5535
- editorCursor.background#13100d
- editorCursor.foreground#e87a20
- editorError.background#8a353508
- editorError.foreground#8a3535
- editorGroup.border#1a1510
- editorGroupHeader.noTabsBackground#0e0c09
- editorGroupHeader.tabsBackground#0e0c09
- editorGutter.addedBackground#3a6a3a
- editorGutter.deletedBackground#8a3030
- editorGutter.modifiedBackground#b87a20
- editorHint.foreground#6a5535
- editorHoverWidget.background#100e0b
- editorHoverWidget.border#2a1e0e
- editorIndentGuide.activeBackground1#3a2510
- editorIndentGuide.activeBackground2#c45a1060
- editorIndentGuide.activeBackground3#7aafc460
- editorIndentGuide.background1#1a1510
- editorIndentGuide.background2#1a151080
- editorIndentGuide.background3#1a151060
- editorInfo.foreground#5a8a9a
- editorLightBulb.foreground#e87a20
- editorLightBulbAutoFix.foreground#d4a060
- editorLineNumber.activeForeground#e87a20
- editorLineNumber.foreground#5a4028
- editorOverviewRuler.addedForeground#3a6a3a60
- editorOverviewRuler.deletedForeground#8a303060
- editorOverviewRuler.errorForeground#c0404060
- editorOverviewRuler.findMatchForeground#e87a2060
- editorOverviewRuler.modifiedForeground#e87a2060
- editorOverviewRuler.selectionHighlightForeground#3a251060
- editorOverviewRuler.warningForeground#b87a2060
- editorRuler.foreground#1a1510
- editorSuggestWidget.background#100e0b
- editorSuggestWidget.border#2a1e0e
- editorSuggestWidget.foreground#b8a080
- editorSuggestWidget.highlightForeground#e87a20
- editorSuggestWidget.selectedBackground#2a1e0e
- editorWarning.foreground#b87a20
- editorWhitespace.foreground#1e1810
- editorWidget.background#0e0c09
- editorWidget.border#2a1e0e
- errorForeground#c04040
- focusBorder#e87a2050
- foreground#c9b99a
- gitDecoration.addedResourceForeground#5a8a5a
- gitDecoration.conflictingResourceForeground#8a5a4a
- gitDecoration.deletedResourceForeground#8a4a3a
- gitDecoration.ignoredResourceForeground#3a2c1a
- gitDecoration.modifiedResourceForeground#b87a20
- gitDecoration.stageDeletedResourceForeground#8a4a3a
- gitDecoration.stageModifiedResourceForeground#b87a20
- gitDecoration.untrackedResourceForeground#c45a10
- input.background#13100d
- input.border#1a1510
- input.foreground#c9b99a
- input.placeholderForeground#3a2c1a
- inputOption.activeBackground#2a1e0e60
- inputOption.activeBorder#e87a20
- inputOption.activeForeground#c9b99a
- inputValidation.errorBackground#c0404020
- inputValidation.errorBorder#c04040
- inputValidation.infoBackground#5a8a9a20
- inputValidation.infoBorder#5a8a9a
- inputValidation.warningBackground#b87a2020
- inputValidation.warningBorder#b87a20
- list.activeSelectionBackground#2a1e0e
- list.activeSelectionForeground#c9b99a
- list.errorForeground#8a4a3a
- list.focusBackground#2a1e0e80
- list.focusForeground#c9b99a
- list.highlightForeground#e87a20
- list.hoverBackground#1a150f
- list.hoverForeground#c9b99a
- list.inactiveSelectionBackground#1a1510
- list.inactiveSelectionForeground#c9b99a
- list.warningForeground#7a6030
- menu.background#0e0c09
- menu.foreground#c9b99a
- menu.selectionBackground#2a1e0e
- menu.selectionForeground#e8d5b0
- menu.separatorBackground#1a1510
- menubar.selectionBackground#2a1e0e
- menubar.selectionForeground#c9b99a
- minimap.background#0e0c09
- minimap.errorHighlight#c04040
- minimap.findMatchHighlight#e87a2060
- minimap.selectionHighlight#3a251080
- minimap.warningHighlight#b87a20
- minimapGutter.addedBackground#3a6a3a
- minimapGutter.deletedBackground#8a3030
- minimapGutter.modifiedBackground#b87a20
- notificationCenter.border#1a1510
- notificationCenterHeader.background#0e0c09
- notificationCenterHeader.foreground#7a6040
- notifications.background#13100d
- notifications.border#1a1510
- notifications.foreground#c9b99a
- notificationsErrorIcon.foreground#c04040
- notificationsInfoIcon.foreground#5a8a9a
- notificationsWarningIcon.foreground#b87a20
- notificationToast.border#3a2510
- panel.background#0e0c09
- panel.border#1a1510
- panelTitle.activeBorder#e87a20
- panelTitle.activeForeground#c45a10
- panelTitle.inactiveForeground#5a4028
- peekView.border#3a2510
- peekViewEditor.background#13100d
- peekViewEditor.matchHighlightBackground#e87a2025
- peekViewResult.background#0e0c09
- peekViewResult.fileForeground#c9b99a
- peekViewResult.lineForeground#7a6040
- peekViewResult.matchHighlightBackground#e87a2025
- peekViewResult.selectionBackground#2a1e0e
- peekViewResult.selectionForeground#c9b99a
- peekViewTitle.background#100e0b
- peekViewTitleDescription.foreground#7a6040
- peekViewTitleLabel.foreground#c45a10
- progressBar.background#e87a20
- quickInput.background#0e0c09
- quickInput.foreground#c9b99a
- quickInputList.focusBackground#2a1e0e
- quickInputList.focusForeground#c9b99a
- quickInputTitle.background#0e0c09
- scrollbar.shadow#00000080
- scrollbarSlider.activeBackground#e87a2030
- scrollbarSlider.background#2a1e0e50
- scrollbarSlider.hoverBackground#3a251060
- sideBar.background#100e0b
- sideBar.border#1a1510
- sideBar.foreground#9a8060
- sideBarSectionHeader.background#13100d
- sideBarSectionHeader.border#1a1510
- sideBarSectionHeader.foreground#5a4025
- sideBarTitle.foreground#7a6040
- statusBar.background#0f0d0a
- statusBar.border#1a1510
- statusBar.debuggingBackground#c45a10
- statusBar.debuggingForeground#0e0c09
- statusBar.foreground#b87040
- statusBar.noFolderBackground#0e0c09
- statusBar.noFolderForeground#5a4028
- statusBarItem.activeBackground#2a1e0e
- statusBarItem.errorBackground#8a303030
- statusBarItem.errorForeground#c04040
- statusBarItem.hoverBackground#2a1e0e
- statusBarItem.prominentBackground#2a1e0e
- statusBarItem.prominentHoverBackground#3a2510
- statusBarItem.remoteBackground#3a2510
- statusBarItem.remoteForeground#e87a20
- symbolIcon.arrayForeground#e87a20
- symbolIcon.booleanForeground#c45a10
- symbolIcon.classForeground#7aafc4
- symbolIcon.colorForeground#b8956a
- symbolIcon.constantForeground#d4a060
- symbolIcon.constructorForeground#e87a20
- symbolIcon.enumeratorForeground#c45a10
- symbolIcon.enumeratorMemberForeground#ffcc55
- symbolIcon.eventForeground#e87a20
- symbolIcon.fieldForeground#b8956a
- symbolIcon.fileForeground#9a8060
- symbolIcon.folderForeground#c87a30
- symbolIcon.functionForeground#d4a060
- symbolIcon.interfaceForeground#5a9ab5
- symbolIcon.keyForeground#b8956a
- symbolIcon.keywordForeground#e87a20
- symbolIcon.methodForeground#c49050
- symbolIcon.moduleForeground#6a8a9a
- symbolIcon.namespaceForeground#6a8a9a
- symbolIcon.nullForeground#c45a10
- symbolIcon.numberForeground#ffcc55
- symbolIcon.objectForeground#b8956a
- symbolIcon.operatorForeground#7a5535
- symbolIcon.packageForeground#6a8a9a
- symbolIcon.propertyForeground#b8956a
- symbolIcon.referenceForeground#7aafc4
- symbolIcon.snippetForeground#b8956a
- symbolIcon.stringForeground#c8a86a
- symbolIcon.structForeground#e87a20
- symbolIcon.textForeground#c9b99a
- symbolIcon.typeParameterForeground#4a8aa5
- symbolIcon.unitForeground#ffcc55
- symbolIcon.variableForeground#c9b99a
- tab.activeBackground#13100d
- tab.activeBorder#e87a20
- tab.activeBorderTop#00000000
- tab.activeForeground#e8d5b0
- tab.border#1a1510
- tab.hoverBackground#1a1510
- tab.hoverForeground#c9b99a
- tab.inactiveBackground#0e0c09
- tab.inactiveForeground#6a5030
- tab.unfocusedActiveBorder#5a3a18
- terminal.ansiBlack#13100d
- terminal.ansiBlue#4a7a9a
- terminal.ansiBrightBlack#3a2c1a
- terminal.ansiBrightBlue#5a8aaa
- terminal.ansiBrightCyan#5a9a9a
- terminal.ansiBrightGreen#6a9a6a
- terminal.ansiBrightMagenta#aa6a8a
- terminal.ansiBrightRed#c04040
- terminal.ansiBrightWhite#c9b99a
- terminal.ansiBrightYellow#e87a20
- terminal.ansiCyan#4a8a8a
- terminal.ansiGreen#5a8a5a
- terminal.ansiMagenta#8a5a7a
- terminal.ansiRed#b04040
- terminal.ansiWhite#b8a080
- terminal.ansiYellow#c48a30
- terminal.background#0e0c09
- terminal.cursorForeground#e87a20
- terminal.foreground#b8a080
- terminal.selectionBackground#3a251060
- terminalCursor.foreground#e87a20
- titleBar.activeBackground#0e0c09
- titleBar.activeForeground#b87a40
- titleBar.border#1a1510
- titleBar.inactiveBackground#0e0c09
- titleBar.inactiveForeground#5a4028
- tree.indentGuidesStroke#1a1510
- widget.shadow#00000080
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| Default text | #c9b99a | — |
| comment, punctuation.definition.comment | #6a5535 | italic |
| string, string.quoted, string.template, punctuation.definition.string | #c8a86a | — |
| string.quoted.docstring, string.documentation | #7aafc4 | — |
| string.template meta.embedded, punctuation.definition.template-expression, meta.template.expression | #e87a20 | — |
| constant.numeric | #ffcc55 | — |
| constant.language, constant.character, constant.other | #c45a10 | — |
| constant.language.boolean, constant.language.null, constant.language.undefined | #c45a10 | italic |
| variable, variable.other | #c9b99a | — |
| variable.language, variable.language.this, variable.language.self | #e87a20 | italic |
| variable.other.property, variable.other.object.property | #b8956a | — |
| variable.parameter, meta.function.parameters variable, meta.parameters variable | #9a7a4a | italic |
| keyword | #e87a20 | italic |
| keyword.control, keyword.control.flow, keyword.control.conditional, keyword.control.loop, keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as | #e87a20 | italic |
| keyword.operator, keyword.operator.logical, keyword.operator.comparison, keyword.operator.assignment | #7a5535 | — |
| keyword.operator.new | #c45a10 | italic |
| storage.type, storage.type.function, storage.type.class | #c45a10 | bold italic |
| storage.modifier | #b87a40 | italic |
| entity.name.function, meta.function entity.name.function | #d4a060 | bold |
| meta.function-call, support.function, meta.function-call entity.name.function | #d4a060 | — |
| entity.name.type, entity.name.class, support.type, support.class, entity.other.inherited-class, entity.name.type.interface | #7aafc4 | italic |
| meta.type.annotation entity.name.type, meta.type entity.name.type, meta.return.type, meta.type.parameters, support.type.primitive, storage.type.primitive | #5a9ab5 | italic |
| variable.other.constant | #d4a060 | bold |
| meta.object-literal.key, support.type.property-name, string.unquoted | #b8956a | — |
| meta.brace.curly, meta.brace.round, meta.brace.square, punctuation.section, punctuation.definition.block | #7a5535 | — |
| punctuation.separator, punctuation.accessor, meta.delimiter, punctuation.terminator | #5a4028 | — |
| entity.name.tag | #c45a10 | bold |
| punctuation.definition.tag | #e87a20 | — |
| entity.other.attribute-name | #9a7a4a | italic |
| entity.other.attribute-name.class.css, entity.name.tag.css, entity.other.attribute-name.id.css | #d4a060 | — |
| support.type.property-name.css, meta.property-name.css | #b8956a | — |
| support.constant.property-value.css, keyword.other.unit.css, constant.numeric.css | #ffcc55 | — |
| support.type.property-name.json, entity.name.tag.yaml, support.type.property-name.toml | #b8956a | — |
| string.regexp | #8a5a3a | — |
| constant.character.escape | #e87a20 | — |
| entity.name.function.decorator.python, meta.function.decorator.python | #e87a20 | italic |
| variable.parameter.function.language.special.self.python, variable.language.special.self.python | #e87a20 | italic bold |
| storage.type.type.ts, storage.type.type.tsx, storage.type.interface.ts, storage.type.interface.tsx | #b87a40 | italic |
| markup.heading, entity.name.section | #e87a20 | bold |
| markup.bold | #d4a060 | bold |
| markup.italic | #c8a86a | italic |
| markup.inline.raw, markup.fenced_code.block, markup.raw.inline | #b8956a | — |
| markup.underline.link | #7aafc4 | underline |
| markup.inserted, diff.inserted | #5a8a5a | — |
| markup.deleted, diff.deleted | #c04040 | — |
| markup.changed, diff.changed | #b87a20 | — |
| invalid | #c04040 | italic underline |
| invalid.deprecated | #7a5535 | italic underline |