T3 Dark Theme
Publisher: kdinesh24Themes in package: 1
A custom dark theme
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#201b25
- breadcrumb.activeSelectionForeground#2b2430
- breadcrumb.background#201b25
- breadcrumb.foreground#2b2430
- button.background#e07aa4
- button.foreground#1a151f
- button.hoverBackground#cc93ca
- contrastBorder#2b2430
- dropdown.background#201b25
- dropdown.border#555555
- dropdown.foreground#E5E5E5
- editor.background#1a151f
- editor.foreground#E5E5E5
- editor.inactiveSelectionBackground#2c2732
- editor.lineHighlightBackground#2a2530
- editor.selectionBackground#a3004c
- editorCursor.foreground#FFFFFF
- editorGroup.border#2b2430
- editorGroupHeader.border#2b2430
- editorGroupHeader.noTabsBackground#201b25
- editorGroupHeader.tabsBackground#201b25
- editorHoverWidget.background#0b080b
- editorHoverWidget.border#1b1217
- editorHoverWidget.foreground#e7d0dd
- editorHoverWidget.statusBarBackground#201b25
- editorLineNumber.activeForeground#af99dd
- editorLineNumber.foreground#6a6572
- editorSuggestWidget.background#2a2530
- editorSuggestWidget.border#e07aa4
- editorSuggestWidget.foreground#E5E5E5
- errorForeground#e07aa4
- focusBorder#2b2430
- gitDecoration.modifiedResourceForeground#e07aa4
- infoForeground#9EE9F7
- input.background#2a2530
- input.border#2b2430
- input.foreground#E5E5E5
- list.activeSelectionBackground#362d3d
- list.activeSelectionForeground#FFFFFF
- list.errorForeground#ef4444
- list.focusAndSelectionOutline#362d3d
- list.hoverBackground#2a2530
- list.inactiveSelectionBackground#2c2732
- list.warningForeground#fef08a
- notificationCenter.border#555555
- notifications.background#201b25
- notifications.foreground#E5E5E5
- panel.background#201b25
- panel.border#2b2430
- quickInput.background#201b25
- quickInput.foreground#E5E5E5
- quickInputTitle.background#1a151f
- settings.checkboxBackground#201b25
- settings.checkboxBorder#2b2430
- settings.checkboxForeground#E5E5E5
- settings.dropdownBackground#201b25
- settings.dropdownBorder#2b2430
- settings.dropdownForeground#E5E5E5
- settings.focusedRowBackground#2a2530
- settings.headerForeground#E5E5E5
- settings.modifiedItemIndicator#e07aa4
- settings.numberInputBackground#2a2530
- settings.numberInputBorder#2b2430
- settings.numberInputForeground#E5E5E5
- settings.rowHoverBackground#2c2732
- settings.textInputBackground#2a2530
- settings.textInputBorder#2b2430
- settings.textInputForeground#E5E5E5
- sideBar.background#201b25
- statusBar.background#201b25
- tab.activeBackground#1a151f
- tab.activeBorder#1a151f
- tab.activeBorderTop#e07aa4
- tab.border#2b2430
- tab.inactiveBackground#201b25
- terminal.ansiBlack#201b25
- terminal.ansiBlue#9EE9F7
- terminal.ansiBrightBlack#6a6572
- terminal.ansiBrightBlue#bfdbfe
- terminal.ansiBrightCyan#a7f3d0
- terminal.ansiBrightGreen#a7f3d0
- terminal.ansiBrightMagenta#cc93ca
- terminal.ansiBrightRed#f87171
- terminal.ansiBrightWhite#ffffff
- terminal.ansiBrightYellow#fed7aa
- terminal.ansiCyan#8bc0ae
- terminal.ansiGreen#96d0bb
- terminal.ansiMagenta#e07aa4
- terminal.ansiRed#ef4444
- terminal.ansiWhite#E5E5E5
- terminal.ansiYellow#ffbc9e
- terminal.background#1a151f
- terminal.border#2b2430
- terminal.dropBackground#2a253080
- terminal.foreground#E5E5E5
- terminal.selectionBackground#a3004c
- terminalCursor.background#1a151f
- terminalCursor.foreground#e07aa4
- textLink.activeForeground#cc93ca
- textLink.foreground#e07aa4
- titleBar.activeBackground#201b25
- titleBar.border#2b2430
- titleBar.inactiveBackground#201b25
- warningForeground#ffbc9e
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment | #6a6572 | italic |
| string | #96d0bb | — |
| keyword | #e07aa4 | bold |
| variable.other, variable.parameter | #E5E5E5 | — |
| constant, support.constant | #e07aa4 | — |
| entity.name.function, support.function | #a692d3 | — |
| constant.numeric, constant.numeric.decimal, constant.numeric.integer | #ffbc9e | — |
| entity.name.type, support.type | #9EE9F7 | — |
| punctuation, punctuation.accessor, punctuation.separator, punctuation.terminator, punctuation.definition | #af99dd | — |
| keyword.operator, operator | #e07aa4 | — |
| storage.type.function, storage.modifier, storage.type.class, storage.type.interface, storage.type.enum | #e07aa4 | — |
| entity.name.type.class | #b5a3e0 | — |
| entity.name.type.interface | #8bc0ae | — |
| entity.name.tag.yaml | #e07aa4 | — |
| entity.name.type.enum | #8bc0ae | — |
| entity.name.method, variable.function | #a692d3 | — |
| support.class | #b5a3e0 | — |
| meta.object-literal.key | #9EE9F7 | — |
| keyword.control | #e07aa4 | bold |
| variable.language | #e07aa4 | italic |
| import, export | #e07aa4 | bold |
| variable.other.readwrite.alias | #E5E5E5 | — |
| variable.other.object, variable.other.property | #E5E5E5 | — |
| storage.modifier.import, storage.modifier.export | #e07aa4 | — |
| entity.name.tag.tsx, entity.name.tag.jsx | #d295cf | — |
| support.class.component.tsx, support.class.component.jsx | #9EE9F7 | — |
| source.css support.constant, meta.property-value.css constant, meta.property-value.css support.constant.property-value | #cc93ca | — |
| entity.other.attribute-name.tsx, entity.other.attribute-name.jsx, entity.other.attribute-name.html | #FFFFFF | — |
| source.css entity.other.attribute-name.pseudo-element, source.css entity.other.attribute-name.pseudo-class, source.css support.function.misc, meta.selector.css entity.other.pseudo-element.css | #af99dd | — |
| punctuation.definition.tag.begin.tsx, punctuation.definition.tag.end.tsx, punctuation.definition.tag.begin.jsx, punctuation.definition.tag.end.jsx, punctuation.definition.tag.html | #7a7482 | — |
| punctuation.definition.string.begin, punctuation.definition.string.end, punctuation.definition.string | #8bc0ae | — |
| meta.block.js, meta.block.ts, meta.block.tsx | — | — |
| entity.name.tag.html | #e07aa4 | — |
| source.css entity.name.tag | #d098cd | — |
| entity.other.attribute-name.html | #D19A66 | — |
| text.html.derivative.js entity.name.tag | #e07aa4 | — |
| source.css property-name | #9EE9F7 | — |
| source.css property-value | #8bc0ae | — |
| source.css selector.pseudo | #e07aa4 | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.id.css | #D19A66 | — |
| source.css support.type.property-name.css, source.css constant.other.color-value, source.css support.constant.color | #bbb0c9 | — |
| entity.name.function.tsx, entity.name.function.jsx | #b5a3e0 | — |
| variable.other.object.property.ts, entity.name.function.ts, support.function.module.ts | #9EE9F7 | — |
| variable.other.readwrite.ts, variable.other.constant.ts | #E5E5E5 | — |
| markup.heading, entity.name.section.markdown | #e07aa4 | bold |
| markup.bold | #E5E5E5 | bold |
| markup.italic | #E5E5E5 | italic |
| support.type.property-name.json, meta.structure.dictionary.key.json | #9EE9F7 | — |
| entity.name.tag.yaml | #e07aa4 | — |
| string.regexp, constant.other.character-class.regexp | #8bc0ae | — |
| keyword.operator.quantifier.regexp | #e07aa4 | — |
| string.template | #8bc0ae | — |
| punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end | #af99dd | — |