Markdown Cheat Sheet & GFM Guide
Searchable quick reference for standard Markdown and GitHub Flavored Markdown (GFM). Copy formatted tables, code fences, interactive task lists, and GitHub callout alerts with one click.
Official GitHub Flavored Markdown callout alert rendered with blue outline in GitHub issues & READMEs.
> [!NOTE] > Highlights useful information that users should know.
Amber-styled alert block used to warn against breaking changes and deprecations.
> [!WARNING] > Critical content demanding immediate user attention.
Green-styled callout block for best practices and optimization tips.
> [!TIP] > Helpful advice for doing things better or more easily.
Purple-styled callout emphasizing requirements and prerequisites.
> [!IMPORTANT] > Crucial information necessary for users to succeed.
Red alert for high-risk operations (e.g. data loss or security issues).
> [!CAUTION] > Negative potential consequences of an action.
Colons in the header separator row define text alignment (:--- left, :---: center, ---: right).
| Feature | Status | Notes | | :--- | :---: | ---: | | Zero-Server | Active | 100% On-Device | | Offline PWA | Ready | Installable |
Specify the language identifier directly after the first three backticks.
```typescript
interface User {
id: string;
email: string;
active: boolean;
}
```Wrap code tokens in single backticks for monospace inline rendering.
Run `npm run build` to verify production assets.
Rendered as clickable checkboxes on GitHub and modern markdown viewers.
- [x] Complete security review - [ ] Deploy to production - [ ] Send release notes
Indent sub-items with exactly 3 or 4 spaces.
1. Phase 1: Planning - Architecture review - Schema modeling 2. Phase 2: Execution
Always add a space between the '#' characters and the heading title.
# Heading 1 ## Heading 2 ### Heading 3 #### Heading 4
Standard markdown formatting supported across all markdown engines.
**Bold text**, *italic text*, and ~~strikethrough text~~.
Leave a blank line after <summary> so markdown inside details parses properly.
<details>
<summary>Click to view debug logs</summary>
```json
{"status": 200, "ok": true}
```
</details>Optional quotation string after URL provides accessible tooltip text.
[DevToolkit Hub](https://devtoolkit-hub.vercel.app/ "Visit DevToolkit Hub")
Standard syntax for GitHub project README headers.
[](https://opensource.org/licenses/MIT)
GFM footnote spec. Clickable anchor links between citation and reference.
Zero-server tools process data on-device[^1]. [^1]: Verified via browser DevTools network tab.
Markdown Previewer
Live client-side GitHub Flavored Markdown editor with real-time HTML compiler.
Open Markdown EditorGitHub README Generator
Generate production-ready README.md files with badges, tech stack, and structure.
Open README GeneratorCode & Text Diff Checker
Compare markdown files, documents, and code line-by-line with unified patch export.
Open Diff CheckerFrequently Asked Questions
How do I create callout alerts in GitHub Markdown?
GitHub uses blockquote syntax prefixed with an alert tag: '> [!NOTE]', '> [!TIP]', '> [!IMPORTANT]', '> [!WARNING]', or '> [!CAUTION]'. They render with distinctive icons and colors on GitHub repositories, issues, and discussions.
How do I align table columns to the left, center, or right in Markdown?
Use colons in the header divider row: ':---' for left alignment, ':---:' for center alignment, and '---:' for right alignment.
How do I render interactive checkboxes and task lists in Markdown?
Prefix list items with '- [ ] ' for an unchecked task or '- [x] ' for a completed task. GitHub and modern editors render these as interactive checkboxes.
How do I add syntax highlighting to a fenced code block?
Specify the language identifier immediately after the opening triple backticks, such as ```typescript, ```python, ```json, or ```bash.