TBFox Theme
Publisher: TristanMarkBarrowThemes in package: 2
A beautiful teal-based color theme for VS Code with both light and dark variants, inspired by modern web design
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.activeBorder#4dd4bf
- activityBar.background#0f1211
- activityBar.foreground#4dd4bf
- activityBarBadge.background#4dd4bf
- activityBarBadge.foreground#0f1211
- button.background#4dd4bf
- button.foreground#0f1211
- button.hoverBackground#7de4d1
- dropdown.background#1a201e
- dropdown.border#2a2f2d
- dropdown.foreground#e5e5e0
- editor.background#131615
- editor.foreground#e5e5e0
- editor.inactiveSelectionBackground#94a3b815
- editor.lineHighlightBackground#1a201e
- editor.selectionBackground#94a3b830
- editor.selectionHighlightBackground#94a3b815
- editorCursor.foreground#4dd4bf
- editorIndentGuide.activeBackground#4dd4bf
- editorIndentGuide.background#2a2f2d
- editorWhitespace.foreground#6b7280
- input.background#1a201e
- input.border#2a2f2d
- input.foreground#e5e5e0
- input.placeholderForeground#9a9a95
- list.activeSelectionBackground#94a3b825
- list.activeSelectionForeground#e5e5e0
- list.hoverBackground#1a201e
- list.hoverForeground#e5e5e0
- list.inactiveSelectionBackground#1a201e
- list.inactiveSelectionForeground#e5e5e0
- panel.background#0f1211
- panel.border#2a2f2d
- progressBar.background#4dd4bf
- scrollbarSlider.activeBackground#7de4d1
- scrollbarSlider.background#2a2f2d
- scrollbarSlider.hoverBackground#4dd4bf
- sideBar.background#0f1211
- sideBar.foreground#e5e5e0
- sideBarTitle.foreground#4dd4bf
- statusBar.background#1a201e
- statusBar.debuggingBackground#ea7a7a
- statusBar.foreground#4dd4bf
- tab.activeBackground#131615
- tab.activeForeground#e5e5e0
- tab.border#2a2f2d
- tab.inactiveBackground#1a201e
- tab.inactiveForeground#9a9a95
- terminal.ansiBlack#0f1211
- terminal.ansiBlue#6fa8d4
- terminal.ansiBrightBlack#6b7280
- terminal.ansiBrightBlue#95c2e7
- terminal.ansiBrightCyan#7de4d1
- terminal.ansiBrightGreen#9dd6b3
- terminal.ansiBrightMagenta#f2c199
- terminal.ansiBrightRed#f199a1
- terminal.ansiBrightWhite#f8f8f3
- terminal.ansiBrightYellow#f2d999
- terminal.ansiCyan#4dd4bf
- terminal.ansiGreen#7cc896
- terminal.ansiMagenta#e59a74
- terminal.ansiRed#ea7a7a
- terminal.ansiWhite#e5e5e0
- terminal.ansiYellow#e4c574
- terminal.background#131615
- terminal.foreground#e5e5e0
- titleBar.activeBackground#0f1211
- titleBar.activeForeground#e5e5e0
- titleBar.inactiveBackground#0f1211
- titleBar.inactiveForeground#9a9a95
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #7a8471 | italic |
| string, string.quoted, string.quoted.single, string.quoted.double, string.quoted.triple | #e59a74 | — |
| keyword, storage.type, storage.modifier | #6fa8d4 | — |
| entity.name.function, support.function, meta.function-call | #e4c574 | — |
| variable, variable.other | #e5e5e0 | — |
| constant.numeric, constant.numeric.integer, constant.numeric.float | #7cc896 | — |
| constant.language.boolean | #6fa8d4 | — |
| entity.name.class, support.class | #4dd4bf | — |
| entity.name.type, support.type | #4dd4bf | — |
| keyword.operator | #e5e5e0 | — |
| punctuation.definition, punctuation.separator, punctuation.terminator | #b8b8b0 | — |
| variable.other.property, support.variable.property | #6fa8d4 | — |
| entity.name.tag | #ea7a7a | — |
| entity.other.attribute-name | #7de4d1 | — |
| constant, constant.other | #4dd4bf | — |
| entity.name.namespace | #4dd4bf | — |
| meta.decorator, support.type.decorator | #e4c574 | — |
| invalid, invalid.illegal | #ea7a7a | — |
| invalid.deprecated | #e4c574 | — |
| markup.underline.link | #4dd4bf | — |
| markup.heading | #4dd4bf | — |
| markup.bold | #e5e5e0 | bold |
| markup.italic | #b8b8b0 | italic |
| keyword.control | #ea7a7a | — |
| support.type.property-name.css, meta.property-name.css | #6fa8d4 | — |
| support.constant.property-value.css, meta.property-value.css | #e59a74 | — |
| entity.name.tag.css, entity.other.attribute-name.class.css, entity.other.attribute-name.id.css | #ea7a7a | — |
| keyword.other.unit.css, constant.numeric.css | #e4c574 | — |
| support.function.css | #4dd4bf | — |
| entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css | #7de4d1 | — |