Chuyển đến nội dung chính (Skip to content)
Mục lục bài viết
Top Repos

Page Mascot: thêm linh vật tương tác cho website React

Page Mascot: thêm linh vật tương tác cho website React

Page Mascot cung cấp linh vật React nhìn theo con trỏ và phản ứng khi bấm. Khám phá mẫu nhân vật, công dụng, cách tùy biến và link nguồn để sử dụng.

Website: https://koboyo.com/page-mascot
GitHub: https://github.com/nilbuild/page-mascot

Page Mascot làm gì?

Page Mascot là component React để đặt một nhân vật tương tác trên website. Linh vật nhìn theo con trỏ và đổi biểu cảm khi được bấm, giúp trang cá nhân hoặc trang giới thiệu sản phẩm có một điểm nhấn vui mắt.

Điểm nổi bật

  • Nhân vật có sẵn: chọn mẫu trên trang demo rồi sử dụng hai sprite sheet của nhân vật.
  • Phản ứng theo chuột: đổi hướng nhìn theo vị trí con trỏ và hiển thị biểu cảm khi bấm.
  • Nhiều phong cách: có các kiểu colour, ink, sketch, riso, paper và pixel.
  • Tạo nhân vật riêng: skill đi kèm hỗ trợ tạo sprite sheet mới bằng công cụ sinh ảnh.
Trang demo Page Mascot với linh vật cáo và liên kết chọn nhân vật
Giao diện demo Page Mascot, chụp từ website chính thức. Nguồn ảnh. Mở hình để xem chi tiết.

Hữu ích cho ai?

Phù hợp với người làm portfolio, landing page hoặc sản phẩm muốn thêm một linh vật nhỏ. Có thể bắt đầu bằng mẫu có sẵn để xem nhân vật có hợp giọng điệu của trang hay không, rồi mới đầu tư tạo một mẫu riêng cho thương hiệu.

Lưu ý trước khi dùng

Tạo nhân vật mới cần công cụ sinh ảnh. Component có xử lý con trỏ phù hợp và tùy chọn giảm chuyển động; vẫn nên kiểm tra trên mobile để linh vật không che nội dung hoặc thao tác chính.

Tổng hợp từ nguồn chính thức ngày 28/10/2026; chưa kiểm thử cài đặt hoặc vận hành.

Ảnh bìa: tài nguyên giới thiệu từ trang chính thức của dự án, chuyển sang WebP.

Tìm hiểu thêm