The hint shortcode generates callout blocks for displaying information, recommendations, warnings, or alerts within the documentation.

Basic usage #

You can specify the hint type as the first positional parameter:

{{< hint info >}}
This is an **informational** hint.
{{< /hint >}}

Result #

Parameters #

ParameterPositionTypeRequiredDescription
type0stringNoHint type. Used to generate the alert-{type} class.
icon1stringNoName of a Meteor Icons icon.

Both parameters can be specified as either named or positional parameters.

Hint types #

Hudocs does not restrict the values of type. The following values have styles defined by the theme:

TypeUsage
infoInformation and supplementary notes.
successConfirmations or successful outcomes.
warningWarnings and potential issues.
dangerRisks or destructive actions.

If no type is specified, the hint uses the theme’s neutral appearance:

{{< hint >}}
A general annotation.
{{< /hint >}}

Icons #

You can add an icon using icon:

{{< hint type="success" icon="circle-info" >}}
This hint includes an icon.
{{< /hint >}}

You can also provide the icon as the second positional parameter:

{{< hint warning triangle-exclamation >}}
Check the requirements before continuing.
{{< /hint >}}

If no icon is specified, the hint is displayed without one.

Accessibility #

The shortcode renders an <aside> element with role="note" and calculates an accessible name using aria-label based on the hint type (e.g. aria-label="Warning", or aria-label="Note" by default).

Markdown support #

The hint content is processed via .Page.RenderString, so it supports Markdown, including links, code, highlighted text, and lists.