Markdown authoring guide
A practical guide showing how Papyrus renders Markdown, callouts, code, media, diagrams, and source actions.
Papyrus uses regular Astro Markdown. A post stays readable as plain text and builds into an article page with source, share, tag, table-of-contents, and metadata actions when the site enables them.
This page is a quick rendering reference. Every section below is ordinary Markdown that a real post can use.
Headings
H1 inside content
H2 inside content
H3 inside content
H4 inside content
H5 inside content
H6 inside content
Paragraph features
Normal text remains readable. Bold text, italic text, bold italic text, strikethrough text, inline code, and normal links all sit cleanly in a paragraph.
Autolinks stay visible: https://github.com/marcelofpfelix/papyrus
Escaped characters remain literal: *not italic* and `not code`.
Images
Theme-aware SVGs
Inline SVGs can follow the active theme when they use currentColor or Papyrus
CSS variables:
<svg viewBox="0 0 80 40" role="img" aria-label="Theme-aware mark">
<rect width="80" height="40" rx="8" fill="var(--papyrus-panel)" />
<path d="M18 20h44" stroke="currentColor" stroke-width="6" stroke-linecap="round" />
<circle cx="40" cy="20" r="8" fill="var(--papyrus-accent)" />
</svg>htmlUse currentColor for single-color icons. Use var(--papyrus-bg),
var(--papyrus-fg), var(--papyrus-muted), var(--papyrus-panel), and
var(--papyrus-accent) for multi-color SVGs that belong to the theme.
An SVG loaded through <img src="/image.svg"> is its own document. It should
include its own var(--papyrus-*, fallback) colors if it needs theme-like
colors; Papyrus does not recolor arbitrary uploaded SVG files.
Lists
Unordered list:
- keep the site repo focused on content and configuration
- import reusable components from
astro-papyrus - avoid copying a whole upstream theme into each site
- keep overrides small enough to review
Ordered list:
- Write the post in
src/content/posts. - Let Astro build the static route.
- Use Papyrus layouts for repeated post UI.
Nested list:
- Theme
- layout
- post list
- prose styles
- Site
- content
- config
- minimal pages
Task list:
- base layout
- post layout
- search entry point
- graph view
Table
| Feature | Type | Current state |
|---|---|---|
| RSS | feed | working |
| Tags | metadata | route and search filter |
| Archive | index | visible when hidden posts exist |
| Graph view | data | generated from the AI graph export |
Right and center alignment:
| Left | Center | Right |
|---|---|---|
| alpha | beta | 10 |
| longer value | middle | 200 |
Blockquotes
A good theme makes normal markdown readable before it adds more features.
Nested quote:
First level
Second level
GitHub alerts
Notes are calm and readable.
Tips stand out without becoming noisy.
Important text is easy to scan.
Warnings stay visible in both light and dark mode.
Caution blocks keep the page rhythm intact.
Code
Inline code like pnpm build keeps paragraph line-height calm.
TypeScript with a title and highlighted lines:
import { PapyrusBaseLayout, PapyrusPostList } from "astro-papyrus/components";
import { publishedPosts } from "astro-papyrus/utils";
const posts = publishedPosts(await getCollection("posts"));tsRust:
#[derive(Debug, Clone)]
struct Repo {
owner: String,
name: String,
}
impl Repo {
fn slug(&self) -> String {
format!("{}/{}", self.owner, self.name)
}
}
fn main() {
let repo = Repo {
owner: "marcelofpfelix".into(),
name: "papyrus".into(),
};
println!("{}", repo.slug());
}rustDiff with add/remove line styling:
- .papyrus-icon-button:hover {
- background: var(--papyrus-panel);
- border-color: var(--papyrus-accent);
- }
+ .papyrus-icon-button:hover {
+ background: transparent;
+ color: var(--papyrus-accent);
+ }diffShell:
pnpm install
pnpm build
pnpm papyrus-llms src/content/posts public "$SITE_URL"shMermaid
Diagram source links:
Mermaid sourceOpen the Mermaid source file
PlantUML sourceOpen the PlantUML source file
Excalidraw sketchOpen the editable Excalidraw file
Link preview
Astro The web framework used by this blog and theme wrapper. astro.buildFootnotes
Footnotes are useful for small asides without breaking the main flow.1
Definition list
Papyrus : reusable layouts, components, and CSS
Site : content, config, and route composition
Details
Raw HTML details block
This checks whether HTML inside markdown keeps spacing and typography.
Horizontal rule
The content after the rule stays connected to the rest of the post.
What this page shows
Public posts can double as useful documentation. Readers see how authoring features work, and maintainers get one page that covers headings, prose, images, lists, callouts, code, diagrams, artifact links, link previews, footnotes, definition lists, and raw HTML details.
Footnotes
-
This is a GitHub-style footnote. ↩