Icons

Icons are stored in images and in images/app-icons.

Favicon#

The favicon is served dynamically via serve-favicon, using the icon in images/app-icons/win/icon.ico.

Declarative generation of icons#

All the icons are now built off of the SVGs in the images directory using the bin/create-icons.sh script.

Main images#

These are stored in images:

Name	Resolution	Description
icon-black.svg	53x40	Used by the global menu button when not hovered.
icon-color.svg	53x40	Used by the global menu when hovered.
icon-grey.svg	53x40	Used by the dark theme, in place of icon-black.svg.

App icons#

Name	Resolution	Description
ios/apple-touch-icon.png	180x180	Used as apple-touch-icon, but only in login.ejs and set_password.ejs for some reason.
mac/icon.icns	512x512	Provided as --icon to electron-packager for mac-arm64 and mac-x64 builds.
png/128x128.png	128x128	Used in linux-x64 build, to provide an icon.png.
png/256x256-dev.png	256x256	Used by the Electron window icon, if in dev mode.
png/256x256.png	Used by the Electron window icon, if not in dev mode.
win/icon.ico	ICO 16x16 ICO 32x32 ICO 48x48 ICO 64x64 ICO 128x128 PNG 256x256	Used by the win-x64 build. Used by Squirrel Windows installer for: setup icon, app icon, control panel icon Used as the favicon.
win/setup-banner.gif	640x480	Used by the Squirrel Windows installer during the installation process. Has only one frame.

Additional locations where the branding is used#

• In the client, more specifically in src/public/app/widgets/buttons/global_menu.js, where the SVG content of the icon is directly embedded to allow styling via CSS.
• In the Demo document, as an attachment.
• In the CKEditor build, look for packages/ckeditor5-build-balloon-block/src/icons/trilium.svg. Make sure not to have any fill overrides in the SVG as the wrong color will be used.