w3schools Light Theme
Publisher: kverawatThemes in package: 1
VSCode Theme based on Quite light theme. Integrates with a coding color scheme from https://www.w3shools.com
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#0066b8
- activityBar.border#0066b8
- activityBar.foreground#ffffffe6
- activityBarBadge.background#ff0000
- badge.background#705697AA
- badge.foreground#ffffff
- button.background#705697
- dropdown.background#F5F5F5
- editor.background#ffffff
- editor.findMatchBackground#BF9CAC
- editor.findMatchHighlightBackground#edc9d8
- editor.foreground#000000
- editor.lineHighlightBackground#E4F6D4
- editor.selectionBackground#C9D0D9
- editorCursor.foreground#54494B
- editorGroup.dropBackground#C9D0D988
- editorGroupHeader.tabsBackground#0065b873
- editorIndentGuide.activeBackground#bbbbbb
- editorIndentGuide.background#5e81ce52
- editorLineNumber.activeForeground#222222
- editorLineNumber.foreground#888888
- editorWhitespace.foreground#cacaca
- errorForeground#f1897f
- focusBorder#A6B39B
- inputOption.activeBorder#adafb7
- inputValidation.errorBackground#ffeaea
- inputValidation.errorBorder#f1897f
- inputValidation.infoBackground#f2fcff
- inputValidation.infoBorder#4ec1e5
- inputValidation.warningBackground#fffee2
- inputValidation.warningBorder#ffe055
- list.activeSelectionBackground#c4d9b1
- list.activeSelectionForeground#6c6c6c
- list.focusBackground#CADEB9
- list.highlightForeground#9769dc
- list.hoverBackground#e0e0e0
- list.inactiveSelectionBackground#d3dbcd
- minimap.selectionHighlight#C9D0D9
- panel.background#F5F5F5
- peekView.border#705697
- peekViewEditor.background#F2F8FC
- peekViewEditor.matchHighlightBackground#C2DFE3
- peekViewResult.background#F2F8FC
- peekViewResult.matchHighlightBackground#93C6D6
- peekViewTitle.background#F2F8FC
- pickerGroup.border#749351
- pickerGroup.foreground#A6B39B
- progressBar.background#705697
- selection.background#C9D0D9
- sideBar.background#f1f1f1
- sideBar.border#bbbbbb
- sideBar.foreground#000000
- sideBarSectionHeader.background#ede8ef
- statusBar.background#705697
- statusBar.debuggingBackground#705697
- statusBar.noFolderBackground#705697
- statusBarItem.remoteBackground#4e3c69
- tab.activeBackground#ffffff
- tab.inactiveBackground#e0e0e0
- titleBar.activeBackground#c4b7d7
- walkThrough.embeddedEditorBackground#00000014
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| meta.embedded, source.groovy.embedded | #000000 | — |
| comment, punctuation.definition.comment | #aaaaaa | |
| comment.block.preprocessor | #aaaaaa | |
| comment.documentation, comment.block.documentation, comment.block.documentation punctuation.definition.comment | #aaaaaa | — |
| invalid.illegal | #660000 | — |
| keyword.operator | #000000 | — |
| keyword.operator.type.php, keyword.operator.heredoc.php, keyword.operator.logical.php | #0000cd | — |
| keyword, storage | #0000cd | — |
| storage.type, support.type | #0000cd | — |
| meta.class.php meta.class.body.php meta.function.php storage.type.php | #000000 | — |
| constant.language, support.constant, variable.language | #000000 | — |
| constant.language.php | #0000cd | — |
| variable, support.variable | #000000 | — |
| entity.name.function | #000000 | |
| support.function | #0000cd | |
| meta.function-call.php support.function | #a52a2a | |
| entity.name.type, entity.name.namespace, entity.name.scope-resolution, entity.other.inherited-class, support.class | #000000 | |
| entity.name.exception | #660000 | — |
| entity.name.section | — | bold |
| constant.numeric, constant.character, constant | #0000cd | — |
| string | #0000cd | — |
| constant.character.escape | #0000cd | — |
| string.regexp | #4B69C6 | — |
| constant.other.symbol | #9C5D27 | — |
| punctuation | #0000cd | — |
| meta.function-call.php punctuation, variable.other.php punctuation, variable.other.global.php punctuation, punctuation.definition.variable.php, punctuation.definition.class.begin.bracket.curly.php, punctuation.definition.class.end.bracket.curly.php, punctuation.definition.begin.bracket.curly.php, punctuation.definition.end.bracket.curly.php, punctuation.definition.arguments.begin.bracket.round.php, punctuation.definition.arguments.end.bracket.round.php, punctuation.definition.begin.bracket.round.php, punctuation.definition.end.bracket.round.php, punctuation.section.array.begin.php, punctuation.section.array.end.php, punctuation.definition.parameters.begin.bracket.round.php, punctuation.definition.parameters.end.bracket.round.php, punctuation.terminator.expression.php | #000000 | — |
| meta.function-call.php string.quoted.double.php punctuation, meta.function-call.php string.quoted.single.php punctuation | #0000cd | — |
| 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 | #0000cd | — |
| entity.name.tag | #a52a2a | — |
| meta.tag.metadata.doctype.html punctuation.definition.tag.begin.html, meta.tag.metadata.doctype.html punctuation.definition.tag.end.html, meta.tag.metadata.doctype.html entity.other.attribute-name.html, meta.tag.metadata.doctype.html entity.name.tag.html | #555555 | — |
| meta.tag entity.other.attribute-name, entity.other.attribute-name.html | #ff0000 | |
| constant.character.entity, punctuation.definition.entity | #0000cd | — |
| source.css punctuation | #000000 | — |
| meta.at-rule.header.css, meta.at-rule.charset invalid.illegal.not-double-quoted.charset.css, meta.at-rule.import.css string.quoted.double.css punctuation.definition.string.begin.css, meta.at-rule.import.css string.quoted.double.css punctuation.definition.string.end.css, meta.at-rule.import.css string.quoted.single.css punctuation.definition.string.begin.css, meta.at-rule.import.css string.quoted.single.css punctuation.definition.string.end.css | #0000cd | — |
| meta.at-rule.header.css keyword.control.at-rule.css | #000000 | — |
| meta.at-rule.media.header.css keyword.control.at-rule.media.css, meta.at-rule.keyframes.header.css keyword.control.at-rule.keyframes.css, meta.at-rule.supports.header.css keyword.control.at-rule.supports.css, meta.at-rule.import.css keyword.control.at-rule.import.css, meta.at-rule.charset.css keyword.control.at-rule.charset.css, meta.at-rule.font-face.css keyword.control.at-rule.font-face.css, meta.at-rule.font-features.css keyword.control.at-rule.font-feature-values.css, meta.at-rule.namespace.css keyword.control.at-rule.namespace.css, meta.at-rule.page.css keyword.control.at-rule.page.css, meta.at-rule.counter-style.header.css keyword.control.at-rule.counter-style.css, meta.at-rule.viewport.css keyword.control.at-rule.viewport.css, meta.at-rule.document.header.css keyword.control.at-rule.document.css | #000000 | — |
| meta.at-rule.media.header.css keyword.operator.logical.only.media.css, meta.at-rule.media.header.css keyword.operator.logical.and.media.css, meta.at-rule.keyframes.header.css variable.parameter.keyframe-list.css, meta.at-rule.import.css keyword.operator.logical.and.media.css, meta.at-rule.import.css keyword.operator.logical.only.media.css, meta.at-rule.supports.header.css keyword.operator.logical.feature.and.css, meta.at-rule.supports.header.css keyword.operator.logical.feature.or.css, meta.at-rule.supports.header.css meta.feature-query.css keyword.operator.logical.feature.not.css, meta.at-rule.supports.header.css keyword.operator.logical.feature.not.css | #0000cd | — |
| meta.at-rule.keyframes.body.css entity.other.keyframe-offset.percentage.css | #0000cd | — |
| meta.at-rule.keyframes.body.css entity.other.keyframe-offset.css | #a52a2a | — |
| meta.at-rule.media.header.css | #ff0000 | — |
| meta.at-rule.media.header.css support.constant.media.css, meta.at-rule.import.css support.constant.media.css | #ff0000 | — |
| entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css | #008855 | — |
| entity.other.attribute-name.pseudo-class.css punctuation.definition.entity.css, entity.other.attribute-name.pseudo-element.css punctuation.definition.entity.css, meta.selector.css entity.name.tag.wildcard.css | #000000 | — |
| meta.attribute-selector.css punctuation.definition.entity.begin.bracket.square.css, meta.attribute-selector.css punctuation.definition.entity.end.bracket.square.css | #000000 | — |
| meta.selector, meta.selector support.constant.parity.css, meta.selector entity, meta.selector entity punctuation, meta.selector meta.attribute-selector string.quoted.double.css, entity.name.tag.css, entity.other.attribute-name.id.css punctuation.definition.entity.css, meta.selector.css support.constant.language-range.css | #a52a2a | — |
| meta.selector meta.attribute-selector.css string.quoted.double.css | #0000cd | — |
| meta.property-name, support.type.property-name | #ff0000 | — |
| support.type.vendored.property-name.css | #ff0000 | — |
| meta.property-value, meta.property-value constant.other, meta.property-value constant.character.escape.codepoint.css, meta.property-value meta.function.misc.css variable.parameter.misc.css, meta.property-value meta.function.gradient.css keyword.operator.gradient.css, meta.property-value meta.function.url.css variable.parameter.url.css, meta.property-value string.quoted.double.css punctuation.definition.string.begin.css, meta.property-value string.quoted.double.css punctuation.definition.string.end.css, meta.property-value string.quoted.single.css punctuation.definition.string.begin.css, meta.property-value string.quoted.single.css punctuation.definition.string.end.css, support.constant.property-value, support.constant.font-name.css, support.constant.vendored.property-value.css, support.constant.color.w3c-standard-color-name.css, support.constant.color.w3c-extended-color-name.css, constant.other.color.rgb-value.hex.css punctuation.definition.constant.css | #0000cd | — |
| keyword.other.important | — | bold |
| meta.property-list.css variable.css, meta.property-list.css meta.property-value.css meta.function.variable.css variable.argument.css, meta.at-rule.supports.header.css meta.feature-query.css variable.css | #444444 | — |
| meta.at-rule.supports.header.css meta.feature-query.css meta.property-name.css | #0000cd | — |
| meta.at-rule.supports.header.css meta.property-name.css | #a52a2a | — |
| source.js punctuation, source.js meta.brace.round, source.js meta.function-call support.function, source.js meta.arrow storage.type, source.js meta.class meta.method.declaration storage.type, source.js meta.var.expr meta.objectliteral meta.method.declaration storage.type.property | #000000 | — |
| source.js constant.numeric | #ff0000 | — |
| source.js string, source.js constant.character.escape, source.js punctuation.definition.string.begin.js, source.js punctuation.definition.string.end.js | #a52a2a | — |
| source.js constant.language, source.js variable.language.this, source.js variable.language.super, source.js keyword.operator.new, source.js keyword.operator.expression, source.js meta.class meta.method.declaration storage.type.property | #0000cd | — |
| source.js string.regexp, source.js string.regexp constant, source.js string.regexp constant.character, source.js string.regexp constant.character.escape, source.js string.regexp keyword, source.js string.regexp keyword.operator, source.js string.regexp punctuation, source.js string.regexp punctuation.definition.string.begin.js, source.js string.regexp punctuation.definition.string.end.js | #ff5500 | — |
| meta.embedded.line.js source.js constant.language, meta.embedded.line.js source.js constant.numeric, meta.embedded.line.js source.js entity.name.function, meta.embedded.line.js source.js keyword.operator, meta.embedded.line.js source.js meta.brace.round, meta.embedded.line.js source.js support.class, meta.embedded.line.js source.js variable.other.property, meta.embedded.line.js source.js variable, meta.embedded.line.js source.js variable.language, meta.embedded.line.js source.js punctuation.accessor, meta.embedded.line.js source.js string.quoted.single, meta.embedded.line.js source.js string.quoted.single punctuation.definition.string.begin.js, meta.embedded.line.js source.js string.quoted.single punctuation.definition.string.end.js, meta.embedded.line.js source.js string.regexp, meta.embedded.line.js source.js string.regexp constant, meta.embedded.line.js source.js string.regexp constant.character, meta.embedded.line.js source.js string.regexp constant.character.escape, meta.embedded.line.js source.js string.regexp keyword, meta.embedded.line.js source.js string.regexp keyword.operator, meta.embedded.line.js source.js string.regexp punctuation, meta.embedded.line.js source.js string.regexp punctuation.definition.string.begin.js, meta.embedded.line.js source.js string.regexp punctuation.definition.string.end.js | #0000cd | — |
| markup.changed | #000000 | — |
| markup.deleted | #000000 | — |
| markup.italic | — | italic |
| markup.error | #660000 | — |
| markup.inserted | #000000 | — |
| meta.link | #4B69C6 | — |
| 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 | #4B69C6 | — |
| markup.bold, markup.italic | #448C27 | — |
| markup.inline.raw | #9C5D27 | |
| meta.diff.range, meta.diff.index, meta.separator | #434343 | — |
| meta.diff.header.from-file | #434343 | — |
| meta.diff.header.to-file | #434343 | — |
| punctuation.definition.tag.js, punctuation.definition.tag.begin.js, punctuation.definition.tag.end.js | #91B3E0 | — |
| meta.jsx.children.js | #333333ff | — |
| punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php | #555555 | bold |
| meta.tag.metadata.processing.xml.html punctuation.definition.tag.html, meta.tag.metadata.processing.xml.html punctuation.definition.string.begin.html, meta.tag.metadata.processing.xml.html punctuation.definition.string.end.html, meta.tag.metadata.processing.xml.html entity.other.attribute-name.html, meta.tag.metadata.processing.xml.html entity.name.tag.html, meta.tag.metadata.processing.xml.html punctuation.definition.tag.html, meta.tag.metadata.processing.xml.html punctuation.separator.key-value.html, meta.tag.metadata.processing.xml.html string.quoted.double.html, meta.tag.metadata.processing.xml.html string.quoted.single.html | #555555 | — |
| meta.tag.preprocessor.xml, meta.tag.preprocessor.xml punctuation.definition.tag.xml, meta.tag.preprocessor.xml entity.name.tag.xml, meta.tag.preprocessor.xml entity.other.attribute-name.xml, meta.tag.preprocessor.xml punctuation.definition.string.begin.xml, meta.tag.preprocessor.xml punctuation.definition.string.end.xml, meta.tag.preprocessor.xml punctuation.definition.tag.html, meta.tag.preprocessor.xml punctuation.separator.key-value.html, meta.tag.preprocessor.xml string.quoted.double.xml, meta.tag.preprocessor.xml string.quoted.single.xml | #555555 | — |
| source.python punctuation | #000000 | — |
| support.function.magic.python | #000000 | — |
| support.type.exception.python | #000000 | — |
| source.python constant.language.python, source.python punctuation.definition.string.begin.python, source.python punctuation.definition.string.end.python | #0000CD | — |
| source.python support.other.escape.special.regexp | #0000CD | — |
| keyword.operator.logical.python | #0000CD | — |
| meta.function-call.python support.function.builtin.python, meta.function-call.python support.type.python | #a52a2a | — |
| meta.member.access.python meta.function-call.python meta.function-call.generic.python, meta.member.access.python meta.attribute.python, meta.member.access.python meta.function-call.python support.function.magic.python, meta.member.access.python meta.item-access.python meta.indexed-name.python | #ff0000 | — |
| source.apacheconf entity.tag.apacheconf | #000000 | — |
| source.apacheconf keyword.headers.apacheconf | #0000cd | — |
| source.apacheconf keyword.core.apacheconf | #0000cd | — |
| source.apacheconf keyword.rewrite.apacheconf | #0000cd | — |
| source.apacheconf string.value.apacheconf | #008855 | — |
| source.apacheconf entity.mime-type.apacheconf | #a52a2a | — |
| source.apacheconf, source.apacheconf keyword.access.apacheconf, source.apacheconf constant.integer.apacheconf, source.apacheconf variable.misc.apacheconf, source.apacheconf punctuation.variable.apacheconf, source.apacheconf string.regexp.apacheconf, source.apacheconf string.replacement.apacheconf, source.apacheconf entity.helper.apacheconf | #ff0000 | — |
| source.css.scss entity.name.function.scss, source.css.scss support.function.misc.scss | #0000cd | — |
| source.css.scss meta.attribute-selector.scss entity.other.attribute-name.attribute.scss, source.css.scss support.constant.language-range.css | #a52a2a | — |
| source.css.scss meta.attribute-selector.scss | #0000cd | — |
| source.css.scss variable | #444444 | — |
| source.css.scss meta.property-list.scss variable.scss, source.css.scss meta.at-rule.supports.scss meta.property-name.scss | #444444 | — |
| source.css.scss meta.property-list.scss meta.at-rule.at-root.scss variable.interpolation.scss variable.scss | #444444 | — |
| source.css.scss meta.at-rule.media.scss keyword.control.at-rule.media.scss, source.css.scss meta.at-rule.keyframes.scss keyword.control.at-rule.keyframes.scss, source.css.scss meta.at-rule.supports.scss keyword.control.at-rule.supports.scss, source.css.scss meta.at-rule.import.scss keyword.control.at-rule.import.scss, source.css.scss meta.at-rule.charset.scss keyword.control.at-rule.charset.scss, source.css.scss meta.at-rule.fontface.scss keyword.control.at-rule.fontface.scss, source.css.scss meta.at-rule.namespace.scss keyword.control.at-rule.namespace.scss, source.css.scss meta.at-rule.page.scss keyword.control.at-rule.page.scss | #000000 | — |
| source.css.scss meta.at-rule.mixin.scss keyword.control.at-rule.mixin.scss, source.css.scss meta.at-rule.include.scss keyword.control.at-rule.include.scss, source.css.scss meta.at-rule.at-root.scss keyword.control.at-rule.at-root.scss, source.css.scss meta.at-rule.warn.scss keyword.control.warn.scss, source.css.scss meta.at-rule.each.scss keyword.control.each.scss, source.css.scss meta.at-rule.extend.scss keyword.control.at-rule.extend.scss, source.css.scss meta.at-rule.for.scss keyword.control.for.scss, source.css.scss meta.at-rule.forward.scss keyword.control.at-rule.forward.scss, source.css.scss meta.at-rule.function.scss keyword.control.at-rule.function.scss, source.css.scss meta.at-rule.if.scss keyword.control.if.scss, source.css.scss meta.at-rule.else.scss keyword.control.else.scss, source.css.scss meta.at-rule.use.scss keyword.control.at-rule.use.scss, source.css.scss meta.at-rule.while.scss keyword.control.while.scss, source.css.scss meta.at-rule.return.scss keyword.control.return.scss | #000000 | — |
| source.css.scss keyword.control.content.scss | #000000 | — |
| source.css.scss meta.at-rule.media.scss keyword.operator.logical.scss, source.css.scss meta.at-rule.keyframes.scss, source.css.scss meta.at-rule.supports.scss keyword.operator.logical.scss | #0000cd | — |
| source.css.scss meta.at-rule.keyframes.scss entity.other.attribute-name.scss | #a52a2a | — |
| source.css.scss meta.at-rule.media.scss support.constant.media.css | #ff0000 | — |
| source.css.scss entity.other.attribute-name.pseudo-class.css, source.css.scss entity.other.attribute-name.pseudo-element.css | #008855 | — |
| source.css.scss punctuation.definition.string.begin.scss, source.css.scss punctuation.definition.string.end.scss | #0000cd | — |
| source.css.scss meta.at-rule.mixin.scss entity.name.function.scss | #a52a2a | — |
| source.css.scss meta.property-list.scss meta.property-value.scss variable.parameter.url.scss | #0000cd | — |
| source.css.scss meta.definition.variable.scss variable.scss | #444444 | — |
| source.css.scss meta.property-list.scss meta.property-value.scss variable.scss | #444444 | — |
| source.css.scss entity.other.attribute-name.class.css, source.css.scss entity.other.attribute-name.id.css | #a52a2a | — |
| source.css.scss meta.property-list.scss meta.at-rule.for.scss variable.scss | #444444 | — |
| source.css.scss meta.at-rule.for.scss support.constant.property-value.css, source.css.scss meta.property-list.scss meta.at-rule.for.scss support.constant.property-value.css | #000000 | — |
| source.css.scss meta.at-rule.warn.scss | #0000cd | — |
| source.css.scss meta.at-rule.mixin.scss | #0000cd | — |
| source.css.scss meta.at-rule.if.scss keyword.operator.logical.scss, source.css.scss meta.at-rule.if.scss | #0000cd | — |
| source.css.scss meta.at-rule.supports.scss | #0000cd | — |
| source.css.scss meta.at-rule.supports.scss meta.property-name.scss | #a52a2a | — |
| source.sass keyword.control.at-rule.css.sass, source.sass keyword.control.at-rule.use | #000000 | — |
| source.sass variable | #444444 | — |
| source.sass entity.other.attribute-name, source.sass entity.other.attribute-selector.sass | #a52a2a | — |
| source.sass constant, source.sass constant.language.color | #0000cd | — |
| source.sass support.function.name.sass entity.name.function | #a52a2a | — |
| source.sass entity.name.function | #0000cd | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...