<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"><channel><title>Icons on Liftoff</title><link>https://hugo-liftoff.kevinhorst.de/en/tags/icons/</link><description>Recent content in Icons on Liftoff</description><generator>Hugo</generator><language>en</language><lastBuildDate>Fri, 12 Jun 2026 00:00:00 +0000</lastBuildDate><atom:link href="https://hugo-liftoff.kevinhorst.de/en/tags/icons/index.xml" rel="self" type="application/rss+xml"/><item><title>Icons without a build step</title><link>https://hugo-liftoff.kevinhorst.de/en/articles/icons-without-a-build-step/</link><pubDate>Fri, 12 Jun 2026 00:00:00 +0000</pubDate><guid>https://hugo-liftoff.kevinhorst.de/en/articles/icons-without-a-build-step/</guid><description>&lt;p&gt;Icon fonts ship every glyph to every visitor. Sprite sheets need a
build step and a naming convention nobody remembers. Liftoff takes a
third route: it fetches each icon from the Iconify API while Hugo
builds, and inlines the SVG.&lt;/p&gt;
&lt;div class="codeblock"&gt;
 &lt;div class="codeblock__head"&gt;
 &lt;span class="codeblock__lang"&gt;go-html-template&lt;/span&gt;
 &lt;button type="button" class="codeblock__copy" data-action="copy-code" aria-label="Copy"&gt;Copy&lt;/button&gt;
 &lt;/div&gt;
 &lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-go-html-template" data-lang="go-html-template"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="cp"&gt;{{&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="nx"&gt;partial&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s"&gt;&amp;#34;icon.html&amp;#34;&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s"&gt;&amp;#34;simple-icons:codeberg&amp;#34;&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="cp"&gt;}}&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;Any set on Iconify works, addressed as &lt;code&gt;set:name&lt;/code&gt;. A bare name falls
back to Material Design Icons, so &lt;code&gt;check&lt;/code&gt; and &lt;code&gt;mdi:check&lt;/code&gt; are the same
icon.&lt;/p&gt;</description></item></channel></rss>