This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme.

Feel free to switch between the light and dark themes to see how the diagram adapts its colors accordingly.

# Mermaid Diagrams

gantt
    title A Gantt Diagram
    dateFormat YYYY-MM-DD
    section Section
        A task          :a1, 2014-01-01, 30d
        Another task    :after a1, 20d
    section Another
        Task in Another :2014-01-12, 12d
        another task    :24d

Get more examples at About Mermaid

To use an icon, simply copy its shortcode and paste it into your content where you want the icon to appear. The shortcode must be enclosed in {{< >}}.

# Individual support for code, pre, kbd, mark

code

pre

CRTL + K + B + D

There are 9 tests.