favicon-switcher
Advanced tools
Switches site's favicon by matching media queries. It could be used for light/dark mode switching. Due to browsers don't support all Media Query features in link tag, this module fixes it.
Script doesn't require any setup or configuration and works like a polyfill. The example below shows how to make dark/light mode icon switching.
Use the main library to automatically turn icon switching on:
<script src="https://unpkg.com/favicon-switcher@1.2.2/dist/index.js" crossorigin="anonymous" type="application/javascript"></script>
If you need more control to turn switching on and off use one of the next module:
Use with UMD:
<script src="https://unpkg.com/favicon-switcher@1.2.2/dist/index.umd.js" crossorigin="anonymous" type="application/javascript"></script>
<script>faviconSwitcher()</script>
Use as ES module:
<script type="module" language="javascript">
import initSwitcher from 'https://unpkg.com/favicon-switcher@1.2.2/dist/index.esm.js'
// Subscribe to media queries changing events
const unsubscribe = initSwitcher()
// Unsubscribe later on some condition. For example on page navigation.
unsubscribe()
</script>
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<link rel="icon" media="(prefers-color-scheme:dark)" href="favicon-dark.png" type="image/png" />
<link rel="icon" media="(prefers-color-scheme:light)" href="favicon-light.png" type="image/png" />
<script src="https://unpkg.com/favicon-switcher@1.2.2/dist/index.js" crossorigin="anonymous" type="application/javascript"></script>
</head>
<body></body>
</html>
MIT © Rumkin
FAQs
Switch page favicons using media queries
The npm package favicon-switcher receives a total of 19 weekly downloads. As such, favicon-switcher popularity was classified as not popular.
We found that favicon-switcher demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Socket’s Threat Research Team has uncovered 60 npm packages using post-install scripts to silently exfiltrate hostnames, IP addresses, DNS servers, and user directories to a Discord-controlled endpoint.
Security News
TypeScript Native Previews offers a 10x faster Go-based compiler, now available on npm for public testing with early editor and language support.
Research
Security News
Malicious npm packages targeting React, Vue, Vite, Node.js, and Quill remained undetected for two years while deploying destructive payloads.