Krokanti Notes uses a rich text editor powered by Tiptap. You can write in the visual editor or switch to source (Markdown) view using the <> button in the toolbar. All standard Markdown syntax is supported.

Switching to Markdown View

Click the <> button in the editor toolbar to toggle between visual and source (Markdown) views. Your content converts instantly — you can write raw Markdown and switch back to see the formatted result.

Basic Formatting

**bold text**
*italic text*
~~strikethrough~~
`inline code`

Renders as: bold text, italic text, ~~strikethrough~~, inline code

Headings

# Heading 1
## Heading 2
### Heading 3

Use headings to structure long notes. Heading 1 is the largest, Heading 3 the smallest.

Lists

Unordered list

- Item one
- Item two
  - Nested item

Ordered list

1. First step
2. Second step
3. Third step

Task list (checklist)

- [ ] Unchecked task
- [x] Completed task

Task lists render as interactive checkboxes in the visual editor — click to toggle without editing the source.

Links

[Link text](https://example.com)

To link to another note in Krokanti Notes, use the @mention feature in the visual editor — type @ followed by the note title, then select from the popup. This inserts an internal link automatically.

Images

![Alt text](https://example.com/image.png)

You can also paste images directly into the visual editor, or drag and drop image files — they upload to your personal CDN automatically.

Code Blocks

Wrap code with triple backticks and optionally specify a language:

```javascript
function greet(name) {
  return `Hello, ${name}!`;
}
```

Blockquotes

> This is a blockquote.
> It can span multiple lines.

Tables

| Column A | Column B | Column C |
|----------|----------|----------|
| Row 1    | Data     | More     |
| Row 2    | Data     | More     |

In the visual editor, use the table toolbar button to insert a table with a click. You can add/remove rows and columns with the context menu that appears when you click inside the table.

Horizontal Rule

---

A horizontal rule (---) draws a dividing line across the note.

Mermaid Diagrams

Krokanti Notes supports Mermaid diagrams inside fenced code blocks:

```mermaid
graph TD
  A[Start] --> B{Decision}
  B -->|Yes| C[Action 1]
  B -->|No| D[Action 2]
```

The diagram renders visually in the editor and in public note views. See the Mermaid Diagrams guide for more examples.

Tips

Markdown source is preserved exactly as written. Switching between visual and source view never loses formatting — it's a lossless conversion.

Use --- at the start of a line to create a horizontal rule (not to be confused with frontmatter, which isn't used inside the editor)
Nested lists work up to any depth — indent with 2 spaces per level
Tables automatically get a context menu with insert/delete row/column options in the visual editor

Markdown Guide