Files
makelore/resources/icons/README.md
2026-07-29 17:22:35 +08:00

2.3 KiB

Makelore Application Icons

This directory contains the application icons for all supported platforms.

Required Files

File Platform Description
icon-source.png Generated source 1024px raster generated from the vector master
icon.svg Source Vector app-icon master
icon-plain.svg Source Transparent full-color mark used for the tray mask
icon.icns macOS Apple Icon Image format
icon.ico Windows Windows ICO format
icon.png All 512x512 PNG fallback
16x16.png - 512x512.png Linux PNG set for Linux
tray-icon-template.svg Source macOS tray icon template source
tray-icon-Template.png macOS 22x22 status bar icon (note: "Template" suffix required)

Generating Icons

Using the Script

# Run icon generation
npm run icons

Prerequisites

macOS:

brew install imagemagick librsvg

Linux:

apt install imagemagick librsvg2-bin

Windows: Install ImageMagick from https://imagemagick.org/

Manual Generation

If you prefer to generate icons manually:

  1. macOS (.icns)

    • Create a .iconset folder with properly named PNGs
    • Run: iconutil -c icns -o icon.icns Makelore.iconset
  2. Windows (.ico)

    • Use ImageMagick: convert icon_16.png icon_32.png icon_64.png icon_128.png icon_256.png icon.ico
  3. Linux (PNGs)

    • Generate PNGs at: 16, 32, 48, 64, 128, 256, 512 pixels

Design Guidelines

Application Icon

  • Source: icon-source.png
  • Canvas: Square PNG with transparent background where possible
  • Safe Area: Keep the visible mark comfortably inside the canvas

macOS Tray Icon

  • Format: Single-color (black) on transparent background
  • Size: 22x22 pixels (system automatically handles @2x retina)
  • Naming: Must end with "Template.png" for automatic template mode
  • Design: Monochrome alpha mask generated from the main icon
  • Source: Generated from icon-source.png
  • Important: Must be pure black (#000000) on transparent background - no gradients or colors

Updating the Icon

  1. Update icon.svg, icon-plain.svg, and the masters in resources/brand/
  2. Run npm run icons
  3. Verify generated icons look correct
  4. Commit all generated files