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.

There are examples of how to use custom global-wise style or page-wise style.

Hugo ships with several Built-in Shortcodes for rich content, along with a Privacy Config and a set of Simple Shortcodes that enable static and no-JS versions of various social media embeds.

Lorem est tota propiore conpellat pectoribus de pectora summo. Redit teque digerit hominumque toris verebor lumina non cervice subde tollit usus habet Arctonque, furores quas nec ferunt. Quoque montibus nunc caluere tempus inhospita parcite confusaque translucet patri vestro qui optatis lumine cognoscere flos nubis! Fronde ipsamque patulos Dryopen deorum.

Mathematical notation in a Hugo project can be enabled by using third party JavaScript libraries.

Emoji can be enabled in a Hugo project in a number of ways.