Callouts

support:

• Obsidian Admonition callout syntax
• 12 types
• aliases
• collapsible state

syntax:

> [!info] Title
> 
> This is a callout!

reference:

• Obsidian Callouts Doc

Warning

If callouts fail to render, ensure ObsidianFlavoredMarkdown is ordered after SyntaxHighlighting in plugins.

Customization

source:

• Provider: ObsidianFlavoredMarkdown
• Icons: quartz/styles/callouts.scss

Add custom callouts

custom_callouts:

• Default style: note
• Override file: quartz/styles/custom.scss

quartz/styles/custom.scss

.callout {
  &[data-callout="custom"] {
    --color: #customcolor;
    --border: #custombordercolor;
    --bg: #custombg;
    --callout-icon: url("data:image/svg+xml; utf8, <custom formatted svg>"); //SVG icon code
  }
}

Warning

URL-encode SVG before adding to CSS; encoder: URL Encoder.

Showcase

Info

Default title

Can callouts be nested?

Yes!, they can. And collapsed!

You can even use multiple layers of nesting.

Note

Aliases: “note”

Abstract

Aliases: “abstract”, “summary”, “tldr”

Info

Aliases: “info”

Todo

Aliases: “todo”

Tip

Aliases: “tip”, “hint”, “important”

Success

Aliases: “success”, “check”, “done”

Question

Aliases: “question”, “help”, “faq”

Warning

Aliases: “warning”, “attention”, “caution”

Failure

Aliases: “failure”, “missing”, “fail”

Danger

Aliases: “danger”, “error”

Bug

Aliases: “bug”

Example

Aliases: “example”

Quote

Aliases: “quote”, “cite”