Utility package to get favicons from the web. I don't know why, but it's so damn hard to get favicons just right. You may get different sizes, quality, background and other variables that make it a pain to work with.
Warning: this is a library meant to be run on Node.js (server-side).
First, install the package:
npm install @andresmarpz/faviconsThe Favicon object has the following structure
interface Favicon {
url: string;
size: number; // in bytes
extension: "ico" | "png" | "gif" | "jpg" | "jpeg" | "svg";
}This is the most common import, so it's probably what you are looking for.
import { getFavicons } from '@andresmarpz/favicons';
..
const favicons = await getFavicons('nextjs.org');
..Function to return only the biggest favicon from an URL.
import { getFavicon } from '@andresmarpz/favicons';
..
const favicon = await getFavicon('nextjs.org');
..Method used to extract favicon hrefs from a html string or head element string. Returns a string[] with urls.
import { extractFavicons } from '@andresmarpz/favicons';
..
const request = await fetch('nextjs.org');
const html = await request.text();
const favicons = extractFavicons(html);
..Get the Favicon object from the given URL.
import { getFaviconFrom } from "favicons";
const favicon = await getFaviconFrom("https://nextjs.com/favicon.ico");Get a Favicon[] from a string[] of favicon urls.
import { requestFavicons } from "favicons";
const favicons = await requestFavicons(["https://nextjs.com/favicon.ico", "https://nextjs.com/favicon.png"]);This repo uses turborepo to manage apps and packages in a monorepo setup.
| Codebase | Description |
|---|---|
| apps/web | Next.js landing |
| packages/npm | npm package |
| packages/local | Local testing |
$ git clone https://github.com/andresmarpz/favicons.git
$ cd favicons
$ npm i