Ko.Yelie

<div class="code-block-container"><pre class="language-pug"><code class="language-pug">mixin button
 #{typeof attributes.href === 'string' ? 'a' : 'button'}.button&amp;attributes(attributes)
 block
</code></pre></div>Pugのタグ名を変数で切り替える方法。タグ名部分を <code>#{}</code> にしてタグ名文字列を出力。 
ロゴのh1/pタグ切り替えにも使える。

<div class="code-block-container"><pre class="language-pug"><code class="language-pug">each char in 'Text'
 span= char
</code></pre></div>↓
<div class="code-block-container"><pre class="language-html"><code class="language-html">&lt;span&gt;T&lt;/span&gt;&lt;span&gt;e&lt;/span&gt;&lt;span&gt;x&lt;/span&gt;&lt;span&gt;t&lt;/span&gt;
</code></pre></div>Pugでテキストを1文字ずつ分割する方法。 
一文字ずつタイミングずらしてアニメーションさせるときに使える。（テキストが動的な場合はJSで分割する）