Skip to content

Obsidian Notes

Callouts Use callouts to include additional content without breaking the flow of your notes.

To create a callout, add [!info] to the first line of a blockquote, where info is the type identifier. The type identifier determines how the callout looks and feels. To see all available types, refer to Supported types. Callouts are also supported natively on Obsidian Publish.

Here’s a callout title Here’s a callout block. It supports Markdown, Wikilinks and embeds! Engelbart.jpg

You can insert a default ![note] callout using the Insert callout command. The cursor automatically positions in the callout name field, letting you delete the default name and type a new one before editing the content.

To wrap existing content in a callout, select the text (including lists, code blocks, etc.) and run the Insert callout command. The selected content will be automatically enclosed in the callout.

In Live Preview, you can also right-click the callout name to change the callout type.

Change the title By default, the title of the callout is its type identifier in title case. You can change it by adding text after the type identifier:

You can even omit the body to create title-only callouts:

A plus sign expands the callout by default, and a minus sign collapses it instead.

:::

:::

To define a custom callout, create the following CSS block:

.callout[data-callout=“custom-question-type”] { —callout-color: 0, 0, 0; —callout-icon: lucide-alert-circle; } The value of the data-callout attribute is the type identifier you want to use, for example [!custom-question-type].

—callout-color defines the background color using numbers (0–255) for red, green, and blue. —callout-icon can be an icon ID from lucide.dev, or an SVG element. Note about lucide icon versions Obsidian updates Lucide icons periodically. The current version included is shown below; use these or earlier icons in custom callouts. Version 0.446.0 ISC License Copyright (c) 2020, Lucide Contributors

SVG icons Instead of using a Lucide icon, you can also use a SVG element as the callout icon.

—callout-icon: ‘…custom svg…’; Supported types You can use several callout types and aliases. Each type comes with a different background color and icon.

To use these default styles, replace info in the examples with any of these types, such as [!tip] or [!warning]. Callout types can also be changed by right-clicking a callout in Live Preview mode.

Unless you Customize callouts, any unsupported type defaults to the note type. The type identifier is case-insensitive.

Note

Info Todo Tip Aliases: hint, important

Success Aliases: check, done

Question Aliases: help, faq

Warning Aliases: caution, attention

Failure Aliases: fail, missing

Danger Alias: error

Bug Example Quote Alias: cite

Links to this page Basic formatting syntax Filters Obsidian Flavored Markdown Style guide