Embedding CSS Animation Demos in Hugo Articles
Hugo shortcodes make it easy to embed live code demos. Here are three ways: The diagram first separates their boundaries: a native shortcode, a CodePen iframe, and a CodeSandbox app serve different complexity levels and execute code in different places.
Three embed paths: prefer a native shortcode for simple, versioned effects; CodePen for shareable snippets; and CodeSandbox for a complete interactive application. 1. Inline CSS Demo (No External Service) # A spinning loader animation, right in the article: