11ty (Eleventy) Tutorial
Emoji Favicon for Eleventy
Add an emoji favicon to Eleventy by editing your base layout.
<link rel="icon" href="https://emojifavicons.com/rocket">How to add an emoji favicon to Eleventy
1
Open your layout (commonly _includes/base.njk)
Find the <head>.
2
Add the favicon link
Paste the link tags inside head.
{# _includes/base.njk #}
<link rel="icon" type="image/svg+xml" href="https://emojifavicons.com/rocket">
<link rel="apple-touch-icon" href="https://emojifavicons.com/apple-touch-icon/rocket">Popular emoji favicons for Eleventy
Click any emoji to see the Eleventy-specific install snippet.
Troubleshooting
Eleventy passthrough copying old favicon
Remove the .eleventyignore or the addPassthroughCopy rule for favicon.ico.
Nunjucks escaping the link
Use plain HTML — no Nunjucks expressions inside the <link>.
Frequently asked questions
Does it work with Eleventy’s layout inheritance?
Yes — put the favicon in the topmost layout (usually base.njk).
Does it work with @11ty/eleventy-img?
Favicons are unrelated to eleventy-img.