Grace Gray
Publisher: SUPERTSY5Themes in package: 1
A graceful gray theme.
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#d8d8e0
- activityBar.activeBorder#0000
- activityBar.background#b0b0b8
- activityBar.dropBorder#0009
- activityBar.foreground#0009
- activityBar.inactiveForeground#0006
- activityBarBadge.background#115599
- button.background#115599
- button.secondaryBackground#778899
- debugToolBar.background#e1e1e7
- disabledForeground#11111199
- editor.background#e1e1e7
- editor.findMatchBackground#ff00ff66
- editor.findMatchHighlightBackground#0080ff66
- editor.foreground#000033
- editor.selectionBackground#0070e166
- editorGroup.border#d8d8e0
- editorGroupHeader.tabsBackground#d8d8e0
- editorGroupHeader.tabsBorder#e1e1e7
- editorLineNumber.activeForeground#003366
- editorLineNumber.foreground#808890
- editorSuggestWidget.focusHighlightForeground#99bbee
- editorSuggestWidget.highlightForeground#667788
- editorSuggestWidget.selectedBackground#667788
- editorSuggestWidget.selectedForeground#ffffff
- editorWidget.background#e1e1e7
- focusBorder#0006
- foreground#111111
- gitDecoration.modifiedResourceForeground#0066cc
- input.background#e8e8f0
- input.border#0006
- inputOption.activeBorder#667788
- list.activeSelectionBackground#667788
- list.activeSelectionForeground#eee
- list.activeSelectionIconForeground#ffffff
- list.focusHighlightForeground#77bbff
- list.focusOutline#0006
- list.highlightForeground#115599
- list.hoverBackground#e1e1e7
- list.inactiveSelectionBackground#e1e1e7
- list.invalidItemForeground#333333
- menu.background#e1e1e7
- minimap.findMatchHighlight#0080ff66
- panel.background#e1e1e7
- peekView.border#667788
- peekViewEditor.background#e1e1e7
- peekViewEditor.matchHighlightBackground#0080ff66
- peekViewResult.background#d8d8e0
- peekViewResult.lineForeground#333333
- peekViewResult.matchHighlightBackground#0080ff66
- peekViewResult.selectionBackground#0000ff33
- quickInputList.focusBackground#667788
- quickInputList.focusForeground#ffffff
- quickInputList.focusIconForeground#ffffff
- searchEditor.findMatchBackground#ff0000
- sideBar.background#d8d8e0
- sideBarSectionHeader.background#0000
- sideBarSectionHeader.border#b0b0b8
- statusBar.background#b0b0b8
- statusBar.debuggingBackground#115599
- statusBar.debuggingForeground#ffffff
- statusBar.foreground#111111
- statusBar.noFolderBackground#b0b0b8
- statusBar.noFolderForeground#111111
- statusBarItem.errorBackground#ee4444
- statusBarItem.errorForeground#ffffff
- statusBarItem.hoverBackground#00000033
- statusBarItem.remoteBackground#115599
- statusBarItem.remoteForeground#ffffff
- statusBarItem.warningBackground#ff9900
- statusBarItem.warningForeground#ffffff
- tab.activeBackground#e1e1e7
- tab.border#00000022
- tab.inactiveBackground#d8d8e0
- titleBar.activeBackground#d8d8e0
- titleBar.inactiveBackground#d8d8e0
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #008000 | — |
| comment.block.preprocessor | #008000 | |
| comment.documentation, comment.block.documentation | #008000 | — |
| invalid.illegal | #660000 | — |
| keyword.operator | #333333 | — |
| keyword, storage | #0033cc | — |
| storage.type, support.type | #007755 | — |
| constant.language, support.constant, variable.language | #000099 | — |
| variable, support.variable | #112266 | — |
| constant, variable.other.constant, variable.other.enummember | #0066cc | — |
| entity.name.function, support.function | #996600 | — |
| entity.name.type, entity.name.namespace, entity.other.inherited-class, support.class | #007755 | — |
| entity.name.exception | #660000 | — |
| entity.name.section | — | bold |
| constant.numeric, constant.character, constant | #000066 | — |
| string, punctuation.definition.string | #993300 | — |
| constant.character.escape | #996600 | — |
| string.regexp | #666600 | — |
| constant.other.symbol | #cc6600 | — |
| punctuation | #000066 | — |
| meta.tag.sgml.doctype, meta.tag.sgml.doctype string, meta.tag.sgml.doctype entity.name.tag, meta.tag.sgml punctuation.definition.tag.html | #AAAAAA | — |
| meta.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html | #0033cc | — |
| entity.name.tag | #0033cc | — |
| meta.tag entity.other.attribute-name, entity.other.attribute-name.html | #006666 | — |
| constant.character.entity, punctuation.definition.entity | #AB6526 | — |
| meta.selector, meta.selector entity, meta.selector entity punctuation, entity.name.tag.css | #7A3E9D | — |
| meta.property-name, support.type.property-name | #0033cc | — |
| meta.property-value, meta.property-value constant.other, support.constant.property-value | #448C27 | — |
| keyword.other.important | — | bold |
| markup.changed | #000000 | — |
| markup.deleted | #000000 | — |
| markup.italic | — | italic |
| markup.error | #660000 | — |
| markup.inserted | #000000 | — |
| meta.link | #0033cc | — |
| markup.output, markup.raw | #777777 | — |
| markup.prompt | #777777 | — |
| markup.heading | #AA3731 | — |
| markup.bold | — | bold |
| markup.traceback | #660000 | — |
| markup.underline | — | underline |
| markup.quote | #7A3E9D | — |
| markup.list | #0033cc | — |
| markup.bold, markup.italic | #448C27 | — |
| markup.inline.raw | #AB6526 | |
| meta.diff.range, meta.diff.index, meta.separator | #434343 | — |
| meta.diff.header.from-file | #434343 | — |
| meta.diff.header.to-file | #434343 | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...