Ok, first of, I am a totally newb who just installed Hermes (on VPS) and as I was discovering how to install the WebUI, I saw the new desktop app.. that is what I ended up installing after having some issues with already installing the other interfaces (remember I am a newb)

When I got to the desktop app (Mac OS), i thought... I want to replace the app icon and the in app Hermes logo to my personal brand.

How to Customize the Hermes Agent Desktop Icons on macOS

I figured out how to change both the macOS Dock/app icon and the in-app welcome screen logo for the Hermes Agent desktop app.

This is for macOS and assumes the app is installed as:

/Applications/Hermes Agent.app

Your path may be slightly different.

What you are changing

There are two different icons:

1. Dock / Finder / macOS app icon
   File: Contents/Resources/icon.icns

2. In-app welcome screen logo
   File inside app.asar:
   out/renderer/assets/icon-DmaHCIN7.png

The second filename may vary by version, so I included the search steps below.

Part 1: Change the macOS Dock / App Icon

Step 1: Put your PNG on the Desktop

Use a square PNG if possible, ideally 1024x1024.

Example filename:

SizHermes_logo.png

Step 2: Convert the PNG to .icns

Open Terminal and run:

cd ~/Desktop

rm -rf icon.iconset icon.icns
mkdir icon.iconset

sips -z 16 16       SizHermes_logo.png --out icon.iconset/icon_16x16.png
sips -z 32 32       SizHermes_logo.png --out icon.iconset/icon_16x16@2x.png
sips -z 32 32       SizHermes_logo.png --out icon.iconset/icon_32x32.png
sips -z 64 64       SizHermes_logo.png --out icon.iconset/icon_32x32@2x.png
sips -z 128 128     SizHermes_logo.png --out icon.iconset/icon_128x128.png
sips -z 256 256     SizHermes_logo.png --out icon.iconset/icon_128x128@2x.png
sips -z 256 256     SizHermes_logo.png --out icon.iconset/icon_256x256.png
sips -z 512 512     SizHermes_logo.png --out icon.iconset/icon_256x256@2x.png
sips -z 512 512     SizHermes_logo.png --out icon.iconset/icon_512x512.png
sips -z 1024 1024   SizHermes_logo.png --out icon.iconset/icon_512x512@2x.png

iconutil -c icns icon.iconset -o icon.icns

This creates:

~/Desktop/icon.icns

Step 3: Back up and replace the Hermes app icon

Quit Hermes completely first.

Then run:

cp "/Applications/Hermes Agent.app/Contents/Resources/icon.icns" \
"/Applications/Hermes Agent.app/Contents/Resources/icon-original.icns"

cp ~/Desktop/icon.icns \
"/Applications/Hermes Agent.app/Contents/Resources/icon.icns"

touch "/Applications/Hermes Agent.app"
killall Dock
killall Finder

Reopen Hermes.

If the Dock still shows the old icon, remove Hermes from the Dock, reopen it from Applications, then choose “Keep in Dock” again.

Part 2: Change the In-App Welcome Screen Logo

Hermes is an Electron app, so the in-app logo is packed inside:

/Applications/Hermes Agent.app/Contents/Resources/app.asar

Step 1: Extract app.asar

Run:

mkdir -p ~/Desktop/hermes-extract
cd "/Applications/Hermes Agent.app/Contents/Resources"

npx /asar extract app.asar ~/Desktop/hermes-extract/app-extracted

If npx asks to install u/electron/asar, type:

y

Step 2: Find the welcome screen icon

Go into the extracted app:

cd ~/Desktop/hermes-extract/app-extracted

Search for the welcome screen text:

grep -R "How can I help you today" -n .

In my case, it returned:

./out/renderer/assets/index-DXhGRPoA.js

Then search for where the icon variable is defined:

grep -n "const icon\|var icon\|let icon\|icon =" ./out/renderer/assets/index-DXhGRPoA.js | head -50

In my case, it returned:

const icon = "" + new URL("icon-DmaHCIN7.png", import.meta.url).href;

So the in-app welcome logo file was:

./out/renderer/assets/icon-DmaHCIN7.png

Your filename may be different.

Step 3: Replace the in-app logo

Back up the original image:

cp ./out/renderer/assets/icon-DmaHCIN7.png \
./out/renderer/assets/icon-DmaHCIN7-backup.png

Replace it with your custom PNG:

cp ~/Desktop/SizHermes_logo.png \
./out/renderer/assets/icon-DmaHCIN7.png

Again, replace icon-DmaHCIN7.png with whatever filename your search found.

Step 4: Repack app.asar

Run:

cd ~/Desktop/hermes-extract
npx [u/electron](/u/electron)/asar pack app-extracted app.asar

Step 5: Back up the original app.asar

Run:

cp "/Applications/Hermes Agent.app/Contents/Resources/app.asar" \
"/Applications/Hermes Agent.app/Contents/Resources/app-original.asar"

Step 6: Replace the active app.asar

Run:

cp ~/Desktop/hermes-extract/app.asar \
"/Applications/Hermes Agent.app/Contents/Resources/app.asar"

Quit Hermes completely and reopen it.

Restore Original Files If Needed

If the app breaks or you want to undo the changes:

Restore original app icon

cp "/Applications/Hermes Agent.app/Contents/Resources/icon-original.icns" \
"/Applications/Hermes Agent.app/Contents/Resources/icon.icns"

touch "/Applications/Hermes Agent.app"
killall Dock
killall Finder

Restore original in-app files

cp "/Applications/Hermes Agent.app/Contents/Resources/app-original.asar" \
"/Applications/Hermes Agent.app/Contents/Resources/app.asar"

Then reopen Hermes.

Notes

The Dock/app icon and in-app logo are two separate files.

App updates may overwrite your changes.

Always keep backups of:

icon.icns

app.asar

your custom PNG

your generated icon.icns

This is just a local customization. It does not change the official app source code.

https://preview.redd.it/mi4rlon3vd0h1.png?width=851&format=png&auto=webp&s=d67b818b9b1cd871c29e35aef10955dcab2e360c