Kob Theme
Publisher: thekaroeThemes in package: 3
Three calm color themes for VS Code: Kob Dark, Kob Light and Kob Dim (a soft, low-contrast dark).
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#7fc8b8
- activityBar.background#232631
- activityBar.border#363a4b
- activityBar.foreground#d7dbe8
- activityBar.inactiveForeground#8f97ab
- activityBarBadge.background#7fc8b8
- activityBarBadge.foreground#1b2320
- badge.background#7fc8b8
- badge.foreground#1b2320
- breadcrumb.activeSelectionForeground#7fc8b8
- breadcrumb.focusForeground#d7dbe8
- breadcrumb.foreground#b2b8c9
- breadcrumbPicker.background#272a36
- button.background#7fc8b8
- button.foreground#1b2320
- button.hoverBackground#99d3c6
- button.secondaryBackground#3d4257
- button.secondaryForeground#d7dbe8
- button.secondaryHoverBackground#343849
- checkbox.background#232631
- checkbox.border#363a4b
- debugConsole.errorForeground#e08a9a
- debugConsole.infoForeground#8fa8dc
- debugConsole.warningForeground#d9c08a
- debugIcon.breakpointForeground#e08a9a
- debugToolBar.background#272a36
- descriptionForeground#b2b8c9
- diffEditor.diagonalFill#8f97ab4d
- diffEditor.insertedLineBackground#a3c48c17
- diffEditor.insertedTextBackground#a3c48c29
- diffEditor.removedLineBackground#e08a9a17
- diffEditor.removedTextBackground#e08a9a29
- disabledForeground#8f97ab
- dropdown.background#232631
- dropdown.border#363a4b
- dropdown.foreground#d7dbe8
- editor.background#2b2e3b
- editor.findMatchBackground#e0a07466
- editor.findMatchHighlightBackground#e0a07433
- editor.findRangeHighlightBackground#3d425780
- editor.foreground#d7dbe8
- editor.hoverHighlightBackground#8fa8dc26
- editor.inactiveSelectionBackground#7fc8b826
- editor.lineHighlightBackground#3d425773
- editor.lineHighlightBorder#00000000
- editor.rangeHighlightBackground#3d425780
- editor.selectionBackground#7fc8b847
- editor.selectionHighlightBackground#7fc8b829
- editor.wordHighlightBackground#8fa8dc2e
- editor.wordHighlightStrongBackground#b5a1dd38
- editorBracketHighlight.foreground1#d9c08a
- editorBracketHighlight.foreground2#b5a1dd
- editorBracketHighlight.foreground3#86c5cb
- editorBracketHighlight.foreground4#e0a074
- editorBracketHighlight.foreground5#a3c48c
- editorBracketHighlight.foreground6#8fa8dc
- editorBracketHighlight.unexpectedBracket.foreground#e08a9a
- editorBracketMatch.background#7fc8b82e
- editorBracketMatch.border#7fc8b899
- editorCursor.foreground#7fc8b8
- editorError.foreground#e08a9a
- editorGroup.border#363a4b
- editorGroupHeader.noTabsBackground#2b2e3b
- editorGroupHeader.tabsBackground#232631
- editorGroupHeader.tabsBorder#363a4b
- editorGutter.addedBackground#a3c48c
- editorGutter.background#2b2e3b
- editorGutter.deletedBackground#e08a9a
- editorGutter.modifiedBackground#8fa8dc
- editorHint.foreground#b2b8c9
- editorHoverWidget.background#272a36
- editorHoverWidget.border#363a4b
- editorHoverWidget.statusBarBackground#232631
- editorIndentGuide.activeBackground1#8f97ab99
- editorIndentGuide.background1#8f97ab40
- editorInfo.foreground#8fa8dc
- editorLineNumber.activeForeground#b2b8c9
- editorLineNumber.foreground#8f97ab
- editorLink.activeForeground#7fc8b8
- editorOverviewRuler.addedForeground#a3c48cb3
- editorOverviewRuler.border#00000000
- editorOverviewRuler.deletedForeground#e08a9ab3
- editorOverviewRuler.errorForeground#e08a9a
- editorOverviewRuler.infoForeground#8fa8dc
- editorOverviewRuler.modifiedForeground#8fa8dcb3
- editorOverviewRuler.warningForeground#d9c08a
- editorRuler.foreground#8f97ab4d
- editorSuggestWidget.background#272a36
- editorSuggestWidget.border#363a4b
- editorSuggestWidget.foreground#d7dbe8
- editorSuggestWidget.highlightForeground#7fc8b8
- editorSuggestWidget.selectedBackground#3d4257
- editorWarning.foreground#d9c08a
- editorWhitespace.foreground#8f97ab66
- editorWidget.background#272a36
- editorWidget.border#363a4b
- editorWidget.foreground#d7dbe8
- errorForeground#e08a9a
- focusBorder#7fc8b899
- foreground#d7dbe8
- gitDecoration.addedResourceForeground#a3c48c
- gitDecoration.conflictingResourceForeground#e0a074
- gitDecoration.deletedResourceForeground#e08a9a
- gitDecoration.ignoredResourceForeground#8f97ab
- gitDecoration.modifiedResourceForeground#8fa8dc
- gitDecoration.renamedResourceForeground#86c5cb
- gitDecoration.stageDeletedResourceForeground#e08a9a
- gitDecoration.stageModifiedResourceForeground#8fa8dc
- gitDecoration.submoduleResourceForeground#b5a1dd
- gitDecoration.untrackedResourceForeground#a3c48c
- icon.foreground#b2b8c9
- input.background#232631
- input.border#363a4b
- input.foreground#d7dbe8
- input.placeholderForeground#8f97ab
- inputOption.activeBackground#7fc8b840
- inputOption.activeBorder#7fc8b8
- inputOption.activeForeground#d7dbe8
- inputValidation.errorBackground#272a36
- inputValidation.errorBorder#e08a9a
- inputValidation.infoBackground#272a36
- inputValidation.infoBorder#8fa8dc
- inputValidation.warningBackground#272a36
- inputValidation.warningBorder#d9c08a
- list.activeSelectionBackground#3d4257
- list.activeSelectionForeground#d7dbe8
- list.dropBackground#7fc8b82e
- list.errorForeground#e08a9a
- list.focusBackground#3d4257
- list.focusOutline#7fc8b899
- list.highlightForeground#7fc8b8
- list.hoverBackground#343849
- list.hoverForeground#d7dbe8
- list.inactiveSelectionBackground#3d425799
- list.inactiveSelectionForeground#d7dbe8
- list.warningForeground#d9c08a
- menu.background#272a36
- menu.border#363a4b
- menu.foreground#d7dbe8
- menu.selectionBackground#3d4257
- menu.selectionForeground#d7dbe8
- menu.separatorBackground#363a4b
- menubar.selectionBackground#343849
- menubar.selectionForeground#d7dbe8
- minimap.background#2b2e3b
- minimap.errorHighlight#e08a9a
- minimap.findMatchHighlight#e0a07499
- minimap.selectionHighlight#7fc8b880
- minimap.warningHighlight#d9c08a
- minimapSlider.activeBackground#8f97ab59
- minimapSlider.background#8f97ab26
- minimapSlider.hoverBackground#8f97ab40
- notificationCenterHeader.background#232631
- notificationLink.foreground#7fc8b8
- notifications.background#272a36
- notifications.border#363a4b
- notifications.foreground#d7dbe8
- notificationsErrorIcon.foreground#e08a9a
- notificationsInfoIcon.foreground#8fa8dc
- notificationsWarningIcon.foreground#d9c08a
- panel.background#272a36
- panel.border#363a4b
- panelSectionHeader.background#272a36
- panelTitle.activeBorder#7fc8b8
- panelTitle.activeForeground#d7dbe8
- panelTitle.inactiveForeground#b2b8c9
- peekView.border#7fc8b8
- peekViewEditor.background#272a36
- peekViewEditorGutter.background#272a36
- peekViewResult.background#232631
- peekViewResult.matchHighlightBackground#e0a07459
- peekViewResult.selectionBackground#3d4257
- peekViewResult.selectionForeground#d7dbe8
- peekViewTitle.background#232631
- peekViewTitleDescription.foreground#b2b8c9
- peekViewTitleLabel.foreground#d7dbe8
- pickerGroup.border#363a4b
- pickerGroup.foreground#7fc8b8
- progressBar.background#7fc8b8
- quickInput.background#272a36
- quickInput.foreground#d7dbe8
- quickInputList.focusBackground#3d4257
- quickInputTitle.background#232631
- sash.hoverBorder#7fc8b8
- scrollbar.shadow#00000000
- scrollbarSlider.activeBackground#8f97ab99
- scrollbarSlider.background#8f97ab40
- scrollbarSlider.hoverBackground#8f97ab73
- selection.background#7fc8b859
- settings.checkboxBackground#232631
- settings.dropdownBackground#232631
- settings.headerForeground#d7dbe8
- settings.modifiedItemIndicator#7fc8b8
- settings.textInputBackground#232631
- sideBar.background#272a36
- sideBar.border#363a4b
- sideBar.foreground#b2b8c9
- sideBarSectionHeader.background#272a36
- sideBarSectionHeader.border#363a4b
- sideBarSectionHeader.foreground#d7dbe8
- sideBarTitle.foreground#d7dbe8
- statusBar.background#232631
- statusBar.border#363a4b
- statusBar.debuggingBackground#e0a074
- statusBar.debuggingForeground#1a1206
- statusBar.foreground#b2b8c9
- statusBar.noFolderBackground#232631
- statusBarItem.errorBackground#e08a9a
- statusBarItem.errorForeground#1a0b0f
- statusBarItem.hoverBackground#343849
- statusBarItem.prominentBackground#3d4257
- statusBarItem.remoteBackground#7fc8b8
- statusBarItem.remoteForeground#1b2320
- tab.activeBackground#2b2e3b
- tab.activeBorderTop#7fc8b8
- tab.activeForeground#d7dbe8
- tab.border#363a4b
- tab.hoverBackground#343849
- tab.inactiveBackground#232631
- tab.inactiveForeground#b2b8c9
- tab.lastPinnedBorder#363a4b
- tab.unfocusedActiveBorderTop#7fc8b866
- tab.unfocusedActiveForeground#b2b8c9
- tab.unfocusedInactiveForeground#8f97ab
- terminal.ansiBlack#3b4052
- terminal.ansiBlue#8fa8dc
- terminal.ansiBrightBlack#5b6378
- terminal.ansiBrightBlue#a5b9e3
- terminal.ansiBrightCyan#9ed1d5
- terminal.ansiBrightGreen#b5d0a3
- terminal.ansiBrightMagenta#c4b4e4
- terminal.ansiBrightRed#e6a1ae
- terminal.ansiBrightWhite#ffffff
- terminal.ansiBrightYellow#e1cda1
- terminal.ansiCyan#86c5cb
- terminal.ansiGreen#a3c48c
- terminal.ansiMagenta#b5a1dd
- terminal.ansiRed#e08a9a
- terminal.ansiWhite#c5c9d6
- terminal.ansiYellow#d9c08a
- terminal.background#272a36
- terminal.foreground#d7dbe8
- terminal.selectionBackground#7fc8b847
- terminalCursor.foreground#7fc8b8
- textBlockQuote.background#272a36
- textBlockQuote.border#7fc8b8
- textCodeBlock.background#272a36
- textLink.activeForeground#99d3c6
- textLink.foreground#7fc8b8
- textSeparator.foreground#363a4b
- titleBar.activeBackground#232631
- titleBar.activeForeground#bfe4dc
- titleBar.border#363a4b
- titleBar.inactiveBackground#232631
- titleBar.inactiveForeground#bfe4dc
- tree.indentGuidesStroke#8f97ab59
- widget.shadow#00000059
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #949bad | italic |
| string, string.template | #a3c48c | — |
| string.regexp | #e0a074 | — |
| constant.character.escape, constant.other.placeholder | #86c5cb | — |
| constant.numeric | #e0a074 | — |
| constant.language, support.constant, constant.other.caps | #e0a074 | — |
| constant.other.color | #e0a074 | — |
| variable | #d7dbe8 | — |
| variable.language, variable.parameter.function.language.special.self.python | #e08a9a | italic |
| variable.parameter, meta.function.parameters variable | #e0a074 | — |
| variable.other.property, variable.other.object.property, meta.object-literal.key | #86c5cb | — |
| variable.other.constant | #d9c08a | — |
| keyword, keyword.control, storage.type, storage.modifier | #b5a1dd | — |
| keyword.operator, keyword.operator.assignment, keyword.operator.arithmetic | #86c5cb | — |
| keyword.operator.new, keyword.operator.expression, keyword.operator.logical.python, keyword.operator.word | #b5a1dd | — |
| storage.type.function.arrow, keyword.operator.arrow | #86c5cb | — |
| punctuation, meta.brace, punctuation.separator, punctuation.terminator, punctuation.accessor | #b2b8c9 | — |
| punctuation.definition.template-expression | #b5a1dd | — |
| entity.name.function, support.function, meta.function-call.generic | #8fa8dc | — |
| entity.name.type, entity.name.class, entity.other.inherited-class, support.class, support.type, entity.name.namespace, entity.name.module | #d9c08a | — |
| support.type.primitive, support.type.builtin, storage.type.primitive | #86c5cb | — |
| meta.decorator, entity.name.function.decorator, punctuation.decorator | #d9c08a | — |
| entity.name.tag | #e08a9a | — |
| support.class.component | #d9c08a | — |
| punctuation.definition.tag | #b2b8c9 | — |
| entity.other.attribute-name | #e0a074 | italic |
| support.type.property-name.css | #86c5cb | — |
| support.constant.property-value.css, meta.property-value.css | #e0a074 | — |
| keyword.other.unit | #e0a074 | — |
| entity.other.attribute-name.class.css | #d9c08a | — |
| entity.other.attribute-name.id.css | #8fa8dc | — |
| entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css | #86c5cb | — |
| variable.css, variable.argument.css | #e08a9a | — |
| support.type.property-name.json | #8fa8dc | — |
| entity.name.tag.yaml | #8fa8dc | — |
| markup.heading, entity.name.section.markdown | #e08a9a | bold |
| markup.bold | #e0a074 | bold |
| markup.italic | #b5a1dd | italic |
| markup.inline.raw, markup.fenced_code, markup.raw | #a3c48c | — |
| markup.underline.link, string.other.link | #8fa8dc | — |
| markup.quote | #949bad | italic |
| punctuation.definition.list.begin.markdown, beginning.punctuation.definition.list.markdown | #e08a9a | — |
| markup.inserted | #a3c48c | — |
| markup.deleted | #e08a9a | — |
| markup.changed | #d9c08a | — |
| invalid | #e08a9a | underline |
| invalid.deprecated | #949bad | strikethrough |