AI & Automation (vnROM)

Cover image for Hướng dẫn tự custom icon cho Hermes Agent Desktop trên macOS - từng bước chi tiết
Chako Lab
Chako Lab

Posted on • Originally published at reddit.com

Hướng dẫn tự custom icon cho Hermes Agent Desktop trên macOS - từng bước chi tiết

Hermes Agent Desktop là ứng dụng Electron chạy trên macOS — đồng nghĩa với việc anh em hoàn toàn có thể can thiệp vào file cài đặt để thay đổi icon theo ý thích. Có hai chỗ cần sửa: icon ngoài Dock/Finder (file .icns) và logo bên trong app (file .png nhúng trong app.asar).

Những gì mình sẽ thay đổi

  1. Icon macOS (Dock / Finder) — file Contents/Resources/icon.icns
  2. Logo màn hình chào — file PNG nằm trong app.asar ở đường dẫn out/renderer/assets/

Trước khi làm, nhớ backup file gốc để có đường lui nếu có vấn đề.


Phần 1: Đổi icon macOS (Dock và Finder)

Bước 1: Chuẩn bị PNG vuông

Dùng ảnh PNG vuông, lý tưởng 1024×1024. Đặt lên Desktop, tạm gọi là my_icon.png.

Bước 2: Convert PNG sang .icns

Mở Terminal, chạy lần lượt:

cd ~/Desktop
rm -rf icon.iconset icon.icns
mkdir icon.iconset

sips -z 16 16   my_icon.png --out icon.iconset/icon_16x16.png
sips -z 32 32   my_icon.png --out icon.iconset/[email protected]
sips -z 32 32   my_icon.png --out icon.iconset/icon_32x32.png
sips -z 64 64   my_icon.png --out icon.iconset/[email protected]
sips -z 128 128 my_icon.png --out icon.iconset/icon_128x128.png
sips -z 256 256 my_icon.png --out icon.iconset/[email protected]
sips -z 256 256 my_icon.png --out icon.iconset/icon_256x256.png
sips -z 512 512 my_icon.png --out icon.iconset/[email protected]
sips -z 512 512 my_icon.png --out icon.iconset/icon_512x512.png
sips -z 1024 1024 my_icon.png --out icon.iconset/[email protected]

iconutil -c icns icon.iconset -o icon.icns
Enter fullscreen mode Exit fullscreen mode

Kết quả ra file ~/Desktop/icon.icns.

Bước 3: Backup và thay icon app

Tắt Hermes hoàn toàn, rồi chạy:

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
Enter fullscreen mode Exit fullscreen mode

Mở lại Hermes. Nếu Dock vẫn hiện icon cũ, gỡ Hermes khỏi Dock rồi kéo lại từ Applications.


Phần 2: Đổi logo trong app (màn hình chào)

File logo nằm trong app.asar — đây là định dạng đóng gói của Electron.

Bước 1: Giải nén app.asar

mkdir -p ~/Desktop/hermes-extract
cd "/Applications/Hermes Agent.app/Contents/Resources"
npx @electron/asar extract app.asar ~/Desktop/hermes-extract/app-extracted
Enter fullscreen mode Exit fullscreen mode

Nếu npx hỏi cài @electron/asar, gõ y.

Bước 2: Tìm file logo trong app

cd ~/Desktop/hermes-extract/app-extracted
grep -R "How can I help you today" -n .
Enter fullscreen mode Exit fullscreen mode

Kết quả trả về file JS chứa text đó. Từ đó tìm tên biến icon:

grep -n "const icon\|var icon\|let icon\|icon =" \
  ./out/renderer/assets/<file-js-tim-duoc> | head -50
Enter fullscreen mode Exit fullscreen mode

Thường sẽ thấy dòng như: const icon = "" + new URL("icon-DmaHCIN7.png", import.meta.url).href;

Vậy file cần thay là out/renderer/assets/icon-DmaHCIN7.png (tên có thể khác tuỳ phiên bản).

Bước 3: Thay ảnh logo

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

cp ~/Desktop/my_icon.png \
   ./out/renderer/assets/icon-DmaHCIN7.png
Enter fullscreen mode Exit fullscreen mode

Bước 4: Đóng gói lại app.asar

cd ~/Desktop/hermes-extract
npx @electron/asar pack app-extracted app.asar
Enter fullscreen mode Exit fullscreen mode

Bước 5: Backup app.asar gốc và thay thế

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

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

Tắt và mở lại Hermes để thấy kết quả.


Khôi phục nếu có lỗi

Nếu app bị lỗi sau khi sửa, khôi phục từ backup:

# 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

# Logo trong app
cp "/Applications/Hermes Agent.app/Contents/Resources/app-original.asar" \
   "/Applications/Hermes Agent.app/Contents/Resources/app.asar"
Enter fullscreen mode Exit fullscreen mode

Lưu ý

  • Mỗi lần Hermes cập nhật phiên bản mới, các thay đổi này có thể bị ghi đè — cần làm lại.
  • Luôn giữ backup của icon.icns, app.asar, và ảnh PNG gốc.
  • Đây chỉ là tuỳ chỉnh cục bộ, không ảnh hưởng tới source code chính thức.

Chúc anh em thành công.

Top comments (0)