Skip to content

Icons

showcase icons turns one square image into the icon set a web app, an Electron app or a Tauri app expects. It needs no config file: it does not look for showcase.config.* at all, so you can run it in any folder.

Terminal window
npx showcase icons --source assets/mascot.png --preset electron --out apps/desktop/resources
Option Meaning
--source <file> The source image. Required.
--preset <name> web, electron or tauri. Required.
--out <dir> Where to write the files. Default icons. The folder is created if it is missing.

--source and --out are relative to the directory you run the command in. Existing files with the same names are overwritten. The full option list is in the CLI reference.

Use a square PNG, 1024x1024 or larger, ideally on a transparent background. Every size is scaled down with contain onto a transparent square, so nothing is cropped, and every PNG (standalone or inside an .ico or .icns) is full-color RGBA.

The kit accepts other images but tells you when it has to compromise:

  • A source that is not square prints a warning and is padded with transparency to a square, per size.
  • A source smaller than 1024 px prints a warning: every size above the source’s is upscaled and looks soft.
  • A missing --source or --preset fails, a source that does not exist fails with Icon source not found, and an unknown preset fails with the list of presets.

Each preset writes exactly these files, and nothing else:

PresetFileContents
webfavicon.icoICO with 16, 32, 48 px images
webapple-touch-icon.pngPNG, 180x180
webicon-192.pngPNG, 192x192
webicon-512.pngPNG, 512x512
electronicon.pngPNG, 1024x1024
electronicon-16.pngPNG, 16x16
electronicon-32.pngPNG, 32x32
electronicon.icoICO with 16, 32, 48, 256 px images
tauri32x32.pngPNG, 32x32
tauri128x128.pngPNG, 128x128
tauri128x128@2x.pngPNG, 256x256
tauriicon.pngPNG, 1024x1024
tauriicon.icoICO with 16, 24, 32, 48, 64, 256 px images
tauriicon.icnsICNS, 16 to 512@2x

The .ico files hold PNG images (the format Windows Vista and later read). The .icns file holds PNG images too, with the same icon types Apple’s iconutil writes.

generateIcons(source, preset, outDir) does the same as the command and resolves with the files it wrote, in preset order:

import { generateIcons } from '@noctcore/showcase-kit';
const written = await generateIcons('assets/mascot.png', 'web', 'public');
// [{ file: 'favicon.ico', path: 'public/favicon.ico' }, ...]

ICON_PRESETS is exported too, if a build script needs the file list. See the programmatic API.