Chuyển tới nội dung chính

Giao diện & Chủ đề

Giao diện kiểm soát trình bày trực quan của Hermes CLI: màu biểu ngữ, mặt xoay và động từ, nhãn hộp phản hồi, văn bản thương hiệu và tiền tố hoạt động của công cụ.

Phong cách đàm thoại và phong cách hình ảnh là những khái niệm riêng biệt:

  • Tính cách thay đổi giọng điệu và cách diễn đạt của tác nhân.
  • Da thay đổi diện mạo của CLI.

Thay đổi giao diện​

/skin                # show the current skin and list available skins
/skin ares           # switch to a built-in skin
/skin mytheme        # switch to a custom skin from ~/.Hermes/skins/mytheme.YAML

`
``Hoặc đặt giao diện mặc định trong 

~/.Hermes/config.yaml

:

`YAML
display:
  skin: default

`

## Giao diện tích hợp

| Da | Mô tả | Xây dựng thương hiệu đại lý | Nhân vật trực quan |
|------|--------------------------|----------------|-------------------|
| 
`default
` | Hermes cổ điển - vàng và dễ thương |

Hermes Agent
` | Đường viền vàng ấm áp, văn bản lụa ngô, khuôn mặt dễ thương trong vòng quay. Biểu ngữ trượng quen thuộc. Sạch sẽ và mời. |
| 
`ares
` | Chủ đề thần chiến tranh — đỏ thẫm và đồng |

Ares Agent
` | Đường viền màu đỏ thẫm có điểm nhấn màu đồng. Các động từ spinner hung hãn ("rèn", "diễu hành", "luyện thép"). Biểu ngữ nghệ thuật ASCII thanh kiếm và khiên tùy chỉnh. |
| 
`mono
` | Đơn sắc - thang độ xám rõ ràng |

Hermes Agent
` | Tất cả các màu xám - không có màu sắc. Đường viền là 

#555555

, văn bản là 

#c9d1d9

. Lý tưởng cho việc thiết lập terminal tối thiểu hoặc ghi màn hình. |
| 
`slate
` | Màu xanh mát — tập trung vào nhà phát triển |

Hermes Agent
` | Viền màu xanh hoàng gia (

#4169e1

), chữ màu xanh dịu. Bình tĩnh và chuyên nghiệp. Không có vòng quay tùy chỉnh - sử dụng các mặt mặc định. |
| 
`daylight
` | Chủ đề sáng sủa cho các terminal sáng sủa với văn bản tối màu và các điểm nhấn màu xanh lam mát mẻ |

Hermes Agent
` | Được thiết kế cho các terminal màu trắng hoặc sáng. Văn bản màu tối với đường viền màu xanh lam, bề mặt trạng thái nhợt nhạt và menu hoàn thành màu sáng vẫn có thể đọc được trong cấu hình terminal màu sáng. |
| 
`warm-lightmode
` | Văn bản màu nâu/vàng ấm áp cho nền terminal sáng |

Hermes Agent
` | Tông màu giấy da ấm áp cho các terminal ánh sáng. Văn bản màu nâu sẫm với các điểm nhấn màu nâu yên, bề mặt trạng thái màu kem. Một sự thay thế trần thế cho chủ đề ánh sáng ban ngày mát mẻ hơn. |
| 
`poseidon
` | Chủ đề thần đại dương — xanh thẳm và bọt biển |

Poseidon Agent
` | Độ dốc màu xanh đậm đến bọt biển. Máy quay có chủ đề đại dương ("biểu đồ dòng hải lưu", "âm thanh độ sâu"). Biểu ngữ nghệ thuật Trident ASCII. |
| 
`sisyphus
` | Chủ đề Sisyphean — thang độ xám khắc khổ với sự kiên trì |

Sisyphus Agent
` | Màu xám nhạt với độ tương phản rõ rệt. Máy quay theo chủ đề Tảng đá ("đẩy lên dốc", "đặt lại tảng đá", "chịu đựng vòng lặp"). Biểu ngữ nghệ thuật ASCII Boulder-and-hill. |
| 
`charizard
` | Chủ đề núi lửa - cam cháy và than hồng |

Charizard Agent
` | Màu cam cháy ấm đến màu than hồng. Máy quay có chủ đề lửa ("ngập vào bản nháp", "đo độ cháy"). Biểu ngữ nghệ thuật ASCII hình rồng. |

## Danh sách đầy đủ các khóa có thể định cấu hình

### Màu sắc (
`colors:

)

Kiểm soát tất cả các giá trị màu trong CLI. Giá trị là chuỗi màu hex.| Chìa khóa | Mô tả | Mặc định (da 
`default

) |
|------|-------------|--------------------------|
| 
`banner_border
` | Bảng điều khiển viền xung quanh biểu ngữ khởi động |

#CD7F32
` (đồng) |
| 
`banner_title
` | Màu văn bản tiêu đề trong biểu ngữ |

#FFD700
` (vàng) |
| 
`banner_accent
` | Tiêu đề phần trong biểu ngữ (Công cụ có sẵn, v.v.) |

#FFBF00
` (hổ phách) |
| 
`banner_dim
` | Văn bản bị tắt tiếng trong biểu ngữ (dấu phân cách, nhãn phụ) |

#B8860B
` (cây vàng sẫm) |
| 
`banner_text
` | Nội dung trong biểu ngữ (tên công cụ, tên kỹ năng) |

#FFF8DC
` (ngô) |
| 
`ui_accent
` | Màu nhấn chung của giao diện người dùng (điểm nổi bật, thành phần hoạt động) |

#FFBF00
` |
| 
`ui_label
` | Nhãn và thẻ UI |

#4dd0e1
` (màu xanh mòng két) |
| 
`ui_ok
` | Các chỉ số thành công (dấu kiểm, mức độ hoàn thành) |

#4caf50
` (màu xanh lá cây) |
| 
`ui_error
` | Chỉ báo lỗi (lỗi, bị chặn) |

#ef5350
` (đỏ) |
| 
`ui_warn
` | Các chỉ báo cảnh báo (thận trọng, lời nhắc phê duyệt) |

#ffa726
` (màu cam) |
| 
`prompt
` | Màu văn bản nhắc nhở tương tác |

#FFF8DC
` |
| 
`input_rule
` | Thước ngang phía trên vùng nhập liệu |

#CD7F32
` |
| 
`response_border
` | Đường viền xung quanh hộp phản hồi của tác nhân (thoát ANSI) |

#FFD700
` |
| 
`session_label
` | Màu nhãn phiên |

#DAA520
` |
| 
`session_border
` | Màu viền mờ của ID phiên |

#8B8682
` |
| 
`status_bar_bg
` | Màu nền cho thanh trạng thái / sử dụng TUI |

#1a1a2e
` |
| 
`voice_status_bg
` | Màu nền cho huy hiệu trạng thái chế độ giọng nói |

#1a1a2e
` |
| 
`selection_bg
` | Màu nền cho công cụ tô sáng lựa chọn chuột TUI. Quay trở lại 
`completion_menu_current_bg
` khi không được đặt. | 

#333355
` |
| 
`completion_menu_bg
` | Màu nền cho danh sách menu hoàn thành |

#1a1a2e
` |
| 
`completion_menu_current_bg
` | Màu nền cho hàng hoàn thành đang hoạt động |

#333355
` |
| 
`completion_menu_meta_bg
` | Màu nền cho cột meta hoàn thành |

#1a1a2e
` |
| 
`completion_menu_meta_current_bg
` | Màu nền cho cột meta hoàn thành đang hoạt động |

#333355
` |

### Máy quay (
`spinner:

)

Điều khiển vòng quay hoạt ảnh được hiển thị trong khi chờ phản hồi API.

| Chìa khóa | Loại | Mô tả | Ví dụ |
|------|------|-------------|--------|
| 
`waiting_faces
` | danh sách các chuỗi | Các khuôn mặt quay vòng trong khi chờ phản hồi API |

["(⚔)", "(⛨)", "(▲)"]
` |
| 
`thinking_faces
` | danh sách các chuỗi | Các khuôn mặt được xoay vòng trong quá trình suy luận mô hình |

["(⚔)", "(⌁)", "(<>)"]
` |
| 
`thinking_verbs
` | danh sách các chuỗi | Động từ hiển thị trong tin nhắn spinner |

["forging", "plotting", "hammering plans"]
` |
| 
`wings
` | danh sách các cặp [trái, phải] | Dấu ngoặc trang trí xung quanh con quay |

[["⟪⚔", "⚔⟫"], ["⟪▲", "▲⟫"]]
` |

Khi các giá trị spinner trống (như trong 
`default
` và 
`mono

), các giá trị mặc định được mã hóa cứng từ 
`display.py
` sẽ được sử dụng.

### Xây dựng thương hiệu (
`branding:

)

Chuỗi văn bản được sử dụng trong toàn bộ giao diện CLI.

| Chìa khóa | Mô tả | Mặc định |
|------|-------------|----------|
| 
`agent_name
` | Tên hiển thị trong tiêu đề banner và hiển thị trạng thái |

Hermes Agent
` |
| 
`welcome
` | Thông báo chào mừng được hiển thị khi khởi động CLI |

Welcome to Hermes Agent! Type your message or /help for commands.
` |
| 
`goodbye
` | Thông báo hiển thị khi thoát |

Goodbye! ⚕
` |
| 
`response_label
` | Nhãn trên tiêu đề hộp phản hồi |

 ⚕ Hermes 
` |
| 
`prompt_symbol
` | Ký hiệu trước lời nhắc nhập của người dùng (mã thông báo trần, trình kết xuất thêm dấu cách ở cuối) |

❯
` |
| 
`help_header
` | Văn bản tiêu đề cho đầu ra lệnh 

/help
` | 

(^_^)? Available Commands
` |

### Các khóa cấp cao nhất khác

| Chìa khóa | Loại | Mô tả | Mặc định |
|------|------|-------------|--------|
| 
`tool_prefix
` | chuỗi | Ký tự có tiền tố cho các dòng đầu ra công cụ trong CLI |

┊
` |
| 
`tool_emojis
` | chính tả | Ghi đè biểu tượng cảm xúc trên mỗi công cụ cho trình quay và tiến trình (

\{tool_name: emoji}

) | 

\{}
` |
| 
`banner_logo
` | chuỗi | Logo nghệ thuật ASCII đánh dấu phong phú (thay thế biểu ngữ Hermes_AGENT mặc định) |

""
` |
| 
`banner_hero
` | chuỗi | Nghệ thuật anh hùng đánh dấu phong phú (thay thế nghệ thuật trượng mặc định) |

""
` |

## Giao diện tùy chỉnhTạo tệp YAML theo 

~/.Hermes/skins/

. Giao diện người dùng kế thừa các giá trị còn thiếu từ giao diện 
`default
` tích hợp sẵn, vì vậy bạn chỉ cần chỉ định các khóa bạn muốn thay đổi.

### Mẫu YAML giao diện tùy chỉnh đầy đủ

`YAML

# ~/.Hermes/skins/mytheme.YAML
# Complete skin template — all keys shown. Delete any you don't need;
# missing values automatically inherit from the 'default' skin.

name: mytheme
description: My custom theme`colors:
  banner_border: "#CD7F32"
  banner_title: "#FFD700"
  banner_accent: "#FFBF00"
  banner_dim: "#B8860B"
  banner_text: "#FFF8DC"
  ui_accent: "#FFBF00"
  ui_label: "#4dd0e1"
  ui_ok: "#4caf50"
  ui_error: "#ef5350"
  ui_warn: "#ffa726"
  prompt: "#FFF8DC"
  input_rule: "#CD7F32"
  response_border: "#FFD700"
  session_label: "#DAA520"
  session_border: "#8B8682"
  status_bar_bg: "#1a1a2e"
  voice_status_bg: "#1a1a2e"
  selection_bg: "#333355"
  completion_menu_bg: "#1a1a2e"
  completion_menu_current_bg: "#333355"
  completion_menu_meta_bg: "#1a1a2e"
  completion_menu_meta_current_bg: "#333355"`spinner:
  waiting_faces:
    - "(⚔)"
    - "(⛨)"
    - "(▲)"
  thinking_faces:
    - "(⚔)"
    - "(⌁)"
    - "(<>)"
  thinking_verbs:
    - "processing"
    - "analyzing"
    - "computing"
    - "evaluating"
  wings:
    - ["⟪⚡", "⚡⟫"]
    - ["⟪●", "●⟫"]

branding:
  agent_name: "My Agent"
  welcome: "Welcome to My Agent! Type your message or /help for commands."
  goodbye: "See you later! ⚡"
  response_label: " ⚡ My Agent "
  prompt_symbol: "⚡"
  help_header: "(⚡) Available Commands"`tool_prefix: "┊"

# Per-tool emoji overrides (optional)
tool_emojis:
  terminal: "⚔"
  web_search: "🔮"
  read_file: "📄"

# Custom ASCII art banners (optional, Rich markup supported)
# banner_logo: |
#   [bold #FFD700] MY AGENT [/]
# banner_hero: |
#   [#FFD700]  Custom art here  [/]

`

### Ví dụ về giao diện tùy chỉnh tối thiểu

Vì mọi thứ đều kế thừa từ 
`default
` nên một giao diện tối thiểu chỉ cần thay đổi những điểm khác biệt:

``` yaml
name: cyberpunk
description: Neon terminal theme`colors:
  banner_border: "#FF00FF"
  banner_title: "#00FFFF"
  banner_accent: "#FF1493"`spinner:
  thinking_verbs: ["jacking in", "decrypting", "uploading"]
  wings:

    - ["⟨⚡", "⚡⟩"]

branding:
  agent_name: "Cyber Agent"
  response_label: " ⚡ Cyber "`tool_prefix: "▏"

`

## Hermes Mod — Trình chỉnh sửa giao diện trực quan`[Hermes Mod](https://GitHub.com/cocktailpeanut/Hermes-mod) là giao diện người dùng web do cộng đồng xây dựng để tạo và quản lý giao diện một cách trực quan. Thay vì viết YAML bằng tay, bạn có được trình chỉnh sửa trỏ và nhấp với bản xem trước trực tiếp.`![Hermes Mod skin editor](https://raw.GitHubusercontent.com/cocktailpeanut/Hermes-mod/master/nous.png)

**Nó làm gì:**
- Liệt kê tất cả các giao diện tích hợp và tùy chỉnh
- Mở bất kỳ giao diện nào vào trình chỉnh sửa trực quan với tất cả các trường giao diện Hermes (màu sắc, vòng quay, nhãn hiệu, tiền tố công cụ, biểu tượng cảm xúc công cụ)
- Tạo nghệ thuật văn bản 
`banner_logo
` từ lời nhắc văn bản
- Chuyển đổi hình ảnh đã tải lên (PNG, JPG, GIF, WEBP) thành nghệ thuật 
`banner_hero
` ASCII với nhiều kiểu kết xuất (chữ nổi, đoạn nối ASCII, khối, dấu chấm)
- Lưu trực tiếp vào 

~/.Hermes/skins/

- Kích hoạt giao diện bằng cách cập nhật 

~/.Hermes/config.yaml

- Hiển thị YAML được tạo và bản xem trước trực tiếp

### Cài đặt`**Tùy chọn 1 — Pinokio (1 cú nhấp chuột):**

Tìm nó trên [pinokio.computer](https://pinokio.computer) và cài đặt chỉ bằng một cú nhấp chuột.

**Tùy chọn 2 — npx (nhanh nhất từ terminal):**

``` bash
npx -y Hermes-mod

`
``**Tùy chọn 3 — Thủ công:**

`bash
git clone https://GitHub.com/cocktailpeanut/Hermes-mod.git
cd Hermes-mod/app
npm install
npm start

`

### Cách sử dụng
1. Khởi động ứng dụng (thông qua Pinokio hoặc terminal).

2. Mở **Skin Studio**.
3. Chọn giao diện tích hợp hoặc tùy chỉnh để chỉnh sửa.
4. Tạo logo từ văn bản và/hoặc tải lên hình ảnh cho tác phẩm nghệ thuật anh hùng. Chọn kiểu kết xuất và chiều rộng.
5. Chỉnh sửa màu sắc, vòng quay, nhãn hiệu và các trường khác.
6. Nhấp vào **Save** để ghi YAML skin vào 

~/.Hermes/skins/

.
7. Nhấp vào **Kích hoạt** để đặt nó làm giao diện hiện tại (cập nhật 
`display.skin
` trong 
`config.yaml

).

Hermes Mod tôn trọng biến môi trường 
`Hermes_HOME
` nên nó cũng hoạt động với [profiles](/docs/user-guide/profiles).

## Ghi chú hoạt động
- Tải giao diện tích hợp từ 
`Hermes_CLI/skin_engine.py

.
- Giao diện không xác định sẽ tự động quay trở lại 
`default

.
- 

/skin
` cập nhật chủ đề CLI đang hoạt động ngay lập tức cho phiên hiện tại.
- Giao diện người dùng trong 

~/.Hermes/skins/
` được ưu tiên hơn giao diện tích hợp có cùng tên.
- Thay đổi giao diện thông qua 

/skin
` chỉ diễn ra theo phiên. Để đặt giao diện làm mặc định vĩnh viễn, hãy đặt giao diện đó trong 
`config.yaml

.
- Các trường 
`banner_logo
` và 
`banner_hero
` hỗ trợ đánh dấu bảng điều khiển Rich (ví dụ: 

[bold #FF0000]text[/]

) cho nghệ thuật ASCII màu.