Showcases on formatting options with Docusarus
Formatting Examples (Docusaurus)
Below are common formatting patterns you can use in docs.
Grid: Rows and Columns
Left column
Use the Infima grid with row and col col--X classes.
Right column
This column uses a soft blue background for contrast.
Lists
- Unordered list item 1
- Unordered list item 2
- Nested item
- Ordered list item 1
- Ordered list item 2
- Task to do
- Completed task
Table
| Feature | Supported | Notes |
|---|---|---|
| Tables | Yes | GitHub-flavored Markdown |
| Grid | Yes | Use row/col classes |
| MDX | Yes | Mix Markdown and JSX |
Admonitions (Alert Boxes)
info
Informational callout with neutral tone.
tip
Tips appear in a positive, success-like style.
note
Notes are similar to info, often for references or side remarks.
warning
Warnings highlight potential pitfalls or caveats.
caution
Cautions draw attention to sensitive or risky actions.
danger
Danger blocks indicate destructive or unsafe actions.
Tabs
- JavaScript
- Python
console.log('Hello from JS');
print('Hello from Python')
Details (Collapsible)
Click to expand details
You can hide advanced information inside a collapsible details block.