Closed1
faviconを作るだけのJavascript
ie4下記のようなfaviconを「画像をアップロードせず」に実現する方法。
※自動生成しているのが分かるように表示したタイミングの日付を表示。
動作デモ： https://ie4.me/chatgpt/favicon/
javascirpt
// canvas
const canvas = document.createElement("canvas");
canvas.width = 32;
canvas.height = 32;
const ctx = canvas.getContext("2d");
// circle
ctx.beginPath();
ctx.arc(canvas.width / 2, canvas.width / 2, canvas.width / 2, 0, Math.PI * 2, true);
ctx.fillStyle = '#333';
ctx.fill();
// text
const faiconText = new Date().getDate();
ctx.fillStyle = 'white';
ctx.font = '22px sunserif bold';
ctx.textAlign = 'center';
ctx.textBaseline = 'middle';
ctx.fillText(faiconText, canvas.width / 2, canvas.height / 2 - 1);
// create favicon
let link = document.createElement('link');
link.rel = 'icon';
link.type = 'image/png';
link.href = canvas.toDataURL("image/png");
document.getElementsByTagName('head')[0].appendChild(link);
このスクラップは2023/09/30にクローズされました