This is a document that comprehensively tests all Markdown syntax features supported by the Shiroi blog system.

Basic Markdown Syntax
Extended Text Formatting
Lists & Tasks
Tables
Mathematical Formulas (KaTeX)
Code Blocks
Containers & Layouts
Rich Links
Mentions & Social
Alerts
Definition Lists
Footnotes
Multimedia
Advanced Features

Basic Markdown Syntax

Heading Levels

H1

H2

H3

H4

H5

H6

Text Styles

This is a normal paragraph.

This is bold text

This is italic text

This is bold italic text

~~This is strikethrough text~~

Links & Images

This is a link

Horizontal Rule

Blockquote

This is a blockquote.
Blockquotes can contain multiple paragraphs.
— Source

Extended Text Formatting

Highlight (Mark)

This is highlighted text, used to emphasize important content.

Insert Text

This is newly inserted content.

Spoiler Text

||hidden|| text.

Inline Code

Use console.log() for debugging.

Lists & Tasks

Unordered List

Item 1
Item 2
- Subitem 2.1
- Subitem 2.2
  - Nested Subitem 2.2.1
Item 3

Ordered List

Step 1
Step 2
1. Substep 2.1
2. Substep 2.2
Step 3

GFM Task List

Task to do
Completed task
Another completed task
Task in progress

Tables

Basic Table

Header 1	Header 2	Header 3
Cell 1	Cell 2	Cell 3
Cell 4	Cell 5	Cell 6

Alignment

Left Align	Center Align	Right Align
Content A	Content B	Content C
Data 1	Data 2	Data 3

Complex Table Example

Expression	Example	Description
File	`options.txt`	Text file
Variable	`<version>`	Placeholder
Must Delete	`libraries ***`	Marked with stars

Mathematical Formulas (KaTeX)

Inline Formulas

This is an inline formula: $c = \pm\sqrt{a^2 + b^2}$

Einstein's mass-energy equation: $E = mc^2$

Polynomial: $P(x) = a_nx^n+a_{n-1}x^{n-1} + \dots + a_1x + a_0$

Block Formulas

\frac{d}{dx}\int_{a}^{x} f(t)dt = f(x)

\sum_{i=1}^{n} i = \frac{n(n+1)}{2}

P\left(U,T\right)=100\left.\left(0.6\min\left(1,\frac{U-0.70}{0.90-0.70}\right)+0.4\min\left(1,\frac{T-4000}{14000-4000}\right)\right)\right.

Code Blocks

JavaScript

function greet(name) {
  console.log(`Hello, ${name}!`)
  return `Welcome to Shiroi`
}

greet('World')

TypeScript

interface User {
  id: number
  name: string
  email: string
}

const createUser = (user: User): void => {
  console.log(`Creating user: ${user.name}`)
}

Python

PYTHON

def fibonacci(n):
    if n <= 1:
        return n
    return fibonacci(n-1) + fibonacci(n-2)

print(fibonacci(10))

Shell

BASH

#!/bin/bash
echo "Starting Shiroi..."
pnpm install
pnpm dev

Mermaid Flowchart

CodeBlock Loading...

Mermaid Sequence Diagram

CodeBlock Loading...

Containers & Layouts

Gallery

Grid Layout

Grid Item 1

Content of the first grid item.

Grid Item 2

Content of the second grid item.

Grid Item 3

Content of the third grid item.

Image Grid

Masonry Layout

Rich Links

Shiroi supports automatic recognition and rendering for multiple platform links.

Twitter/X

YouTube

CodeSandbox

Regular Links

TRPC Documentation

GitHub User Mention

Innei

Twitter User Mention

pseudoyu

Telegram User Mention

Some User

Auto Display Names

InneiInneiInnei

Alerts

NOTE

Note

This is a note providing useful information.

TIP

Tip

This is a tip to help users complete tasks better.

IMPORTANT

Important

This is important information, users should pay special attention.

WARNING

Warning

This is a warning, immediate attention required.

CAUTION

Caution

This is a caution, reminding users of potential risks.

Definition Lists

Basic Definitions

Term 1 : Definition of Term 1. Can contain multiple lines.

Term 2 : First definition of Term 2. : Second definition of Term 2.

Formatted Definitions

HTML : Hyper Text Markup Language : Standard language for creating web pages.

CSS : Cascading Style Sheets : Language describing webpage styles.

Compact Style

Term 1 ~ Definition 1

Term 2 ~ Definition 2a ~ Definition 2b

Footnotes

This is a text with a footnote^{[^1]}. You can add footnote references anywhere^{[^2]}.

Footnotes automatically display at the end.

Multimedia

Video

Can use <video> tag or video links.

LinkCard Component

Advanced Features

Abbreviations

Example for HTML, automatically marked as abbreviation.

*Text Markup Language

Details Collapse

Tabs

Content of the first tab.

Excalidraw

Whiteboard loading…

React Remote Component Rendering

Component Loading...

Comprehensive Test

This section tests a mix of features.

Nested Feature Test

Tip

Use highlight and ~~spoiler~~ in blockquotes.

Formula: $E = mc^2$

Code: const x = 10

Complex List Content

First Item: contains code and italic
- Subitem 1: highlighted text
- Subitem 2: link text
Second Item: formula $sum_{i=1}^{n} i$

Third Item:

// Code block in list
console.log('Hello from list')

Table Formatting

Feature	Syntax	Example
Bold	`text`	Bold
Italic	`text`	Italic
Code	`code`	`code`
Highlight	`==text==`	Highlight
Formula	$formula$	$x^2$

Test Summary

This document covers all special Markdown syntax supported by Shiroi, including:

✅ Basic Syntax: headings, paragraphs, lists, links, images, tables, blockquotes
✅ Extended Text: highlight (==), insert (++), spoiler (||)
✅ Task Lists: GFM Tasks
✅ Mathematical Formulas: KaTeX inline and block
✅ Code Highlighting: Shiki multi-language support
✅ Containers & Layouts: Banner, Gallery, Grid, Masonry
✅ Rich Links: GitHub, Twitter, YouTube auto-detection
✅ Social Mentions: GH, TW, TG user mentions
✅ Alerts: GitHub Alerts (NOTE/TIP/WARNING, etc.)
✅ Definition Lists: term definitions
✅ Footnotes: references
✅ Advanced Features: Tabs, Excalidraw, remote components

Last Updated: February 17, 2026
Project: Shiroi (白い)
Document Version: 1.0.0

1: First footnote content.
Return1
2: Second footnote content with more details.
Return2

Shiroi Markdown Feature Test