initial

Author: madrilene

.gitignore

@@ -0,0 +1,8 @@
+# Node modules
+node_modules
+
+# generated files
+favicon
+
+# secret data
+.env

LICENSE.MD

@@ -0,0 +1,7 @@
+## ISC License
+
+Copyright (c) 2024 Lene Saile
+
+Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.

README.md

@@ -0,0 +1,37 @@
+# Favicon Generator
+
+A very simple utility to generate various sizes and formats of favicons from a single SVG source file. I use this to generate favicons for my projects. It follows the recommendations from the article on [evilmartians.com](https://evilmartians.com/chronicles/how-to-favicon-in-2021-six-files-that-fit-most-needs).
+
+## Installation
+
+```bash
+npm install
+```
+
+## Usage
+
+Replace favicon.svg with your own SVG file.
+
+You can also configure your settings in `settings.js`:
+
+```javascript
+// settings.js
+export const pathToSvgLogo = "./favicon.svg";
+export const outputDir = "./favicons";
+```
+
+Then run the script:
+
+```bash
+node index.js
+# or:
+npm run build
+```
+
+The script will generate the following favicon files in the specified output directory:
+
+- SVG favicon
+- PNG icons (192x192, 512x512)
+- Apple touch icon (180x180)
+- Maskable icon (512x512 with padding)
+- ICO file (32x32)

favicon.svg

@@ -0,0 +1,40 @@
+import fs from "node:fs";
+import sharp from "sharp";
+import { sharpsToIco } from "sharp-ico";
+import { pathToSvgLogo, outputDir } from "./settings.js";
+
+async function createFavicons() {
+  // Ensure the output directory exists
+  fs.mkdirSync(outputDir, { recursive: true });
+
+  // Read the SVG logo
+  const svgBuffer = fs.readFileSync(pathToSvgLogo);
+
+  // Write the SVG favicon
+  fs.writeFileSync(`${outputDir}/favicon.svg`, svgBuffer);
+
+  // Create PNG favicons
+  await sharp(svgBuffer).resize(192, 192).toFile(`${outputDir}/icon-192x192.png`);
+  await sharp(svgBuffer).resize(512, 512).toFile(`${outputDir}/icon-512x512.png`);
+  await sharp(svgBuffer).resize(180, 180).toFile(`${outputDir}/apple-touch-icon.png`);
+
+  // Create a maskable icon
+  await sharp(svgBuffer)
+    .resize(512, 512)
+    .extend({
+      top: 50,
+      bottom: 50,
+      left: 50,
+      right: 50,
+      background: { r: 0, g: 0, b: 0, alpha: 0 }, // Transparent padding
+    })
+    .toFile(`${outputDir}/maskable-icon.png`);
+
+  // Create an ICO file
+  const iconSharp = sharp(svgBuffer).resize(32, 32);
+  await sharpsToIco([iconSharp], `${outputDir}/favicon.ico`, { sizes: [32] });
+
+  console.log("All favicons generated.");
+}
+
+createFavicons();