ui-skills – skill Thiết kế & UI cho agent AI
Các ràng buộc có quan điểm rõ ràng và liên tục được cập nhật, giúp agent định hướng khi xây dựng giao diện.
Cài skill ui-skills bằng một lệnh
Chọn công cụ bạn đang dùng, copy lệnh và dán vào terminal. Skill sẽ nằm trong thư mục skills của công cụ đó và sẵn sàng dùng ở phiên làm việc tiếp theo.
Claude Code
mkdir -p ~/.claude/skills && curl -fsSL https://skill.dn1nguoi.com/z/ui-skills-05335.tgz | tar xz -C ~/.claude/skills
Gọi trong Claude Code: /ui-skills – rồi mô tả công việc bạn muốn làm.
Codex
mkdir -p ~/.codex/skills && curl -fsSL https://skill.dn1nguoi.com/z/ui-skills-05335.tgz | tar xz -C ~/.codex/skills
Gọi trong Codex: $ui-skills – rồi mô tả công việc bạn muốn làm.
Hermes Agent
mkdir -p ~/.hermes/skills && curl -fsSL https://skill.dn1nguoi.com/z/ui-skills-05335.tgz | tar xz -C ~/.hermes/skills
Gọi trong Hermes Agent: /ui-skills – rồi mô tả công việc bạn muốn làm.
DeepSeek
mkdir -p ~/.deepcode/skills && curl -fsSL https://skill.dn1nguoi.com/z/ui-skills-05335.tgz | tar xz -C ~/.deepcode/skills
Gọi trong DeepSeek: /ui-skills – rồi mô tả công việc bạn muốn làm.
Nội dung SKILL.md
Nội dung SKILL.md gốc bằng tiếng Anh.
Ui Skills
Overview
Opinionated, evolving constraints to guide agents when building interfaces
When to Use This Skill
Use this skill when you need to work with opinionated, evolving constraints to guide agents when building interfaces.
Procedure
This entrypoint links to an external UI guidance collection; it does not contain the complete upstream rules. Inspect the requested interface, existing design system, target devices and accessibility requirements. Select the relevant installed procedure or read the complete chosen upstream guide before applying it. Report observed layout, interaction and accessibility problems with locations and suggested corrections. Preserve the project design language and verify changes with the actual renderer and project checks. Do not claim an unavailable guide or visual inspection ran.
Source: [UI Skills](https://github.com/ibelick/ui-skills).
Example
User request:
> Review this interface with @ui-skills, identify the highest-impact design problems, and propose an implementation-ready improvement.
Limitations
- Use this skill only when the task clearly matches the scope described above.
- Do not treat the output as a substitute for environment-specific validation, testing, or expert review.
- Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.
Skill liên quan
- ui-skills-root – Dùng trước khi làm việc liên quan đến UI để chọn ngữ cảnh UI Skills nhỏ nhất nhưng hữu…
- ui-states – Thiết kế và xây dựng các trạng thái UI mà agent thường bỏ sót: lần dùng đầu tiên, trống…
- ui-tokens – Xem, thêm hoặc sửa design token trong hệ thống design StyleSeed.
- ui-update – Cập nhật engine StyleSeed trong dự án — phân tích phần nào đã lỗi thời và cập nhật an…
- ui-ux-designer – Tạo thiết kế giao diện, wireframe và design system. Thành thạo nghiên cứu người dùng…
- ui-ux-pro-max – Hướng dẫn thiết kế toàn diện cho ứng dụng web và mobile. Dùng khi thiết kế component…
- ui-visual-validator – Chuyên gia kiểm tra trực quan nghiêm ngặt, chuyên về kiểm thử UI, tuân thủ design system…
- uiverify-triage-visual-changes – Phân loại build hồi quy trực quan của UI Verify qua MCP từ coding agent: sắp xếp ảnh…