Cereal Theme
Publisher: David KangThemes in package: 2
A simple light/dark theme
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#f3f2f1
- activityBar.background#f3f2f1
- activityBar.border#b5bec5
- activityBar.foreground#2c76e4
- activityBar.inactiveForeground#9eaca3
- activityBarBadge.background#2c76e4
- activityBarBadge.foreground#ffffff
- badge.background#2c76e4
- badge.foreground#ffffff
- button.background#2c76e4
- editor.background#fdfdfa
- editor.findMatchBackground#16c7e673
- editor.findMatchHighlightBackground#16c7e649
- editor.foreground#42454b
- editor.hoverHighlightBackground#b6b2a94d
- editor.inactiveSelectionBackground#b6b2a931
- editor.lineHighlightBackground#f8f6f4
- editor.lineHighlightBorder#f5f0f0
- editor.selectionBackground#b6b2a94d
- editor.selectionHighlightBackground#b6b2a941
- editor.wordHighlightBackground#b6b2a959
- editor.wordHighlightStrongBackground#16c7e644
- editorBracketMatch.background#a3a5a865
- editorBracketMatch.border#fdfdfa
- editorCursor.foreground#000000
- editorError.background#ff18ba1a
- editorError.foreground#e00169
- editorGroupHeader.tabsBackground#ebebe8
- editorGutter.addedBackground#cdd39a
- editorGutter.commentRangeForeground#ff0000
- editorGutter.deletedBackground#f37f20
- editorGutter.foldingControlForeground#2e2d2d
- editorGutter.modifiedBackground#7bc1f0
- editorHoverWidget.background#ffffff
- editorHoverWidget.border#b8b8b8
- editorIndentGuide.activeBackground#c2beb8
- editorIndentGuide.background#eeecec
- editorLineNumber.activeForeground#3c4a5e
- editorLineNumber.foreground#b4bbae
- editorWidget.background#ffffff
- editorWidget.border#b8b8b8
- focusBorder#2c76e4
- gitDecoration.conflictingResourceForeground#eb1366
- gitDecoration.modifiedResourceForeground#bd7b00
- gitDecoration.stageModifiedResourceForeground#18a0d6
- gitDecoration.untrackedResourceForeground#53910c
- input.background#f5f5f3
- input.border#b5b6c4
- input.foreground#42454b
- inputOption.activeBackground#2c76e4
- inputOption.activeForeground#ffffff
- inputOption.hoverBackground#dee0e4
- list.activeSelectionBackground#709fe7
- list.activeSelectionForeground#ffffff
- list.activeSelectionIconForeground#ffffff
- list.errorForeground#e00169
- list.focusHighlightForeground#ffffff
- list.highlightForeground#ffa011
- list.hoverBackground#1682e646
- list.hoverForeground#272727
- list.inactiveSelectionBackground#1682e627
- list.inactiveSelectionForeground#131313
- minimap.errorHighlight#e00169
- panel.border#81828d
- panelTitle.activeBorder#f3f2f1
- panelTitle.activeForeground#42454b
- peekView.border#42454b
- peekViewEditor.background#ffffff
- peekViewResult.background#ffffff
- peekViewTitle.background#9fa3aa
- peekViewTitleDescription.foreground#ffffff
- peekViewTitleLabel.foreground#ffffff
- scrollbarSlider.activeBackground#2c76e49f
- scrollbarSlider.background#2c76e43b
- scrollbarSlider.hoverBackground#2c76e459
- sideBar.background#f3f2f1
- sideBar.border#b5bec5
- sideBar.foreground#526263
- sideBarSectionHeader.background#f3f2f1
- sideBarSectionHeader.border#b5bec5
- sideBarSectionHeader.foreground#42454b
- sideBarTitle.foreground#42454b
- statusBar.background#f3f2f1
- statusBar.border#b5bec5
- statusBar.debuggingBackground#a572e0
- statusBar.debuggingForeground#ffffff
- statusBar.foreground#42454b
- statusBar.noFolderBackground#f3f2f1
- statusBarItem.errorBackground#ff0080
- statusBarItem.errorForeground#ffffff
- statusBarItem.warningBackground#ff6600
- statusBarItem.warningForeground#ffffff
- tab.activeBorderTop#0ca6ff
- tab.activeForeground#000000
- tab.border#ebebe8
- tab.hoverForeground#2c76e4
- tab.inactiveBackground#ebebe8
- tab.inactiveForeground#647779
- tree.indentGuidesStroke#d4d1c9
- widget.shadow#a4c3e5
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #a6b7ab | — |
| variable, namespace, entity.name.namespace | #42454b | — |
| keyword, entity | #618b31 | |
| string | #5d7696 | — |
| constant | #965d66 | — |
| constant.character.escape, constant.language.boolean, constant.language.true, constant.language.false | #618b31 | |
| storage, keyword.control.import, punctuation.definition.directive, keyword.control.directive | #b42a36 | |
| keyword.control, keyword.control.flow.python | #e28903 | |
| keyword.control.flow, keyword.control.return, keyword.control.break, keyword.control.throw, keyword.operator.new, keyword.operator.delete | #1e80b8 | |
| keyword.operator.assignment, punctuation.separator.key-value.html | #7a7771 | bold |
| keyword.operator, punctuation.accessor, punctuation.separator.period, punctuation.separator.pointer-access, punctuation.separator.dot-access, keyword.operator.assignment.compound, storage.modifier.pointer, storage.modifier.reference, storage.type.function.arrow | #d342a7 | bold |
| keyword.operator.ternary, keyword.operator.logical, keyword.operator.comparison, keyword.operator.bitwise, keyword.operator.and, keyword.operator.or, keyword.operator.not, keyword.operator.relational | #e28903 | bold |
| variable.function, entity.name.function | #555352 | bold |
| punctuation.section.block, meta.tag, constant.other.symbol, constant.other.key, constant.other.color, punctuation.definition.tag, punctuation.definition.block, punctuation.definition.dictionary, punctuation.separator.inheritance, keyword.other.template, keyword.other.substitution, keyword.operator.type.annotation, markup.raw.block | #b4afa7 | |
| invalid, message.error, punctuation.definition.deleted, markup.deleted | #e00169 | bold underline |
| meta.brace.round, constant.character.format.placeholder, punctuation.separator, punctuation.terminator, punctuation.section, punctuation.definition.list.begin.python, punctuation.definition.list.end.python, meta.brace.square, punctuation.definition.string | #7a7771 | |
| punctuation.definition.parameters, punctuation.definition.arguments, punctuation.section.arguments, punctuation.section.parameters, punctuation.definition.parameters.begin.ts, punctuation.definition.parameters.end.ts | #777371 | bold |
| markup.underline.link | #1e80b8 | |
| string.other.link.description, string.other.link.title | #e28903 | |
| markup.bold | #555352 | bold |
| markup.heading, markup.heading entity.name | #b42a36 | bold |
| markup.italic | — | italic |
| punctuation.definition.list | #e28903 | |
| markup.quote | #a6b7ab | — |
| markup.raw.block | #a6b7ab | — |
| markup.other | #618b31 | — |
| meta.separator, punctuation.definition.bold, punctuation.definition.italic, punctuation.definition.metadata, punctuation.definition.array, punctuation.support.type | #7a7771 | — |
| support.type.property-name | #42454b | — |
| constant.language.json | #e28903 | — |
| entity.name.tag | #618b31 | — |
| entity.other.attribute-name | #e28903 | — |