The Front Matter extension for Visual Studio Code is an ideal choice for developers who want to simplify the process of operating and managing their markdown articles. It provides users with the power and control of a full-blown CMS, allowing them to keep a list of used tags, categories, create content, preview posts before publishing, and more. The extension supports several static-site generators and frameworks, including Hugo, Jekyll, Hexo, NextJs, Gatsby, and more.

Welcome screen to configure your website

We present our extension which provides the following features to a technical audience:

  • a page dashboard providing an overview of markdown pages with the ability to search, filter and type content;
  • a site preview within Visual Studio Code;
  • SEO checks for title, description and keywords;
  • support for custom actions/scripts;
  • and many more features.

Site preview

Why Front Matter?

Initially, Elio Struyf developed the Front Matter extension when migrating from WordPress to Hugo (Static web site Generator), in order to facilitate content management. Over time, he expanded the extension's capabilities, until it eventually evolved into a headless CMS that runs in Visual Studio Code.


We believe that Front Matter gives you the subsequent advantages:


It simply runs on your machine. There are no servers/websites/APIs involved in the process. Nothing can beat this.

Use it within Visual Studio Code

Don't jump from tool to tool. Use the tool that you like the most: of course, that's Visual Studio Code.


Almost all of the Front Matter features are customizable in its settings. These settings ensure that you can tweak Front Matter to your needs.


We recognize that each website is different. That is why you can upload your custom scripts. These scripts will display as actions in the Front Matter panel and take your content material control to the next level.

Example: Generate open graph preview image in Code with Front Matter


Last updated on

Did you spot an issue in our documentation, or want to contribute? Edit this page on Github!

Ready to get started?

Special thanks to our backers & sponsors

VercelBEJS Community