Blog System Formatting Guide
Published on: August 23, 2025
2 min read

Table of Contents
Markdown Formatting Reference
A showcase of all available formatting features in this blog system.
Text & Headers
Bold, italic, both, strikethrough, inline code, links
Custom Badge
Headers 1-6
Header 1
Header 2
Header 3
Header 4
Header 5
Header 6
Lists
- Unordered item
- Nested item
- Completed task
- Incomplete task
- Ordered item
- Nested ordered
- Another item
Alerts & Quotes
Standard blockquote with formatting
Alert component with markdown support!
Code Examples
Basic Usage
inline code, plain blocks, and syntax highlighting:
const config = { apiUrl: 'https://api.example.com', timeout: 5000, retries: 3,};npm install && npm run devgit add . && git commit -m "update"src/├── components/├── features/└── pages/Tables
| Language | Use Case | Rating |
|---|---|---|
| JavaScript | Web Dev | ⭐⭐⭐⭐⭐ |
| Python | AI/Data | ⭐⭐⭐⭐⭐ |
| Rust | Systems | ⭐⭐⭐ |
Images


Interactive Components
This is a live React component with full interactivity:
Advanced Features
Mathematical expressions: E = mc², a² + b² = c²
🌈 Custom HTML
Tailwind + HTML mixed with markdown
Special characters: 😀 🎉 🚀 💻 ⚡ 🔥
Keyboard shortcuts: Ctrl + C
Quick Reference
✅ Text: **bold**, *italic*, `code`, [links](url)
✅ Code: Syntax highlighting, line numbers, diffs, titles
✅ Components: React/Astro integration, cards, alerts
✅ Media: Optimized images, responsive design
✅ HTML: Custom styling with Tailwind CSS
Mix markdown, React components, and HTML for rich content!
Complete formatting reference for this blog system.