Skip to navigation Skip to main content
Eleventy
Eleventy Documentation
Stable
3.0.0
Toggle Menu
Eleventy 1.93s
Astro 22.90s

IndieWeb Avatar

Contents

Feed this runtime service a URL and it will extract an avatar image using these sources:

  1. <link rel="apple-touch-icon">
  2. <link rel="apple-touch-icon-precomposed">
  3. <link rel="icon">
  4. favicon.ico
  5. favicon.ico that isn’t an .ico file
  6. First <img> in <header>

All rel lookups match against attribute values that are space separated lists.

Open Source

Usage

Try it out on the Eleventy API Explorer.

Image URLs have the format:

https://v1.indieweb-avatar.11ty.dev/:url/
  • url must be URI encoded.

Samples

IndieWeb Avatar for 11ty.dev/ IndieWeb Avatar for a11yproject.com/ IndieWeb Avatar for netlify.com/
<img
src="https://v1.indieweb-avatar.11ty.dev/https%3A%2F%2Fwww.11ty.dev%2F/"
alt="IndieWeb Avatar for 11ty.dev/"
loading="lazy"
decoding="async"
width="50"
height="50"
/>

<img
src="https://v1.indieweb-avatar.11ty.dev/https%3A%2F%2Fwww.a11yproject.com%2F/"
alt="IndieWeb Avatar for a11yproject.com/"
loading="lazy"
decoding="async"
width="50"
height="50"
/>

<img
src="https://v1.indieweb-avatar.11ty.dev/https%3A%2F%2Fwww.netlify.com%2F/"
alt="IndieWeb Avatar for netlify.com/"
loading="lazy"
decoding="async"
width="50"
height="50"
/>

Other pages in API Services: