Favicons

eddev can either leave favicons to WordPress, generate them from SVG sources, or generate them from a set of PNG files. The mode is configured in ed.config.json.

{
  "$schema": ".ed.config.schema.json",
  "version": "2",
  "favicon": {
    "mode": "svg"
  }
}

Modes

auto is the schema default, but current sites that keep favicon assets in the theme should set the mode explicitly.

SVG Favicons

SVG mode uses these default paths:

{
  "favicon": {
    "mode": "svg",
    "default": "/assets/favicon.svg",
    "light": "/assets/favicon-light.svg",
    "dark": "/assets/favicon-dark.svg"
  }
}

The SVG is linked directly for modern browsers, and eddev generates a raster .ico for compatibility. If light and dark variants are provided, the .ico uses the default/light source.

A single SVG can also carry its own colour-scheme media query:

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
  <style>
    .icon-dark { display: none; }
    @media (prefers-color-scheme: dark) {
      .icon-light { display: none; }
      .icon-dark { display: inline; }
    }
  </style>
  <g class="icon-light">...</g>
  <g class="icon-dark">...</g>
</svg>

PNG Favicons

PNG mode collects files from these default globs:

{
  "favicon": {
    "mode": "pngs",
    "default": "/assets/favicon/favicon-*.png"
  }
}

Use PNG mode when the design handoff already includes multiple raster sizes such as favicon-16x16.png, favicon-32x32.png, and Apple touch icons.

Theme Colour

Favicons do not set the browser theme colour. Add that separately from PHP if the site needs it:

<?php
add_action("wp_head", function () {
  echo '<meta name="theme-color" content="#000000">';
});