Skip to content

Instantly share code, notes, and snippets.

@w3collective
Last active February 10, 2021 07:06
Show Gist options
  • Save w3collective/7d272c87836dff3d5b6f43b34212e431 to your computer and use it in GitHub Desktop.
Save w3collective/7d272c87836dff3d5b6f43b34212e431 to your computer and use it in GitHub Desktop.
Change a website favicon dynamically using JavaScript
const [month, day] = new Date().toLocaleDateString("en-US").split("/");
let favicon;
switch (month + day) {
case "214":
favicon = "πŸ’•";
break;
case "1031":
favicon = "πŸŽƒ";
break;
case "1225":
favicon = "πŸŽ…πŸΌ";
break;
default:
favicon = "🌐";
}
const dynamicFavicon = (favicon) => {
const link = document.createElement("link");
link.rel = "shortcut icon";
link.type = "image/svg+xml";
link.href = "data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>" +
favicon +
"</text></svg>";
document.head.appendChild(link);
};
dynamicFavicon(favicon);
@w3collective
Copy link
Author

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment