Skip to content
| Marketplace
Sign in
Visual Studio Code>Themes>Dark Filk ThemeNew to Visual Studio Code? Get it now.
Dark Filk Theme

Dark Filk Theme

Philip Park

|
1,886 installs
| (3) | Free
Pleasingly dark and vibrant theme made for frontend web development.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Dark Filk Theme

This is a theme inspired by One Monokai but with a darker setting and more vibrant colors and more color differentiation. This theme was especially optimized for frontend web development in HTML, (S)CSS and JS. Syntax highlighting for other languages usually works fine but is untested. See recommended fonts and settings at the bottom below the screenshots.

Theme Screenshots

Please note that the cursive font code is not part of the theme and has to be added by yourself manually as described at the bottom of this page if you want to.

Theme Header

SCSS Code Preview

JS Code Preview

HTML Code Preview

The following interface screenshot might not represent the most recent code color settings of the theme, please focus on the look of the Visual Studio Code program interface only.

Interface Screenshot

Setting Recommendations

I highly recommend using colorized brackets with guidelines in this theme. The colors are already defined within the theme settings. Use this in your settings.json:

    "editor.bracketPairColorization.enabled": true,
    "editor.guides.bracketPairs": true,
    "editor.guides.bracketPairsHorizontal": false,
    "editor.guides.highlightActiveBracketPair": true,

If you want to achieve the cursive font style for certain code you need to use a font that supports cursive like e.g. purchaseable Operator Mono or free Fira Code iScript and set and feel free to edit the following in your settings.json:

    "editor.tokenColorCustomizations": {
        "textMateRules": [
            {
                "scope": [
                    "comment",
                    "keyword",
                    "storage.modifier",
                    "storage.type.class.js",
                    "storage.type.js",
                    "entity.other.attribute-name"
                ],
                "settings": {
                    "fontStyle": "italic"
                }
            },
            {
                "scope": [
                    "keyword.control.conditional",
                    "keyword.operator"
                ],
                "settings": {
                    "fontStyle": ""
                }
            }
        ]
    }
  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft