Frontend Delight
Publisher: Robin BoersThemes in package: 3
Frontend Delight color scheme for VSCode
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#f74319
- activityBar.background#1e2121
- activityBar.border#141516
- activityBarBadge.background#f74319
- button.background#f74319
- button.hoverBackground#fc5631
- button.secondaryBackground#f74319
- button.secondaryHoverBackground#fc5631
- checkbox.background#222324
- checkbox.border#141516
- debugToolBar.background#242526
- descriptionForeground#959da5
- dropdown.background#1a1c1c
- dropdown.border#141516
- dropdown.foreground#e1e4e8
- dropdown.listBackground#1a1a1b
- editor.background#242526
- editor.foreground#adadad
- editor.selectionBackground#f0796685
- editorGroup.border#141516
- editorGroupHeader.tabsBackground#1e2121
- editorWidget.border#141516
- focusBorder#141516
- foreground#adadad
- gitDecoration.addedResourceForeground#34d058
- gitDecoration.conflictingResourceForeground#ffab70
- gitDecoration.deletedResourceForeground#ea4a5a
- gitDecoration.ignoredResourceForeground#6a737d
- gitDecoration.modifiedResourceForeground#79b8ff
- gitDecoration.submoduleResourceForeground#6a737d
- gitDecoration.untrackedResourceForeground#34d058
- list.activeSelectionBackground#2a2b2b
- list.activeSelectionForeground#ffffff
- list.focusBackground#f74319
- list.hoverBackground#2a2b2b
- list.hoverForeground#adadad
- list.inactiveFocusBackground#1b1c1d
- list.inactiveSelectionBackground#2a2b2b
- list.inactiveSelectionForeground#adadad
- minimap.selectionHighlight#f0796685
- notificationLink.foreground#f74319
- panel.background#1b1c1d
- panel.border#141516
- panelTitle.activeBorder#f74319
- panelTitle.activeForeground#ffffff
- panelTitle.inactiveForeground#adadad
- peekViewEditor.background#1f242888
- progressBar.background#fc5631
- sideBar.background#1b1c1d
- sideBar.border#141516
- sideBarSectionHeader.background#1b1c1d
- sideBarTitle.foreground#bbbbbb
- statusBar.background#1b1c1d
- statusBar.border#141516
- statusBar.debuggingBackground#931c06
- statusBar.debuggingForeground#fff
- statusBar.foreground#d1d5da
- statusBar.noFolderBackground#1b1c1d
- statusBarItem.prominentBackground#242526
- tab.activeBackground#242526
- tab.activeBorder#242526
- tab.activeBorderTop#f74319
- tab.activeForeground#e1e4e8
- tab.border#242526
- tab.hoverBackground#242526
- tab.inactiveBackground#1e2121
- tab.inactiveForeground#959da5
- tab.unfocusedActiveBorder#24292e
- tab.unfocusedActiveBorderTop#1b1f23
- tab.unfocusedHoverBackground#2b2c2d
- terminal.ansiBlack#242526
- terminal.ansiBlue#2c70b7
- terminal.ansiBrightBlue#3393ca
- terminal.ansiBrightCyan#4fbce6
- terminal.ansiBrightGreen#74ec4c
- terminal.ansiBrightMagenta#e75e4f
- terminal.ansiBrightRed#f74319
- terminal.ansiBrightWhite#ffffff
- terminal.ansiBrightYellow#fdc325
- terminal.ansiCyan#3ca1a6
- terminal.ansiGreen#565747
- terminal.ansiMagenta#f02e4f
- terminal.ansiRed#f8511b
- terminal.ansiWhite#adadad
- terminal.ansiYellow#fa771d
- terminal.background#1b1c1d
- terminal.border#141516
- terminal.foreground#adadad
- terminal.tab.activeBorder#f74319
- textLink.activeForeground#fc6d4e
- textLink.foreground#fc5631
- titleBar.activeBackground#1e2121
- titleBar.border#141516
- titleBar.inactiveBackground#1e2121
- tree.indentGuidesStroke#313132
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, string.comment.buffered.block.jade | #70B880 | italic |
| entity.name.type.instance | #ff8b19 | bold |
| entity.name.function | #ff8b19 | bold |
| support.class.js | #f6485d | italic |
| storage | #ffd2a690 | italic |
| keyword | #ff681e | italic |
| string.quoted.double.css, string.quoted.double.js, variable.parameter.url, string.quoted.jade, string.quoted.single.js, string.quoted.double.attribute-value.css, string.quoted.double.ruby, string.quoted.single.ruby, string.quoted.single.coffee, string.quoted.double.coffee, meta.string-contents.quoted.double.php, string.quoted.double.php, string.quoted.single.php, meta.string-contents.quoted.single.php, string.quoted.variable.parameter.url, string.quoted.single.css, string.quoted.single.css | #FC0 | italic |
| constant.numeric | #fb5b1d | italic |
| keyword.operator | #FC0 | |
| punctuation.definition.parameters, meta.brace, meta.delimiter, punctuation.terminator.expression.php, source.php.embedded.block.html, keyword.operator.class.php | #ffffff30 | |
| support.class.php, variable.other.global.safer.php, entity.name.type.class.php, entity.other.inherited-class.php, meta.function.php | #ff8b19 | |
| text.html.basic, variable.other.global.php, variable.other.php, meta.function-call.object.php, variable.other.property.php, support.function.filestat.php, meta.function-call.static.php, support.function.head.php | #bbbbbb | |
| constant.language.php, keyword.operator.logical.php, punctuation.definition.variable.php, punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php, variable.other.class.php, constant.other.class.php, .construct.php | #f6485d | |
| support.function, support.function.array.php, meta.function-call.php, constant.other.php | #bbbbbb | |
| constant.other.symbol.ruby | #3fa5d4 | |
| support.class.ruby | #ee7561 | |
| variable.language.js, variable.assignment.coffee, variable.language.coffee | #f6485d | |
| constant.language.boolean.false.js, constant.language.boolean.true.js, constant.language.null.js | #f6485d | |
| source.json | #a2a090 | |
| meta.structure.dictionary.value.json, constant.numeric.json | #FC0 | |
| punctuation.separator.dictionary.key-value.json | #a2a09040 | |
| punctuation.definition.dictionary.end.json, punctuation.definition.dictionary.begin.json | #fff | |
| text.xml | #ccc | |
| entity.name.tag.localname.xml, punctuation.definition.tag.begin.xml, punctuation.definition.tag.end.xml | #72666490 | |
| entity.other.attribute-name.html | #666666 | bold |
| entity.name.tag | #666666 | |
| punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, meta.tag.structure.any.html | #666666 | bold |
| source.jade | #4d4e4e | — |
| complete_tag.jade | #aaa | — |
| text.block.pipe.jade, text.jade | #5c6461 | — |
| entity.name.tag.jade, entity.name.tag.script.jade, javascript.embedded.jade | #f64861 | — |
| meta.first-class.jade, variable.control.import.include.jade | #ff8b19 | — |
| tag.jade, complete_tag.jade, string.name.classes.tag.jade | #3897e8 | — |
| constant.id.tag.jade | #50d1d9 | — |
| source.css, source.less, punctuation.definition.entity.css | #4d4e4e | — |
| meta.property-name.css, support.type.property-name.css, support.type.property-name.css.vendor, constant.numeric.css, support.constant.property-value.css, support.type.property-name.css | #cccccc | — |
| constant.numeric.css, keyword.unit.css, constant.other.color.rgb-value.css, constant.other.color.rgb-value.css, support.constant.property-value.css, constant.numeric.css keyword.other.unit.css, keyword.operator.less, entity.other.attribute-name.pseudo-element.css, entity.other.attribute-name.pseudo-element.css, support.constant.color.w3c-standard-color-name.css, meta.property-value.css | #5c6461 | |
| meta.at-rule.import.css, keyword.control.at-rule, support.function.less, support.function.any-method.builtin.less | #49afb5 | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.id.css, meta.selector.css, variable.declaration.less | #ff8b19 | |
| variable.other.less | #fb5b1d | — |
| constant.other.rgb-value.css | #83eb5e | — |
| entity.other.attribute-name.attribute.css, entity.other.attribute-name.pseudo-class.css, keyword.operator.less | #f6475d | — |