Skip to main content
Coding Theme

Forest Coffee

Publisher: Forest Coffee ThemeThemes in package: 1

A VsCode theme that combines forest aesthetics with coffee!

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#262723
  • activityBar.border#3F423860
  • activityBar.foreground#CB997E
  • activityBarBadge.background#DDBEA9
  • activityBarBadge.foreground#3F4238
  • badge.background#3F423830
  • badge.foreground#B98B73
  • breadcrumb.activeSelectionForeground#B98B73
  • breadcrumb.background#3F4238
  • breadcrumb.focusForeground#CB997E
  • breadcrumb.foreground#CB997E
  • breadcrumbPicker.background#3F4238
  • button.background#B98B7350
  • contrastBorder#B98B7340
  • debugToolBar.background#3F4238
  • diffEditor.insertedTextBackground#B7B7A415
  • diffEditor.removedTextBackground#3F423820
  • dropdown.background#3F4238
  • dropdown.border#DDBEA910
  • editor.background#262723
  • editor.findMatchBackground#3F4238
  • editor.findMatchBorder#B98B73
  • editor.findMatchHighlightBackground#B98B7393
  • editor.findMatchHighlightBorder#DDBEA930
  • editor.foreground#CB997E
  • editor.lineHighlightBackground#3F423850
  • editor.selectionBackground#DDBEA930
  • editor.selectionHighlightBackground#B98B736b
  • editor.selectionHighlightBorder#DDBEA9f0
  • editorBracketMatch.background#3F4238
  • editorBracketMatch.border#D4C7B07f
  • editorCursor.foreground#D4C7B0
  • editorError.foreground#3F423870
  • editorGroup.border#3F423830
  • editorGroupHeader.tabsBackground#3F4238
  • editorGutter.addedBackground#B7B7A460
  • editorGutter.deletedBackground#3F423860
  • editorGutter.modifiedBackground#DDBEA960
  • editorHoverWidget.background#3F4238
  • editorHoverWidget.border#DDBEA910
  • editorIndentGuide.activeBackground1#A5A58D
  • editorIndentGuide.background1#A5A58D70
  • editorInfo.foreground#DDBEA970
  • editorLineNumber.activeForeground#DDBEA9
  • editorLineNumber.foreground#B98B73c0
  • editorLink.activeForeground#CB997E
  • editorMarkerNavigation.background#CB997E05
  • editorOverviewRuler.border#3F4238
  • editorOverviewRuler.errorForeground#3F423840
  • editorOverviewRuler.findMatchForeground#B98B7309
  • editorOverviewRuler.infoForeground#DDBEA940
  • editorOverviewRuler.warningForeground#D4C7B070
  • editorRuler.foreground#A5A58D
  • editorSuggestWidget.background#3F4238
  • editorSuggestWidget.border#DDBEA910
  • editorSuggestWidget.foreground#CB997E
  • editorSuggestWidget.highlightForeground#D4C7B0
  • editorSuggestWidget.selectedBackground#B98B7320
  • editorWarning.foreground#B7B7A4
  • editorWhitespace.foreground#CB997E40
  • editorWidget.background#3F4238
  • editorWidget.border#D4C7B0
  • editorWidget.resizeBorder#B98B73
  • extensionButton.prominentBackground#B7B7A490
  • extensionButton.prominentHoverBackground#3F4238
  • focusBorder#DDBEA900
  • gitDecoration.conflictingResourceForeground#D4C7B0
  • gitDecoration.deletedResourceForeground#3F4238
  • gitDecoration.ignoredResourceForeground#B98B73
  • gitDecoration.modifiedResourceForeground#CB997E
  • gitDecoration.untrackedResourceForeground#DDBEA9
  • input.background#6B705C
  • input.border#DDBEA910
  • input.foreground#CB997E
  • input.placeholderForeground#CB997E60
  • inputOption.activeBackground#CB997E30
  • inputOption.activeBorder#CB997E30
  • inputValidation.errorBorder#3F423850
  • inputValidation.infoBorder#DDBEA950
  • inputValidation.warningBorder#D4C7B050
  • list.activeSelectionBackground#3F4238
  • list.activeSelectionForeground#B98B73
  • list.focusBackground#6B705C
  • list.focusForeground#DDBEA9
  • list.highlightForeground#B98B73
  • list.hoverBackground#32342C
  • list.hoverForeground#DDBEA9
  • list.inactiveSelectionBackground#3F423830
  • list.inactiveSelectionForeground#B98B73
  • list.warningForeground#D4C7B0
  • listFilterWidget.background#3F423830
  • listFilterWidget.noMatchesOutline#3F423830
  • listFilterWidget.outline#3F423830
  • menu.background#2C2E27f8
  • menu.border#B98B7350
  • menu.foreground#CB997E
  • menu.selectionBackground#3F4238
  • menu.selectionBorder#3F423830
  • menu.selectionForeground#CB997E
  • menu.separatorBackground#CB997E
  • menubar.selectionBackground#6B705C
  • menubar.selectionBorder#B98B7350
  • menubar.selectionForeground#CB997E
  • minimap.background#3F4238
  • minimapGutter.addedBackground#3F4238
  • minimapGutter.deletedBackground#D4C7B0
  • minimapGutter.modifiedBackground#B7B7A4
  • minimapSlider.activeBackground#B7B7A4b0
  • minimapSlider.background#B7B7A480
  • minimapSlider.hoverBackground#B7B7A4a0
  • notificationLink.foreground#B98B73
  • notifications.background#3F4238
  • notifications.foreground#CB997E
  • panel.background#2C2E27
  • panel.border#3F423860
  • panelTitle.activeBorder#B98B73
  • panelTitle.activeForeground#DDBEA9
  • panelTitle.inactiveForeground#CB997E
  • peekView.border#3F423830
  • peekViewEditor.background#CB997E05
  • peekViewEditor.matchHighlightBackground#B98B7350
  • peekViewEditorGutter.background#CB997E05
  • peekViewResult.background#CB997E05
  • peekViewResult.matchHighlightBackground#B98B7350
  • peekViewResult.selectionBackground#B98B7370
  • peekViewTitle.background#CB997E05
  • peekViewTitleDescription.foreground#CB997E60
  • pickerGroup.foreground#B98B73
  • progressBar.background#B98B73
  • scrollbar.shadow#3F423800
  • scrollbarSlider.activeBackground#B98B73cc
  • scrollbarSlider.background#B98B73bb
  • scrollbarSlider.hoverBackground#B98B73ee
  • selection.background#B98B73
  • settings.checkboxBackground#3F4238
  • settings.checkboxForeground#CB997E
  • settings.dropdownBackground#3F4238
  • settings.dropdownForeground#CB997E
  • settings.headerForeground#B98B73
  • settings.modifiedItemIndicator#B98B73
  • settings.numberInputBackground#3F4238
  • settings.numberInputForeground#CB997E
  • settings.textInputBackground#3F4238
  • settings.textInputForeground#CB997E
  • sideBar.background#2C2E27
  • sideBar.border#B98B7350
  • sideBar.dropBackground#262723
  • sideBar.foreground#DDBEA9
  • sideBarSectionHeader.background#262723
  • sideBarSectionHeader.border#3F423860
  • sideBarSectionHeader.foreground#DDBEA9
  • sideBarTitle.background#262723
  • sideBarTitle.foreground#CB997E
  • statusBar.background#DDBEA9
  • statusBar.border#3F423860
  • statusBar.debuggingBackground#D4C7B0
  • statusBar.debuggingForeground#DDBEA9
  • statusBar.foreground#2C2E27
  • statusBar.noFolderBackground#2C2E27
  • statusBarItem.hoverBackground#B98B7320
  • statusBarItem.remoteBackground#B98B73
  • statusBarItem.remoteForeground#3F4238
  • tab.activeBackground#B98B7350
  • tab.activeBorder#B98B73
  • tab.activeForeground#DDBEA9
  • tab.activeModifiedBorder#B98B73
  • tab.border#3F4238
  • tab.inactiveBackground#B98B7320
  • tab.inactiveForeground#CB997Eaf
  • tab.unfocusedActiveBackground#B98B7340
  • tab.unfocusedActiveBorder#B98B73
  • tab.unfocusedActiveForeground#CB997E
  • tab.unfocusedInactiveBackground#B98B7310
  • tab.unfocusedInactiveForeground#CB997E7f
  • terminal.ansiBlack#3F4238
  • terminal.ansiBlue#DDBEA9
  • terminal.ansiBrightBlack#B98B73
  • terminal.ansiBrightBlue#DDBEA9
  • terminal.ansiBrightCyan#FFE8D6
  • terminal.ansiBrightGreen#B7B7A4
  • terminal.ansiBrightMagenta#D4C7B0
  • terminal.ansiBrightRed#3F4238
  • terminal.ansiBrightWhite#DDBEA9
  • terminal.ansiBrightYellow#D4C7B0
  • terminal.ansiCyan#FFE8D6
  • terminal.ansiGreen#B7B7A4
  • terminal.ansiMagenta#D4C7B0
  • terminal.ansiRed#3F4238
  • terminal.ansiWhite#DDBEA9
  • terminal.ansiYellow#D4C7B0
  • terminalCursor.background#3F4238
  • terminalCursor.foreground#D4C7B0
  • textLink.activeForeground#CB997E
  • textLink.foreground#B98B73
  • titleBar.activeBackground#262723
  • titleBar.activeForeground#CB997E
  • titleBar.border#3F423860
  • titleBar.inactiveBackground#262723
  • titleBar.inactiveForeground#B98B73
  • tree.indentGuidesStroke#A5A58D
  • widget.shadow#3F423830

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
variable, string constant.other.placeholder, invalid.deprecated, keyword, storage.type, storage.modifier#D4C7B0
variable, string constant.other.placeholder, entity.name.function, punctuation.definition.interpolation.end.bracket.curly.scss, punctuation.definition.interpolation.begin.bracket.curly.scssitalic
punctuation.definition.interpolation.end.bracket.curly.scss, punctuation.definition.interpolation.begin.bracket.curly.scss#B7B7A4
constant.other.php#D4C7B0
constant.other.color#DDBEA9
invalid, invalid.illegal#3F4238
Keyword, Storageitalic
keyword.control, constant.other.color, punctuation.definition.tag, punctuation, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution, entity.name.tag.reference.scss#A7A8AF
punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, entity.name.type.module.js#CB997E
keyword.control.at-rule, punctuation.terminator.rule.css, keyword.control.operator, punctuation.definition.entity.css, keyword.operator.assignment.js, punctuation.separator.comma.js, punctuation.definition.string.begin.js, punctuation.definition.string.end.js, punctuation.definition.binding-pattern.object.js#CB997E
punctuation.definition, string.quoted.single.scss#A7A8AF
keyword.controlbold
comment.line.scss, comment.line.double-slash.js, punctuation.definition.comment.scss, punctuation.definition.comment.js, punctuation.definition.comment.html, comment.block.html#6D6F7C
text.html.derivative#A7A8AF
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#CB997E
entity.name.tag.htmlbold
variable.parameter.js, variable.parameter.keyframe-list.css#D4C7B0
variable.other.object.js, storage.type.js, string.other.link.title.markdown, variable.other.readwrite.js, variable.other.property.js#CB997E
string, string.quoted.double.html, variable.other.constant.js, variable.other.object.property.js, string.quoted.double.json, markup.fenced_code.block.markdown, markup.inline.raw.string.markdown, variable.function, keyword.other.special-method, entity.name.function, markup.bold, markup.bold.markdown, markup.italic.markdown, meta.class-method.js entity.name.function.js, variable.function.constructor, entity.name.tag.other.html, entity.name.tag.block.any.html, source.sass keyword.control#DDBEA9
punctuation.definition.string.begin.html, punctuation.definition.string.end.html#FFE8D6
support.other.variable, string.other.link, markup.table#CB997E
constant.numeric, constant.language, constant.character, constant.escape, keyword.other.unit, keyword.other, punctuation.separator.key-value.html#D4C7B0
variable.parameter.function.language.special, variable.parameter#3F4238
constant.other.symbol, constant.other.key, entity.other.inherited-class, keyword.other.unit, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly, constant.other.object.key.js, string.unquoted.label.js#B7B7A4
entity.name, support.type, support.class, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types, entity.other.attribute-name.html#D4C7B0
support.type#B2CCD6
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name#CB997E
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#3F4238
entity.name.method.js, tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#DDBEA9italic
entity.other.attribute-name, support.function#D4C7B0
entity.other.attribute-name.id, entity.other.attribute-name.class, entity.other.attribute-name.pseudo-class, entity.name.tag.css, keyword.control.conditional.js, support.constant, entity.other.attribute-name.html, string.quoted.single.js, storage.type.function.js, meta.object-literal.key#CB997E
source.scss keyword.control#D4C7B0
markup.inserted#B7B7A4
markup.deleted#3F4238
markup.changed#D4C7B0
string.regexp#FFE8D6
constant.character.escape#FFE8D6
*url*, *link*, *uri*underline
source.js constant.other.object.key.js string.unquoted.label.js#CB997Eitalic
support.type.property-name.json#CB997E
text.html.markdown, punctuation.definition.list_item.markdown#CB997E
text.html.markdown markup.inline.raw.markdown#D4C7B0
text.html.markdown markup.inline.raw.markdown, punctuation.definition.raw.markdown#B98B7350
text.html.markdown meta.dummy.line-break
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown, entity.name.section.markdown#CB997Ebold
markup.underline#DDBEA9underline
markup.strike
markup.quote punctuation.definition.blockquote.markdown#B98B7350
markup.quoteitalic
string.other.link.description.title.markdown#D4C7B0
constant.other.reference.link.markdown#D4C7B0
markup.raw.block#D4C7B0
punctuation.definition.raw.markdown, punctuation.definition.markdown#FFE8D6
variable.language.fenced.markdown#B98B73
meta.separator#A7A8AFbold
token.info-token#B98B73
token.warn-token#D4C7B0
token.error-token#FF293B
token.debug-token#FFE8D6

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Forest Coffee - Coding Theme