Notion Like Theme (Light)
Publisher: TARA6Themes in package: 1
One Light Theme like Notion
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.activeBackground#ffffff00
- activityBar.background#f7f7f5
- activityBar.border#dededc
- activityBar.foreground#37352f
- activityBar.inactiveForeground#777572
- activityBarBadge.background#f04842
- activityBarBadge.foreground#ffffff
- badge.background#f04842
- badge.foreground#ffffff
- breadcrumb.background#ffffff
- breadcrumb.focusForeground#37352f
- breadcrumb.foreground#55534e
- button.background#f7f7f5
- button.border#dededc
- button.foreground#37352f
- button.hoverBackground#e8e8e6
- button.secondaryBackground#55534e
- button.secondaryForeground#ffffff
- button.secondaryHoverBackground#37352f
- debugToolBar.background#f7f7f5
- debugToolBar.border#dededc
- diffEditor.border#dededc
- diffEditor.insertedTextBackground#e5fee9dd
- diffEditor.insertedTextBorder#ffffff00
- diffEditor.removedTextBackground#ffe1d5dd
- diffEditor.removedTextBorder#ffffff00
- editor.background#ffffff
- editor.findMatchBackground#f2b82833
- editor.findMatchBorder#ffffff00
- editor.findMatchHighlightBackground#f2b82833
- editor.findMatchHighlightBorder#f2b82899
- editor.findRangeHighlightBackground#ee000d33
- editor.findRangeHighlightBorder#ee000d99
- editor.foldBackground#eafbffdd
- editor.hoverHighlightBackground#f2b82833
- editor.inactiveSelectionBackground#e7f3f899
- editor.lineHighlightBackground#e8e8e6
- editor.lineHighlightBorder#ffffff00
- editor.rangeHighlightBackground#f2b82833
- editor.rangeHighlightBorder#f9e6b1
- editor.selectionBackground#eafbff
- editor.selectionHighlightBackground#eafbff99
- editor.selectionHighlightBorder#ffffff00
- editor.wordHighlightBackground#ee000d33
- editor.wordHighlightBorder#f9a3a8
- editor.wordHighlightStrongBackground#ee000d33
- editor.wordHighlightStrongBorder#ffffff00
- editorBracketHighlight.foreground1#d44c47
- editorBracketHighlight.foreground2#337ea9
- editorBracketHighlight.foreground3#448361
- editorBracketHighlight.foreground4#cb912f
- editorBracketHighlight.foreground5#9065b0
- editorBracketHighlight.foreground6#d9730d
- editorBracketMatch.background#ffffff00
- editorBracketMatch.border#777572
- editorCodeLens.foreground#37352f
- editorCursor.background#ffffff
- editorCursor.foreground#37352f
- editorError.background#ffffff00
- editorError.border#ffffff00
- editorError.foreground#ee000d
- editorGroup.border#dededc
- editorGroupHeader.border#ffffff00
- editorGroupHeader.tabsBackground#f7f7f5
- editorGroupHeader.tabsBorder#dededc
- editorGutter.addedBackground#5ecc0c
- editorGutter.background#ffffff
- editorGutter.deletedBackground#ee000d
- editorGutter.foldingControlForeground#37352f
- editorGutter.modifiedBackground#f2b828
- editorHint.border#ffffff00
- editorHint.foreground#48ca80
- editorHoverWidget.background#f7f7f5
- editorHoverWidget.border#dededc
- editorHoverWidget.foreground#37352f
- editorIndentGuide.activeBackground1#d44c47
- editorIndentGuide.activeBackground2#337ea9
- editorIndentGuide.activeBackground3#448361
- editorIndentGuide.activeBackground4#cb912f
- editorIndentGuide.activeBackground5#9065b0
- editorIndentGuide.activeBackground6#d9730d
- editorIndentGuide.background1#777572
- editorIndentGuide.background2#777572
- editorIndentGuide.background3#777572
- editorIndentGuide.background4#777572
- editorIndentGuide.background5#777572
- editorIndentGuide.background6#777572
- editorInfo.background#ffffff00
- editorInfo.border#ffffff00
- editorInfo.foreground#32a5e4
- editorLineNumber.activeForeground#37352f
- editorLineNumber.foreground#777572
- editorLink.activeForeground#4c6cc5
- editorMarkerNavigation.background#ffffff
- editorMarkerNavigationError.background#ee000d
- editorMarkerNavigationInfo.background#32a5e4
- editorMarkerNavigationWarning.background#f2b828
- editorOverviewRuler.background#ffffff
- editorOverviewRuler.border#ffffff00
- editorRuler.foreground#ffffff00
- editorSuggestWidget.background#f7f7f5
- editorSuggestWidget.border#dededc
- editorSuggestWidget.foreground#37352f
- editorSuggestWidget.highlightForeground#4c6cc5
- editorSuggestWidget.selectedBackground#eafbff
- editorWarning.background#ffffff00
- editorWarning.border#ffffff00
- editorWarning.foreground#f2b828
- editorWhitespace.foreground#777572
- editorWidget.foreground#37352f
- editorWidget.resizeBorder#777572
- focusBorder#dededc
- foreground#37352f
- gitDecoration.addedResourceForeground#5ecc0c
- gitDecoration.conflictingResourceForeground#7733d2
- gitDecoration.deletedResourceForeground#ee000d
- gitDecoration.ignoredResourceForeground#a6a299
- gitDecoration.modifiedResourceForeground#d09300
- gitDecoration.renamedResourceForeground#f2b828
- gitDecoration.stageDeletedResourceForeground#ee000d
- gitDecoration.stageModifiedResourceForeground#d09300
- gitDecoration.submoduleResourceForeground#4c6cc5
- gitDecoration.untrackedResourceForeground#007b28
- input.background#ffffff
- input.border#dededc
- input.foreground#37352f
- input.placeholderForeground#777572
- inputOption.activeBackground#f7f7f5
- inputOption.activeBorder#dededc
- inputOption.activeForeground#37352f
- list.activeSelectionBackground#e6e6e3
- list.activeSelectionForeground#37352f
- list.dropBackground#eafbff
- list.focusBackground#eafbff
- list.focusForeground#37352f
- list.highlightForeground#4c6cc5
- list.hoverBackground#efefed
- list.hoverForeground#37352f
- list.inactiveFocusBackground#e8e8e6
- list.inactiveSelectionBackground#efeeee
- list.inactiveSelectionForeground#37352f
- listFilterWidget.background#f7f7f5
- listFilterWidget.noMatchesOutline#f04842
- listFilterWidget.outline#ffffff00
- menu.background#ffffff
- menu.border#dededc
- menu.foreground#37352f
- menu.selectionBackground#e8e8e6
- menu.selectionBorder#dededc
- menu.selectionForeground#37352f
- menu.separatorBackground#dededc
- menubar.selectionBackground#e8e8e6
- menubar.selectionBorder#dededc
- menubar.selectionForeground#37352f
- merge.commonContentBackground#f1f1ef99
- merge.commonHeaderBackground#a6a29999
- merge.currentContentBackground#e5fee999
- merge.currentHeaderBackground#edf3ec99
- merge.incomingContentBackground#eafbff99
- merge.incomingHeaderBackground#e7f3f899
- notebook.cellBorderColor#ffffff00
- notebook.cellEditorBackground#f7f7f5
- notebook.focusedCellBorder#777572
- notebook.focusedEditorBorder#ffffff00
- notebook.selectedCellBackground#eafbff
- notificationCenter.border#dededc
- notificationCenterHeader.background#e8e8e6
- notificationCenterHeader.foreground#37352f
- notifications.background#f7f7f5
- notifications.border#dededc
- notifications.foreground#37352f
- notificationsErrorIcon.foreground#ee000d
- notificationsInfoIcon.foreground#32a5e4
- notificationsWarningIcon.foreground#f2b828
- notificationToast.border#dededc
- outputView.background#ffffff
- panel.background#f7f7f5
- panel.border#dededc
- panelTitle.activeBorder#37352f
- panelTitle.activeForeground#37352f
- panelTitle.inactiveForeground#37352f
- peekView.border#dededc
- peekViewEditor.background#ffffff
- peekViewEditor.matchHighlightBackground#fff5d0
- peekViewEditor.matchHighlightBorder#f2b828
- peekViewEditorGutter.background#f7f7f5
- peekViewResult.background#ffffff
- peekViewResult.fileForeground#37352f
- peekViewResult.lineForeground#37352f
- peekViewResult.matchHighlightBackground#fff5d0
- peekViewResult.selectionBackground#eafbff
- peekViewResult.selectionForeground#4c6cc5
- peekViewTitle.background#f7f7f5
- peekViewTitleDescription.foreground#777572
- peekViewTitleLabel.foreground#37352f
- pickerGroup.border#dededc
- pickerGroup.foreground#4c6cc5
- progressBar.background#37352f
- scrollbar.shadow#ffffff
- scrollbarSlider.activeBackground#e6e6e3
- scrollbarSlider.background#d3d1cbdd
- scrollbarSlider.hoverBackground#efefed
- selection.background#e7f3f8
- sideBar.background#ffffff
- sideBar.border#dededc
- sideBar.foreground#37352f
- sideBarSectionHeader.background#ffffff
- sideBarSectionHeader.border#dededc
- sideBarSectionHeader.foreground#37352f
- sideBarTitle.background#ffffff
- sideBarTitle.foreground#37352f
- statusBar.background#f7f7f5
- statusBar.border#dededc
- statusBar.debuggingBackground#f2b828
- statusBar.debuggingBorder#dededc
- statusBar.debuggingForeground#ffffff
- statusBar.foreground#37352f
- statusBar.noFolderBackground#9950ff
- statusBar.noFolderBorder#dededc
- statusBar.noFolderForeground#ffffff
- statusBarItem.hoverBackground#efefed
- statusBarItem.remoteBackground#55534e
- statusBarItem.remoteForeground#ffffff
- tab.activeBackground#ffffff
- tab.activeBorder#ffffff00
- tab.activeBorderTop#37352f
- tab.activeForeground#37352f
- tab.border#dededc
- tab.hoverBackground#efefed
- tab.hoverBorder#dededc
- tab.hoverForeground#777572
- tab.inactiveBackground#e8e8e6
- tab.inactiveForeground#55534e
- terminal.ansiBlack#37352f
- terminal.ansiBlue#4c6cc5
- terminal.ansiBrightBlack#37352f
- terminal.ansiBrightBlue#4c6cc5
- terminal.ansiBrightCyan#32a5e4
- terminal.ansiBrightGreen#007b28
- terminal.ansiBrightMagenta#c14c8a
- terminal.ansiBrightRed#a7251c
- terminal.ansiBrightWhite#ffffff
- terminal.ansiBrightYellow#d09300
- terminal.ansiCyan#32a5e4
- terminal.ansiGreen#007b28
- terminal.ansiMagenta#c14c8a
- terminal.ansiRed#a7251c
- terminal.ansiWhite#f7f7f5
- terminal.ansiYellow#d09300
- terminal.background#ffffff
- terminal.border#dededc
- terminal.foreground#37352f
- terminal.selectionBackground#eafbff
- terminal.selectionForeground#4c6cc5
- terminalCursor.background#f7f7f5
- terminalCursor.foreground#55534e
- textLink.foreground#4c6cc5
- titleBar.activeBackground#f7f7f5
- titleBar.activeForeground#37352f
- titleBar.border#dededc
- titleBar.inactiveBackground#f7f7f5
- titleBar.inactiveForeground#37352f
- tree.indentGuidesStroke#dededc
- widget.shadow#ffffff00
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #777572 | italic |
| comment.block.preprocessor | #777572 | |
| comment.documentation, comment.block.documentation, string.quoted.docstring.multi.python | #007b28 | italic |
| invalid.illegal | #a7251c | — |
| keyword.operator | #37352f | — |
| storage | #d9730d | — |
| keyword, storage.type.function.python, storage.type.class.python | #32a5e4 | — |
| storage.type.class | #32a5e4 | bold |
| storage.type, support.type | #d09300 | — |
| constant.other.caps.python | #48ca80 | bold |
| constant.language, support.constant, variable.language, storage.modifier.const.cs | #48ca80 | — |
| variable, support.variable | #7733d2 | — |
| #FF0000 | bold | |
| entity.name.function, support.function | #ee000d | — |
| meta.attribute.python | #9065b0 | — |
| meta.function-call.generic.python | #d44c47 | — |
| entity.name.type, entity.other.inherited-class, support.class, entity.name.type.class.python | #ee000d | bold |
| entity.name.exception | #a7251c | — |
| entity.name.section | — | bold |
| constant.numeric, constant.character, constant | #d09300 | — |
| string | #007b28 | — |
| constant.character.escape | #37352f | — |
| string.regexp | #4c6cc5 | — |
| constant.other.symbol | #d09300 | — |
| punctuation | #37352f | — |
| source.python | #37352f | — |
| meta.tag.sgml.doctype, meta.tag.sgml.doctype string, meta.tag.sgml.doctype entity.name.tag, meta.tag.sgml punctuation.definition.tag.html | #777572 | — |
| meta.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html | #f2b828 | — |
| entity.name.tag | #4c6cc5 | — |
| meta.tag entity.other.attribute-name, entity.other.attribute-name.html | #f2b828 | italic |
| constant.character.entity, punctuation.definition.entity | #d09300 | — |
| meta.selector, meta.selector entity, meta.selector entity punctuation, entity.name.tag.css | #7733d2 | — |
| meta.property-name, support.type.property-name | #d09300 | — |
| meta.property-value, meta.property-value constant.other, support.constant.property-value | #007b28 | — |
| keyword.other.important | — | bold |
| markup.changed | #37352f | — |
| markup.deleted | #37352f | — |
| markup.italic | — | italic |
| markup.error | #a7251c | — |
| markup.inserted | #37352f | — |
| meta.link | #4c6cc5 | — |
| markup.output, markup.raw | #37352f | — |
| markup.prompt | #37352f | — |
| markup.heading | #32a5e4 | — |
| markup.bold | — | bold |
| markup.traceback | #a7251c | — |
| markup.underline | — | underline |
| markup.quote | #7733d2 | — |
| markup.list | #4c6cc5 | — |
| markup.bold, markup.italic | #007b28 | — |
| markup.inline.raw | #d09300 | |
| keyword.operator.expression.new.cs | — | bold |
| keyword.preprocessor.region.cs, keyword.preprocessor.endregion.cs | #c14c8a | bold |
| meta.tag | #37352f | — |
| meta.diff.range, meta.diff.index, meta.separator | #434343 | — |
| meta.diff.header.from-file | #434343 | — |
| meta.diff.header.to-file | #434343 | — |