Easily create complex interfaces directly within your content.
Add lazy-loaded images, alerts, blockquotes and design great-looking web forms directly from within your content. Dozens of examples provided below:
Shortcode Description
Alert Display contextual alert messages and dialogs.
Blockquote Create pull quotes with citations and citation links.
Button Add colorful buttons to forms and pages.
Button Group Layout buttons to fit buttons snugly together.
Card Display a bordered container with title area.
Cell Display a responsive cell inside a grid.
External Create links with external icon and custom behavior.
Figure Load images progressively with blurry placeholders.
Form Collect, validate and handle user input.
Form Group Use with Label to visualize control validation states.
Grid Display a responsive grid with cells.
Help Block Combine with form controls to guide user input.
Label Provide accessible captions for form controls.
Progress Show graphical progress bars with completion percentage.
Select List a group of options in a drop-down menu.
Text Area Add a multi-line plain-text editing control.
Text Input Add a single-line plain-text editing control.
Throbber Display a CSS-only loading indicator.
Video Lazy-load videos and control playback options.

In addition to the above you may Use Hugo's Built-in Shortcodes as well.