The front matter is a YAML block at the beginning of a blog post’s markdown file. It contains metadata about the post, such as the title, description, cover image, tags, category, etc.

This post showcases the basic reference of how to use the front matter correctly and what values are expected and possible. The full front matter config can be found at src/content.config.ts.

Example Front Matter

---
title: Front Matter Reference
published: 2026-01-13
description: This post showcases how to use front matter in a blog post.
cover: '/assets/images/banners/98431621_p0_master1200.jpg'
coverCredit: {text: "Magic Power City - Gilsun", url: 'https://www.pixiv.net/en/artworks/98431621'}
tags: [Example, Reference, Front Matter]
hex: '#32a852'
category: Examples
draft: false

licenseName: "MIT License"
author: "wlft"
sourceLink: "https://github.com/wlft/aoyuki"
licenseUrl: "https://github.com/wlft/aoyuki/blob/main/LICENSE"
---

Reference

Title <string>

The title is a string that represents the title of the post. It is required.

title: Front Matter Reference

Published <string: yyyy-mm-dd || yyyy-mm-ddThh:mm.sssZ>

The published date is a string that represents the date the post was published. It is required.

published: 2026-01-13

Or, to include hours, minutes, and seconds:

published: 2026-01-13T07:04:20.000Z

Description <string>

The description is a string that represents the description of the post. It is optional.

description: This post showcases how to use front matter in a blog post.

Cover <string>

The cover is a string that represents the cover image of the post. It is optional.

cover: '/assets/images/banners/98431621_p0_master1200.jpg'

Cover Credit <object>

The cover credit is an object that represents the credit of the cover image. It is optional.

coverCredit: {text: "Magic Power City - Gilsun", url: 'https://www.pixiv.net/en/artworks/98431621'}

Tags <array<string>>

The tags are an array of strings that represents the tags of the post. It is optional.

tags: [Example, Reference, Front Matter]

Hex <string: hex-color>

The hex is a string that represents the hex color of the post. It is optional.

hex: '#32a852'

Category <string>

The category is a string that represents the category of the post. It is optional.

category: Examples

Draft <boolean>

The draft is a boolean that represents whether the post is a draft. It is optional.

draft: false

License Name <string>

The license name is a string that represents the license name of the post. It is optional.

licenseName: "Unlicensed"

Author <string>

The author is a string that represents the author of the post. It is optional.

author: emn178

Source Link <string>

The source link is a string that represents the source link of the post. It is optional.

sourceLink: "https://github.com/wlft/aoyuki"

License URL <string>

The license URL is a string that represents the license URL of the post. It is optional.

licenseUrl: "https://github.com/wlft/aoyuki"