:3

content.js

(async () => {
  await faceapi.nets.tinyFaceDetector.loadFromUri(
    chrome.runtime.getURL("models")
  );

  const gigachad = new Image();
  gigachad.src = chrome.runtime.getURL("gigachad.png");
  await new Promise((resolve) => {
    gigachad.onload = resolve;
  });

  await faceapi.nets.faceLandmark68Net.loadFromUri(
    chrome.runtime.getURL("models")
  );

  /**
   * @param {HTMLImageElement} img
   */
  async function processImage(img) {
    try {
      if (img.width < 100 || img.height < 100) return;

      img.setAttribute("meowning", "true");

      const canvas = document.createElement("canvas");
      canvas.width = img.width;
      canvas.height = img.height;

      const ctx = canvas.getContext("2d");
      ctx.drawImage(img, 0, 0, img.width, img.height);

      const landmarkedDetections = await faceapi
        .detectAllFaces(canvas, new faceapi.TinyFaceDetectorOptions())
        .withFaceLandmarks();

      for (let detection of landmarkedDetections) {
        const { x, y, width, height } = detection.detection.box;

        ctx.drawImage(gigachad, x, y, width, height);
      }

      img.src = canvas.toDataURL();
    } catch (error) {
      console.error("Error processing image:", error);
    }
  }

  const images = document.getElementsByTagName("img");
  [...images].forEach(processImage);

  const observer = new MutationObserver((mutations) => {
    for (let mutation of mutations) {
      const allImages = [...mutation.addedNodes].flatMap((node) => {
        if (node.tagName === "IMG") return [node];
        if (node.querySelectorAll) return [...node.querySelectorAll("img")];
        return [];
      });

      allImages.forEach(processImage);
    }
  });

  observer.observe(document.body, { childList: true, subtree: true });
})();

manifest.json

{
    "manifest_version": 3,
    "name": "Gigachad Face Filter",
    "version": "1.0",
    "description": "Applies a Gigachad filter to every face on the screen.",
    "permissions": ["activeTab", "scripting"],
    "host_permissions": ["<all_urls>"],
    "content_scripts": [
      {
        "matches": ["<all_urls>"],
        "js": ["face-api.js", "content.js"],
        "run_at": "document_idle"
      }
    ],
    "web_accessible_resources": [
      {
        "resources": ["gigachad.png", "models/*", "face-api.js.map"],
        "matches": ["<all_urls>"]
      }
    ]
  }
  

you need

• https://github.com/justadudewhohacks/face-api.js/tree/master/dist, i used face-api.js
• https://github.com/justadudewhohacks/face-api.js-models/tree/master/face_landmark_68 (manifest and shard)
• add your own gigachad.png file to insert gigachad