Làm đẹp README GitHub
Kỹ năng thiết kế lại trang README của repo và tạo bộ asset SVG (hero, header, sơ đồ) mang đúng tinh thần dự án.
Thiết kế · UITrung cấp★ 1,923⑂ 131Điểm AI 9/10Cập nhật lần cuối: 4 thg 10, 2026
Làm được gì
- Chọn rõ một trong hai chế độ: sửa toàn bộ README (thứ tự thông tin, phân cấp nội dung, bằng chứng) hoặc chỉ tạo asset mà không đụng tới file README.
- Rút ra bảng màu, kiểu chữ và motif riêng từ chính dự án, tránh dùng chung một template cho mọi repo.
- Giải thích và xác nhận cách triển khai: SVG thuần (nhẹ, sắc nét, dễ sửa) hay hợp thành lai (SVG + ảnh sinh bằng ImageGen → PNG/WebP).
- Tôn trọng giới hạn render của GitHub (không script, không foreignObject, không font từ xa, SVG không chạy animation) và chỉ tạo GIF khi người dùng chủ động đồng ý.
- Kiểm tra bằng
scripts/audit_readme.py, xem trước ở khổ rộng/hẹp, kiểm tra tương phản sáng–tối và cỡ chữ tối thiểu.
Phù hợp với ai
- Maintainer dự án mã nguồn mở muốn "màn hình đầu tiên" thuyết phục hơn
- Lập trình viên muốn repo cá nhân trông chuyên nghiệp như portfolio
- Nhóm không có designer nhưng cần bộ hình ảnh README nhất quán
Ví dụ sử dụng
- "Thiết kế lại trang chủ repo này theo chủ đề công cụ dev" → sắp xếp lại thứ tự đọc + tạo hero SVG và bảng bằng chứng
- "Chỉ tạo 1 hero SVG và 3 section header, đừng sửa README" → chế độ asset-only, lưu vào
assets/readme/ - "Tạo GIF hero chạy được trên GitHub và giữ lại file SVG gốc" → xuất GIF kèm SVG tĩnh làm bản dự phò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/oil-oil/beautify-github-readme/HEAD/skills/beautify-github-readme/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)
- Tải tệp ZIP bằng nút bên dưới.
- Trong Claude, mở Settings → Capabilities và bật 'Code execution and file creation'. (chỉ một lần)
- Vào Customize → Skills → + → 'Upload a skill' rồi tải tệp ZIP lên.
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 AI Skill Mart. Copy thư mục skills/beautify-github-readme từ repo GitHub oil-oil/beautify-github-readme vào ~/.claude/skills/beautify-github-readme/ 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/oil-oil/beautify-github-readme.git /tmp/bgr && mkdir -p ~/.claude/skills && cp -r /tmp/bgr/skills/beautify-github-readme ~/.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.
- Mở terminal.
- Tải repo:
git clone https://github.com/oil-oil/beautify-github-readme.git /tmp/bgr - Tạo thư mục kỹ năng:
mkdir -p ~/.claude/skills - Sao chép:
cp -r /tmp/bgr/skills/beautify-github-readme ~/.claude/skills/ - Kiểm tra thư mục
references/vàscripts/audit_readme.pyđã được copy kèm. - Nếu cần xuất GIF, đảm bảo có
python3(python3 --version). - Khởi động lại Claude Code và gọi:
Use $beautify-github-readme to ...
Xem mã nguồn trên GitHub ↗Giấy phép: MIT