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

Superdesign Canvas

Kỹ năng dùng Superdesign CLI để thiết kế UI, slide, poster và tạo ảnh/video trên canvas vô hạn với nhiều mô hình AI hàng đầu.

Thiết kế · UITrung cấp★ 600⑂ 46Điểm AI 8/10Cập nhật lần cuối: 21 thg 8, 2026

Làm được gì

  • Chạy Superdesign CLI (npx @superdesign/cli) để tạo project/draft và mở canvas web xem bản thiết kế sinh ra theo thời gian thực.
  • Nếu có codebase thật, tự chạy init để ghi 6 file ngữ cảnh trong .superdesign/init/ (components, layouts, routes, theme, pages, extractable-components).
  • Chọn và so sánh nhiều mô hình AI để thử các hướng thiết kế song song; lặp bằng chế độ replace hoặc branch có lịch sử phiên bản.
  • Trích xuất "design DNA" từ một URL tham chiếu, tạo design system, slide deck, poster/ảnh marketing và cả ảnh/video phụ trợ.
  • Kiểm tra .superdesign/resume.json trước để tiếp tục bản nháp cũ thay vì phân tích lại toàn bộ repo.

Phù hợp với ai

  • Lập trình viên frontend và designer đang dùng dịch vụ Superdesign, muốn ra nhiều phương án UI nhanh.
  • Nhóm sản phẩm cần redesign trang hiện có hoặc làm slide/ảnh marketing đúng brand.
  • Người muốn so sánh kết quả từ nhiều mô hình AI trước khi chọn hướng.

Ví dụ sử dụng

  1. "Làm dashboard tối hơn, gọn hơn" → kiểm tra resume, chỉ nạp file ngữ cảnh cần thiết rồi cập nhật draft.
  2. "Thiết kế landing page theo phong cách của website này (URL)" → extract-website rồi sinh 2–3 biến thể bằng các mô hình khác nhau.
  3. "Poster ra mắt sản phẩm cho social" → bỏ qua init, hỏi brief thương hiệu, sinh graphic và tự review một vò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/superdesigndev/superdesign-skill/HEAD/skills/superdesign/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 skills/superdesign từ repo GitHub superdesigndev/superdesign-skill vào ~/.claude/skills/superdesign/ 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/superdesigndev/superdesign-skill.git /tmp/superdesign-skill && cp -r /tmp/superdesign-skill/skills/superdesign ~/.claude/skills/superdesign

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

  1. Kiểm tra Node.js đã cài (node -v) vì CLI chạy qua npx.
  2. Clone repo: git clone https://github.com/superdesigndev/superdesign-skill.git
  3. Copy thư mục kỹ năng: cp -r superdesign-skill/skills/superdesign ~/.claude/skills/superdesign
  4. Đảm bảo thư mục references/ (SUPERDESIGN.md, INIT.md, PRESENTATION.md...) được copy kèm.
  5. Chạy npx --yes @superdesign/cli@latest một lần để kiểm tra CLI và dòng auth:. Nếu chưa đăng nhập, chạy npx --yes @superdesign/cli@latest login.
  6. Khởi động lại Claude Code và yêu cầu ví dụ "thiết kế lại trang chủ giúp mình". Lưu ý mỗi lần sinh thiết kế đều tốn credit.
Xem mã nguồn trên GitHub ↗Giấy phép: MIT