Skip to main
Table of Contents

Brand + Favicon Pipeline

This page demonstrates the brand pipeline that generates favicon and touch-icon outputs from brand source assets.

Input Files

  • in/asset/brand/background.png
  • in/asset/brand/foreground.png
  • in/asset/brand/foreground-wide.png

Generated Output Preview

Click any preview image to open it in a PhotoSwipe lightbox.

Configuration

Brand outputs are controlled by option.brand.adjust and option.brand.size:

"option": {
  "brand": {
    "adjust": {
      "foreground": {
        "alignment": { "x": "center", "y": "center" },
        "blur": 0,
        "modulate": {}
      },
      "background": {
        "alignment": { "x": "center", "y": "center" },
        "apply": { "square": true, "wide": true },
        "blur": 0,
        "modulate": {}
      }
    },
    "size": {
      "ico": [16, 32, 48, 64, 96, 128],
      "image": {
        "favicon-192.png": { "width": 192, "height": 192 },
        "pagethumb.png": { "width": 512, "height": 256 }
      }
    }
  }
}