Vscode light theme Codepen

settings.json

{
  "workbench.colorCustomizations": {
    "[Default Light+]": {
      "panel.background": "#eee",
      "terminal.background": "#fff",
      "editorPane.background": "#eee",
      "editorGutter.background": "#eee",
      "editorGroupHeader.noTabsBackground": "#eee",
      "list.inactiveSelectionBackground": "#cde",
      "sideBar.border": "#ccc",
      "editorBracketHighlight.foreground1": "#ddd",  // "#999",
      "editorBracketHighlight.foreground2": "#bbb",  // "#0cc",
      "editorBracketHighlight.foreground3": "#999",  // "#0c0",
      "editorBracketHighlight.foreground4": "#777",  // "#00f",
      "editorBracketHighlight.foreground5": "#555",  // "#c0c",
      "editorBracketHighlight.foreground6": "#333",  // "#cc0",
      "editorBracketHighlight.unexpectedBracket.foreground": "#e00",
    },
  },
  
  "editor.tokenColorCustomizations": {
    "[Default Light+]": {
      "textMateRules": [
        // codepen light theme
        {"settings":{"foreground":"#ccc"},"scope":[  // 998
          "comment",
        ]},
        {"settings":{"foreground":"#999"},"scope":[
          "punctuation.accessor.js",
          "meta.brace.round.js",
          "punctuation.separator.key-value.js",
          "punctuation.separator.comma.js",
          "punctuation.terminator.statement.js",
          "punctuation.separator.parameter.js",
          "meta.attribute.class.html punctuation.separator.key-value.html",
          "meta.attribute.target.html punctuation.separator.key-value.html",
          "meta.attribute.href.html punctuation.separator.key-value.html",
          "text.html.derivative",

          "punctuation.separator.dictionary.key-value.json.comments",
          "punctuation.separator.array.json.comments",
          "punctuation.separator.dictionary.pair.json.comments",

          "entity.other.attribute-name.pseudo-class.css",
          "punctuation.separator.key-value.css",
          "punctuation.terminator.rule.css",
          "keyword.operator.arithmetic.css",
          "punctuation.separator.list.comma.css",
          "entity.other.attribute-name.pseudo-element.css",
        ]},
        {"settings":{"foreground":"#555"},"scope":[
          "meta.attribute.class.html entity.other.attribute-name.html",
          "meta.attribute.name.html entity.other.attribute-name.html",
          "meta.attribute.unrecognized.to.html entity.other.attribute-name.html",
          "meta.attribute.target.html entity.other.attribute-name.html",
          "meta.attribute.href.html entity.other.attribute-name.html",
          "entity.other.attribute-name.html.vue",
          "meta.attribute.lang.html entity.other.attribute-name.html",
          "meta.attribute.charset.html entity.other.attribute-name.html",
          "meta.attribute.rel.html entity.other.attribute-name.html",
          "meta.attribute.content.html entity.other.attribute-name.html",
          "meta.attribute.id.html entity.other.attribute-name.html",
          "meta.attribute.type.html entity.other.attribute-name.html",
          "meta.attribute.src.html entity.other.attribute-name.html",
        ]},
        {"settings":{"foreground":"#000"},"scope":[
          "keyword.operator.assignment.js",
          "storage.type.function.arrow.js",
          "keyword.operator.arithmetic.js",
          "variable.other.object.js",
          "variable.other.readwrite.js",

          "variable.css",
          "variable.argument.css",
        ]},
        {"settings":{"foreground":"#b10"},"scope":[  // a11
          "string",
          "string.quoted.double.html",
          "string.quoted.single.html",
          "meta.property-name.css",
        ]},
        {"settings":{"foreground":"#173"},"scope":[  // 164
          "constant.numeric.decimal.js",
          "constant.numeric.css",
          "keyword.other.unit.rem.css",
        ]},
        {"settings":{"foreground":"#00a"},"scope":[  // 219
          "keyword.control",

          "storage.type.js",
          "entity.name.function.js",
          "support.variable.property.js",
          "keyword.operator.expression.of.js",
          "variable.other.property.js",
          "keyword.operator.spread.js",
          "meta.object-literal.key.js",
          "keyword.operator.expression.import.js",
          "variable.other.object.property.js",

          "entity.other.attribute-name.class.css",
          "support.type.property-name.css",
          "entity.name.tag.css",
          "support.constant.color.w3c-extended-color-name.css",
          "support.constant.property-value.css",
          "support.function.misc.css",
          "support.type.property-name.media.css",
          "support.function.calc.css",
          "support.function.url.css",
        ]},
        {"settings":{"foreground":"#909"},"scope":[  // 708
          "variable.other.constant.js",
          "variable.parameter.js",
          "variable.other.constant.property.js",
          "variable.other.readwrite.alias.js",
          "meta.definition.variable.js entity.name.function.js",
          "meta.definition.variable.js variable.other.readwrite.js",
          "keyword.control.at-rule.media.css",
          "support.variable.property.importmeta.js",
          "constant.language.boolean.true.js",
          "constant.language.boolean.false.js",
        ]},
        
        {"settings":{"fontStyle":"bold"},"scope":[
          //"meta.function-call.generic.python",
          "entity.name.function.python",
          "storage.type.function.python",
          "keyword.control.import.python",
          "keyword.control.flow.python",
          "storage.type.function.lambda.python",
          "keyword.operator",
          "entity.other.attribute-name.id.html",
          "source.vue entity.name.tag.template.html",
          "source.vue entity.name.tag.script.html",
          "source.vue entity.name.tag.style.html",
        ]},

        {"settings":{"fontStyle":"italic"},"scope":[
          "variable.parameter.function-call.python",

          "entity.other.attribute-name.html",
        ]},
      ]
    },
  },
}