Skip to main content

Markdown Editor

Yooz Notes features a Bear-style live markdown editor with instant visual feedback. See your formatting as you type, no preview pane needed.

How It Works​

Unlike traditional markdown editors with separate edit and preview modes, Yooz Notes shows formatted text inline. Type **bold** and it becomes bold immediately while remaining editable.

Text Formatting​

Basic Styles​

SyntaxResultShortcut
**text**BoldCmd/Ctrl + B
*text*ItalicCmd/Ctrl + I
~~text~~Strikethrough-
`code`Inline codeCmd/Ctrl + E

Combining Styles​

You can combine formatting:

  • ***bold and italic*** becomes bold and italic
  • **~~bold strikethrough~~** becomes bold strikethrough

Headings​

Use # symbols for headings. More # means smaller heading:

# Heading 1 (largest)
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6 (smallest)
Pro Tip

The first line of your note automatically becomes the title. Use # Heading for a clear, styled title.

Lists​

Bullet Lists​

- Item one
- Item two
  - Nested item
  - Another nested
- Item three

Numbered Lists​

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

Task Lists​

Create interactive checkboxes:

- [ ] Incomplete task
- [x] Completed task
- [ ] Another todo

Click checkboxes to toggle completion status.

[Link text](https://example.com)
[Yooz Notes](https://yooz.live/notes)

Images​

![Alt text](image-url.png)

You can also drag and drop images directly into your notes.

Code​

Inline Code​

Use backticks for inline code: `const x = 1` becomes const x = 1

Code Blocks​

Use triple backticks with optional language for syntax highlighting:

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

Supported languages include: JavaScript, TypeScript, Python, Rust, Go, HTML, CSS, JSON, YAML, Bash, and many more.

Blockquotes​

Use > for quotes:

> This is a blockquote.
> It can span multiple lines.
>
> > Nested quotes work too.

Horizontal Rules​

Create dividers with three or more dashes, asterisks, or underscores:

---
***
___

Tables​

Create tables using pipes and dashes:

| Feature | Free | Pro |
|---------|------|-----|
| Notes | Unlimited | Unlimited |
| Encryption | Yes | Yes |
| Sync | No | Yes |

Alignment options:

  • :--- Left align
  • :---: Center align
  • ---: Right align

Mermaid Diagrams​

Yooz Notes supports Mermaid diagrams for flowcharts, sequence diagrams, and more:

```mermaid
graph LR
    A[Write] --> B[Format]
    B --> C[Share]
```

See Mermaid Diagrams for complete documentation.

Keyboard Shortcuts​

ActionmacOSWindows/Linux
BoldCmd + BCtrl + B
ItalicCmd + ICtrl + I
CodeCmd + ECtrl + E
LinkCmd + KCtrl + K
HeadingCmd + 1-6Ctrl + 1-6
New NoteCmd + NCtrl + N
SearchCmd + FCtrl + F
SaveAutoAuto

Best Practices​

Structure Your Notes​

  1. Start with a heading - Makes the title clear
  2. Use subheadings - Break content into sections
  3. Keep paragraphs short - Easier to scan
  4. Use lists - For steps or related items

Markdown Tips​

  • Don't over-format - Let content speak
  • Use task lists - Track todos inline
  • Add code blocks - For technical notes
  • Include diagrams - Visualize complex ideas

Privacy Note​

Local Processing

All markdown rendering happens locally in your browser. Your notes never leave your device for formatting.

Learn More​