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#4fd6be
- activityBar.background#12141a
- activityBar.border#262a35
- activityBar.foreground#e3e7f1
- activityBar.inactiveForeground#7f8aa3
- activityBarBadge.background#4fd6be
- activityBarBadge.foreground#0d1614
- badge.background#4fd6be
- badge.foreground#0d1614
- breadcrumb.activeSelectionForeground#4fd6be
- breadcrumb.focusForeground#e3e7f1
- breadcrumb.foreground#a9b3c7
- breadcrumbPicker.background#1b1e26
- button.background#4fd6be
- button.foreground#0d1614
- button.hoverBackground#72decb
- button.secondaryBackground#2a3040
- button.secondaryForeground#e3e7f1
- button.secondaryHoverBackground#232732
- checkbox.background#12141a
- checkbox.border#262a35
- debugConsole.errorForeground#f7768e
- debugConsole.infoForeground#7aa2f7
- debugConsole.warningForeground#e5c07b
- debugIcon.breakpointForeground#f7768e
- debugToolBar.background#1b1e26
- descriptionForeground#a9b3c7
- diffEditor.diagonalFill#7f8aa34d
- diffEditor.insertedLineBackground#9ece6a17
- diffEditor.insertedTextBackground#9ece6a29
- diffEditor.removedLineBackground#f7768e17
- diffEditor.removedTextBackground#f7768e29
- disabledForeground#7f8aa3
- dropdown.background#12141a
- dropdown.border#262a35
- dropdown.foreground#e3e7f1
- editor.background#16181f
- editor.findMatchBackground#ff9e6466
- editor.findMatchHighlightBackground#ff9e6433
- editor.findRangeHighlightBackground#2a304080
- editor.foreground#e3e7f1
- editor.hoverHighlightBackground#7aa2f726
- editor.inactiveSelectionBackground#4fd6be26
- editor.lineHighlightBackground#2a304073
- editor.lineHighlightBorder#00000000
- editor.rangeHighlightBackground#2a304080
- editor.selectionBackground#4fd6be47
- editor.selectionHighlightBackground#4fd6be29
- editor.wordHighlightBackground#7aa2f72e
- editor.wordHighlightStrongBackground#bb9af738
- editorBracketHighlight.foreground1#e5c07b
- editorBracketHighlight.foreground2#bb9af7
- editorBracketHighlight.foreground3#56d4dd
- editorBracketHighlight.foreground4#ff9e64
- editorBracketHighlight.foreground5#9ece6a
- editorBracketHighlight.foreground6#7aa2f7
- editorBracketHighlight.unexpectedBracket.foreground#f7768e
- editorBracketMatch.background#4fd6be2e
- editorBracketMatch.border#4fd6be99
- editorCursor.foreground#4fd6be
- editorError.foreground#f7768e
- editorGroup.border#262a35
- editorGroupHeader.noTabsBackground#16181f
- editorGroupHeader.tabsBackground#12141a
- editorGroupHeader.tabsBorder#262a35
- editorGutter.addedBackground#9ece6a
- editorGutter.background#16181f
- editorGutter.deletedBackground#f7768e
- editorGutter.modifiedBackground#7aa2f7
- editorHint.foreground#a9b3c7
- editorHoverWidget.background#1b1e26
- editorHoverWidget.border#262a35
- editorHoverWidget.statusBarBackground#12141a
- editorIndentGuide.activeBackground1#7f8aa399
- editorIndentGuide.background1#7f8aa340
- editorInfo.foreground#7aa2f7
- editorLineNumber.activeForeground#a9b3c7
- editorLineNumber.foreground#7f8aa3
- editorLink.activeForeground#4fd6be
- editorOverviewRuler.addedForeground#9ece6ab3
- editorOverviewRuler.border#00000000
- editorOverviewRuler.deletedForeground#f7768eb3
- editorOverviewRuler.errorForeground#f7768e
- editorOverviewRuler.infoForeground#7aa2f7
- editorOverviewRuler.modifiedForeground#7aa2f7b3
- editorOverviewRuler.warningForeground#e5c07b
- editorRuler.foreground#7f8aa34d
- editorSuggestWidget.background#1b1e26
- editorSuggestWidget.border#262a35
- editorSuggestWidget.foreground#e3e7f1
- editorSuggestWidget.highlightForeground#4fd6be
- editorSuggestWidget.selectedBackground#2a3040
- editorWarning.foreground#e5c07b
- editorWhitespace.foreground#7f8aa366
- editorWidget.background#1b1e26
- editorWidget.border#262a35
- editorWidget.foreground#e3e7f1
- errorForeground#f7768e
- focusBorder#4fd6be99
- foreground#e3e7f1
- gitDecoration.addedResourceForeground#9ece6a
- gitDecoration.conflictingResourceForeground#ff9e64
- gitDecoration.deletedResourceForeground#f7768e
- gitDecoration.ignoredResourceForeground#7f8aa3
- gitDecoration.modifiedResourceForeground#7aa2f7
- gitDecoration.renamedResourceForeground#56d4dd
- gitDecoration.stageDeletedResourceForeground#f7768e
- gitDecoration.stageModifiedResourceForeground#7aa2f7
- gitDecoration.submoduleResourceForeground#bb9af7
- gitDecoration.untrackedResourceForeground#9ece6a
- icon.foreground#a9b3c7
- input.background#12141a
- input.border#262a35
- input.foreground#e3e7f1
- input.placeholderForeground#7f8aa3
- inputOption.activeBackground#4fd6be40
- inputOption.activeBorder#4fd6be
- inputOption.activeForeground#e3e7f1
- inputValidation.errorBackground#1b1e26
- inputValidation.errorBorder#f7768e
- inputValidation.infoBackground#1b1e26
- inputValidation.infoBorder#7aa2f7
- inputValidation.warningBackground#1b1e26
- inputValidation.warningBorder#e5c07b
- list.activeSelectionBackground#2a3040
- list.activeSelectionForeground#e3e7f1
- list.dropBackground#4fd6be2e
- list.errorForeground#f7768e
- list.focusBackground#2a3040
- list.focusOutline#4fd6be99
- list.highlightForeground#4fd6be
- list.hoverBackground#232732
- list.hoverForeground#e3e7f1
- list.inactiveSelectionBackground#2a304099
- list.inactiveSelectionForeground#e3e7f1
- list.warningForeground#e5c07b
- menu.background#1b1e26
- menu.border#262a35
- menu.foreground#e3e7f1
- menu.selectionBackground#2a3040
- menu.selectionForeground#e3e7f1
- menu.separatorBackground#262a35
- menubar.selectionBackground#232732
- menubar.selectionForeground#e3e7f1
- minimap.background#16181f
- minimap.errorHighlight#f7768e
- minimap.findMatchHighlight#ff9e6499
- minimap.selectionHighlight#4fd6be80
- minimap.warningHighlight#e5c07b
- minimapSlider.activeBackground#7f8aa359
- minimapSlider.background#7f8aa326
- minimapSlider.hoverBackground#7f8aa340
- notificationCenterHeader.background#12141a
- notificationLink.foreground#4fd6be
- notifications.background#1b1e26
- notifications.border#262a35
- notifications.foreground#e3e7f1
- notificationsErrorIcon.foreground#f7768e
- notificationsInfoIcon.foreground#7aa2f7
- notificationsWarningIcon.foreground#e5c07b
- panel.background#1b1e26
- panel.border#262a35
- panelSectionHeader.background#1b1e26
- panelTitle.activeBorder#4fd6be
- panelTitle.activeForeground#e3e7f1
- panelTitle.inactiveForeground#a9b3c7
- peekView.border#4fd6be
- peekViewEditor.background#1b1e26
- peekViewEditorGutter.background#1b1e26
- peekViewResult.background#12141a
- peekViewResult.matchHighlightBackground#ff9e6459
- peekViewResult.selectionBackground#2a3040
- peekViewResult.selectionForeground#e3e7f1
- peekViewTitle.background#12141a
- peekViewTitleDescription.foreground#a9b3c7
- peekViewTitleLabel.foreground#e3e7f1
- pickerGroup.border#262a35
- pickerGroup.foreground#4fd6be
- progressBar.background#4fd6be
- quickInput.background#1b1e26
- quickInput.foreground#e3e7f1
- quickInputList.focusBackground#2a3040
- quickInputTitle.background#12141a
- sash.hoverBorder#4fd6be
- scrollbar.shadow#00000000
- scrollbarSlider.activeBackground#7f8aa399
- scrollbarSlider.background#7f8aa340
- scrollbarSlider.hoverBackground#7f8aa373
- selection.background#4fd6be59
- settings.checkboxBackground#12141a
- settings.dropdownBackground#12141a
- settings.headerForeground#e3e7f1
- settings.modifiedItemIndicator#4fd6be
- settings.textInputBackground#12141a
- sideBar.background#1b1e26
- sideBar.border#262a35
- sideBar.foreground#a9b3c7
- sideBarSectionHeader.background#1b1e26
- sideBarSectionHeader.border#262a35
- sideBarSectionHeader.foreground#e3e7f1
- sideBarTitle.foreground#e3e7f1
- statusBar.background#12141a
- statusBar.border#262a35
- statusBar.debuggingBackground#ff9e64
- statusBar.debuggingForeground#1a1206
- statusBar.foreground#a9b3c7
- statusBar.noFolderBackground#12141a
- statusBarItem.errorBackground#f7768e
- statusBarItem.errorForeground#1a0b0f
- statusBarItem.hoverBackground#232732
- statusBarItem.prominentBackground#2a3040
- statusBarItem.remoteBackground#4fd6be
- statusBarItem.remoteForeground#0d1614
- tab.activeBackground#16181f
- tab.activeBorderTop#4fd6be
- tab.activeForeground#e3e7f1
- tab.border#262a35
- tab.hoverBackground#232732
- tab.inactiveBackground#12141a
- tab.inactiveForeground#a9b3c7
- tab.lastPinnedBorder#262a35
- tab.unfocusedActiveBorderTop#4fd6be66
- tab.unfocusedActiveForeground#a9b3c7
- tab.unfocusedInactiveForeground#7f8aa3
- terminal.ansiBlack#3b4052
- terminal.ansiBlue#7aa2f7
- terminal.ansiBrightBlack#5b6378
- terminal.ansiBrightBlue#95b5f9
- terminal.ansiBrightCyan#78dde4
- terminal.ansiBrightGreen#b1d888
- terminal.ansiBrightMagenta#c9aef9
- terminal.ansiBrightRed#f991a5
- terminal.ansiBrightWhite#ffffff
- terminal.ansiBrightYellow#eacd95
- terminal.ansiCyan#56d4dd
- terminal.ansiGreen#9ece6a
- terminal.ansiMagenta#bb9af7
- terminal.ansiRed#f7768e
- terminal.ansiWhite#c5c9d6
- terminal.ansiYellow#e5c07b
- terminal.background#1b1e26
- terminal.foreground#e3e7f1
- terminal.selectionBackground#4fd6be47
- terminalCursor.foreground#4fd6be
- textBlockQuote.background#1b1e26
- textBlockQuote.border#4fd6be
- textCodeBlock.background#1b1e26
- textLink.activeForeground#72decb
- textLink.foreground#4fd6be
- textSeparator.foreground#262a35
- titleBar.activeBackground#12141a
- titleBar.activeForeground#a7ebdf
- titleBar.border#262a35
- titleBar.inactiveBackground#12141a
- titleBar.inactiveForeground#a7ebdf
- tree.indentGuidesStroke#7f8aa359
- widget.shadow#00000059
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #8590ad | italic |
| string, string.template | #9ece6a | — |
| string.regexp | #ff9e64 | — |
| constant.character.escape, constant.other.placeholder | #56d4dd | — |
| constant.numeric | #ff9e64 | — |
| constant.language, support.constant, constant.other.caps | #ff9e64 | — |
| constant.other.color | #ff9e64 | — |
| variable | #e3e7f1 | — |
| variable.language, variable.parameter.function.language.special.self.python | #f7768e | italic |
| variable.parameter, meta.function.parameters variable | #ff9e64 | — |
| variable.other.property, variable.other.object.property, meta.object-literal.key | #56d4dd | — |
| variable.other.constant | #e5c07b | — |
| keyword, keyword.control, storage.type, storage.modifier | #bb9af7 | — |
| keyword.operator, keyword.operator.assignment, keyword.operator.arithmetic | #56d4dd | — |
| keyword.operator.new, keyword.operator.expression, keyword.operator.logical.python, keyword.operator.word | #bb9af7 | — |
| storage.type.function.arrow, keyword.operator.arrow | #56d4dd | — |
| punctuation, meta.brace, punctuation.separator, punctuation.terminator, punctuation.accessor | #a9b3c7 | — |
| punctuation.definition.template-expression | #bb9af7 | — |
| entity.name.function, support.function, meta.function-call.generic | #7aa2f7 | — |
| entity.name.type, entity.name.class, entity.other.inherited-class, support.class, support.type, entity.name.namespace, entity.name.module | #e5c07b | — |
| support.type.primitive, support.type.builtin, storage.type.primitive | #56d4dd | — |
| meta.decorator, entity.name.function.decorator, punctuation.decorator | #e5c07b | — |
| entity.name.tag | #f7768e | — |
| support.class.component | #e5c07b | — |
| punctuation.definition.tag | #a9b3c7 | — |
| entity.other.attribute-name | #ff9e64 | italic |
| support.type.property-name.css | #56d4dd | — |
| support.constant.property-value.css, meta.property-value.css | #ff9e64 | — |
| keyword.other.unit | #ff9e64 | — |
| entity.other.attribute-name.class.css | #e5c07b | — |
| entity.other.attribute-name.id.css | #7aa2f7 | — |
| entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css | #56d4dd | — |
| variable.css, variable.argument.css | #f7768e | — |
| support.type.property-name.json | #7aa2f7 | — |
| entity.name.tag.yaml | #7aa2f7 | — |
| markup.heading, entity.name.section.markdown | #f7768e | bold |
| markup.bold | #ff9e64 | bold |
| markup.italic | #bb9af7 | italic |
| markup.inline.raw, markup.fenced_code, markup.raw | #9ece6a | — |
| markup.underline.link, string.other.link | #7aa2f7 | — |
| markup.quote | #8590ad | italic |
| punctuation.definition.list.begin.markdown, beginning.punctuation.definition.list.markdown | #f7768e | — |
| markup.inserted | #9ece6a | — |
| markup.deleted | #f7768e | — |
| markup.changed | #e5c07b | — |
| invalid | #f7768e | underline |
| invalid.deprecated | #8590ad | strikethrough |