Claude Skill MartKhám phá skillCâu dùng ngayHọc qua videoDùng terminalSkill là gì?
 
← Về danh sách

Terminal Screenshot (ANSI → PNG)

Kết xuất đầu ra màu của lệnh terminal thành ảnh PNG để Claude thực sự "thấy" màu sắc, độ tương phản và căn lề.

Lập trìnhTrung cấp★ 1,323⑂ 212Điểm AI 9/10Cập nhật lần cuối: 8 thg 8, 2026

Làm được gì

  • Chụp nguyên vẹn đầu ra ANSI của lệnh CLI ra file .ansi, rồi render thành PNG.
  • Quy trình 2 bước tách biệt: không để renderer tự chạy lệnh (freeze --execute), tránh mất khối màu nền, cột số dòng và khung header.
  • Cho phép truyền đúng màu nền terminal thật (ví dụ #282c34 của Ghostty) để đánh giá tương phản chính xác.
  • Nếu không có freeze, tự động dùng scripts/ansi2html.py (chỉ stdlib) + Chrome headless.
  • Bảng lệnh chụp màu bắt buộc cho delta, bat, eza, ls, ripgrep…

Phù hợp với ai

  • Lập trình viên thường tinh chỉnh theme delta / bat / starship / eza.
  • Người muốn kiểm chứng tương phản màu bằng mắt thay vì đoán từ mã hex.
  • Ai muốn Claude Code xác nhận giao diện đầu ra CLI (căn lề, highlight).

Ví dụ sử dụng

  1. Sau khi sửa màu [delta]: git --no-pager diff | delta --dark --line-numbers --width=110 > /tmp/diff.ansi rồi scripts/render_ansi.sh /tmp/diff.ansi /tmp/diff.png "#282c34" và đọc ảnh để xem tương phản thêm/xóa.
  2. bat --color=always --style=numbers app.py > /tmp/x.ansi để kiểm tra theme syntax mới có dễ đọc trên nền tối.
  3. rg --color=always 'TODO' src > /tmp/x.ansi để xem highlight kết quả tìm kiếm có nổi bật không.

· · · Hướng dẫn cài đặt · · ·

Dùng thử ngay, không cần cài

Dán đoạn dưới vào Claude là dùng được skill này mà không cần cài đặt.

Hãy đọc hướng dẫn trong tệp này và làm theo để giúp mình:
https://raw.githubusercontent.com/daymade/claude-code-skills/HEAD/daymade-claude-code/terminal-screenshot/SKILL.md

Mình muốn: (viết việc bạn cần ở đây)

Nếu Claude không mở được liên kết, hãy mở liên kết và copy nội dung vào rồi dán.

↓ Thấy hữu ích thì tải ZIP bên dưới và cài. Sau đó skill tự chạy, không phải dán lại mỗi lần.

Cài vào ứng dụng Claude (không cần terminal)
  1. Tải tệp ZIP bằng nút bên dưới.
  2. Trong Claude, mở Settings → Capabilities và bật 'Code execution and file creation'. (chỉ một lần)
  3. Vào Customize → Skills → + → 'Upload a skill' rồi tải tệp ZIP lên.
↓ Tải ZIP
Cài vào Claude Code

Để Claude làm — dán câu dưới đây vào Claude Code

Hãy cài skill mình tìm thấy trên Claude Skill Mart.
Copy thư mục daymade-claude-code/terminal-screenshot từ repo GitHub daymade/claude-code-skills vào ~/.claude/skills/terminal-screenshot/ của mình.
Sau khi cài xong, cho mình biết skill này làm được gì trong một câu.

Cài bằng lệnh thủ công

git clone https://github.com/daymade/claude-code-skills.git /tmp/ccs && mkdir -p ~/.claude/skills && cp -r /tmp/ccs/daymade-claude-code/terminal-screenshot ~/.claude/skills/

⚠ Đây là skill do người khác tạo. Hãy kiểm tra repo gốc trước khi cài.

  1. Mở terminal và clone repo: git clone https://github.com/daymade/claude-code-skills.git /tmp/ccs
  2. Tạo thư mục skills: mkdir -p ~/.claude/skills
  3. Copy skill: cp -r /tmp/ccs/daymade-claude-code/terminal-screenshot ~/.claude/skills/
  4. (Khuyến nghị) Cài renderer freeze: brew install charmbracelet/tap/freeze — ⚠️ đừng dùng brew install freeze vì đó là một app GUI khác. Hoặc: go install github.com/charmbracelet/freeze@latest.
  5. Nếu không cài được freeze, chỉ cần có Chrome là script dự phòng vẫn hoạt động.
  6. Cấp quyền chạy: chmod +x ~/.claude/skills/terminal-screenshot/scripts/render_ansi.sh
  7. Khởi động lại Claude Code và yêu cầu kiểu "chụp ảnh màu delta diff giúp mình" hoặc "kiểm tra tương phản màu terminal".
Xem mã nguồn trên GitHub ↗Giấy phép: MIT