YAML Frontmatter Generator and Editor
Generate and edit YAML front matter for markdown. Presets for Hugo, Jekyll, Astro and Docusaurus, YAML validation, and extract or inject frontmatter.
--- title: Getting Started with Static Sites description: A short guide to building your first static site and deploying it. date: 2026-09-01 author: Jane Doe tags: - tutorial - static-sites categories: - guides draft: false slug: getting-started-with-static-sites image: /images/getting-started.png weight: 10 ---
What Is YAML Front Matter?
YAML front matter is the metadata block at the top of a markdown file, written as key: value pairs between two lines of three dashes. Static site generators such as Hugo, Jekyll, Astro and Docusaurus read it to get the page title, publication date, tags, layout and draft status, then strip it before the body is rendered. The same idea exists in TOML (between +++ lines) and JSON form.
This markdown frontmatter tool builds the block from a form, applies the field names each generator expects, and can also open an existing post so you can edit its metadata without breaking the YAML. Everything runs in your browser.
How to Generate Markdown Frontmatter
- Choose a preset: Generic, Hugo, Jekyll, Astro, Docusaurus, Eleventy or Next.js MDX. The preset decides the key names and their order.
- Pick the output format. YAML is the default; Hugo users can switch to TOML.
- Fill in the title, description, date, author, tags and categories. Use From title to derive a slug.
- Add custom fields for anything the preset does not cover, such as weight, layout or sidebar_position. Values like 10, true or [a, b] are typed automatically.
- Copy the block into the top of your markdown file, or download it.
Field Names by Static Site Generator
The presets rename the standard fields so the output matches what each generator reads by default:
| Field | Hugo frontmatter | Jekyll frontmatter | Astro | Docusaurus |
|---|---|---|---|---|
| Publish date | date | date | pubDate | date |
| Updated | lastmod | last_modified_at | updatedDate | last_update.date |
| Hidden page | draft: true | published: false | draft: true | draft: true |
| URL | slug | permalink | slug | slug |
| Cover image | images (list) | image | heroImage | image |
| Author | author | author | author | authors (list) |
Using the Frontmatter Editor on an Existing Post
Switch to Existing document and paste a full markdown file. The frontmatter editor detects whether the block is YAML, TOML or JSON, parses it, and reports the first error with a line and column when the YAML is invalid: an unquoted colon in the title, a tab instead of spaces, or a list item outside a list. Click Load fields from document to fill the form, edit what you need, and the output pane shows the complete document with the new block in place. Keys the form does not know about are preserved as custom fields, so nothing is lost when you round-trip a post.
Why Generate YAML Front Matter Instead of Typing It
Hand-written YAML front matter fails in quiet ways: a title containing a colon parses as a nested mapping, a date written as 1/2/2026 becomes a string, and a list typed with tabs is rejected outright. The generator quotes strings only when YAML requires it, keeps dates in ISO format, and emits lists in block style, so the block is valid before it reaches your build. Pair it with the meta tag generator when the same title and description also feed your page head.
Frequently Asked Questions
What is YAML front matter in markdown?
YAML front matter is a block of key: value metadata between two --- lines at the very top of a markdown file. Static site generators read it for the title, date, tags and layout of a page and strip it before rendering the body. It must be the first thing in the file, with no blank line before the opening ---.
Which front matter format should I use: YAML, TOML or JSON?
YAML is the default for Jekyll, Astro, Docusaurus, Eleventy and most Next.js MDX setups, so use it unless your generator prefers something else. Hugo accepts all three and its themes often ship TOML examples between +++ lines. JSON front matter is rare but useful when the metadata is produced by a script.
How is Hugo frontmatter different from Jekyll frontmatter?
Hugo uses lastmod for the update date, images as a list and draft: true to hide a page. Jekyll has no draft key: it uses published: false, last_modified_at and permalink instead. Pick the matching preset and the generator renames the keys for you.
Can I edit the front matter of an existing post?
Yes. Switch to Existing document, paste the markdown file, and the tool detects the YAML, TOML or JSON block, validates it, and loads every key into the form. Unknown keys are kept as custom fields, and the output is the full document with the updated block re-injected.
Why does my YAML front matter break the build?
The usual causes are an unquoted colon in a title, tabs used for indentation, or a stray value after a list. The Existing document mode reports the line and column of the first YAML error, and the generator quotes strings that contain special characters so the output always parses.
Does the frontmatter editor upload my files?
No. Parsing and generation run in your browser with js-yaml; nothing you paste is sent to a server.