Tổng quát

Material UI là thư viện thành phần React nguồn mở triển khai Material Design của Google. Thư viện này toàn diện và có thể sử dụng ngay khi xuất xưởng.

Giới thiệu

Material UI là thư viện thành phần React nguồn mở triển khai Material Design của Google .

Sản phẩm bao gồm bộ sưu tập toàn diện các thành phần dựng sẵn, sẵn sàng để sử dụng trong sản xuất ngay khi xuất xưởng và có bộ tùy chọn tùy chỉnh giúp bạn dễ dàng triển khai hệ thống thiết kế riêng của mình dựa trên các thành phần của chúng tôi.

Material UI v6 hỗ trợ Material Design 2. Việc áp dụng Material Design 3 được lên kế hoạch tạm thời cho Material UI v7—xem bài đăng trên blog thông báo để biết thêm chi tiết. Bạn có thể theo dõi sự cố GitHub này để biết các bản cập nhật trong tương lai.

Ưu điểm của Material UI

• Giao hàng nhanh hơn: Hơn 2.500 cộng tác viên nguồn mở đã dành vô số thời gian cho các thành phần này. Tập trung vào logic kinh doanh cốt lõi của bạn thay vì phát minh lại bánh xe—chúng tôi đã bảo vệ UI của bạn.
• Đẹp theo mặc định: Chúng tôi rất tỉ mỉ khi triển khai Material Design , đảm bảo rằng mọi thành phần UI Material đều đáp ứng các tiêu chuẩn cao nhất về hình thức và chức năng, nhưng sẽ khác với thông số kỹ thuật chính thức khi cần thiết để cung cấp nhiều tùy chọn tuyệt vời.
• Khả năng tùy chỉnh: Thư viện bao gồm một bộ tính năng tùy chỉnh trực quan mở rộng. Các mẫu trong cửa hàng của chúng tôi chứng minh bạn có thể tùy chỉnh đến mức nào.
• Sự hợp tác giữa các nhóm: Trải nghiệm trực quan của nhà phát triển Material UI giúp giảm rào cản gia nhập cho các nhà phát triển back-end và các nhà thiết kế ít chuyên môn hơn, giúp các nhóm cộng tác hiệu quả hơn. Bộ thiết kế hợp lý hóa quy trình làm việc của bạn và tăng cường tính nhất quán giữa các nhà thiết kế và nhà phát triển.
• Được hàng ngàn tổ chức tin tưởng: Material UI có cộng đồng UI lớn nhất trong hệ sinh thái React. Nó gần như có tuổi đời ngang bằng với React—lịch sử của nó kéo dài từ năm 2014—và chúng tôi sẽ theo đuổi lâu dài. Bạn có thể tin tưởng vào sự hỗ trợ của cộng đồng trong nhiều năm tới (ví dụ như Stack Overflow ).

Giao diện người dùng Material so với Giao diện người dùng cơ sở

Material UI và Base UI có nhiều thành phần UI giống nhau, nhưng Base UI không có bất kỳ kiểu mặc định hoặc giải pháp tạo kiểu nào.

Material UI rất toàn diện vì nó đi kèm với các kiểu mặc định và được tối ưu hóa để hoạt động với Emotion (hoặc các thành phần được tạo kiểu ).

Ngược lại, Base UI có thể được coi là phiên bản "bộ xương" hoặc "không có giao diện" của Material UI—trên thực tế, các phiên bản Material UI trong tương lai sẽ sử dụng các thành phần và móc nối của Base UI làm cấu trúc nền tảng.

Bắt đầu ngay bây giờ

Bắt đầu sử dụng Material UI ngay hôm nay thông qua một số tài nguyên hữu ích sau:

[

Cài đặt

Thêm Material UI vào dự án của bạn bằng một vài lệnh.

](https://mui.com/material-ui/getting-started/installation/)

[

Cách sử dụng

Tìm hiểu những kiến ​​thức cơ bản về các thành phần Material UI.

](https://mui.com/material-ui/getting-started/usage/)

[

Các dự án ví dụ

Bộ sưu tập các mẫu để bắt đầu dự án tiếp theo của bạn.

](https://mui.com/material-ui/getting-started/example-projects/)

[

Tùy chỉnh các thành phần

Tìm hiểu về các phương pháp tùy chỉnh có sẵn.

](https://mui.com/material-ui/customization/how-to-customize/)

[

Mẫu

Bắt đầu với một số mẫu miễn phí.

](https://mui.com/material-ui/getting-started/templates/)

[

Tài nguyên thiết kế

Các thành phần Material UI trong công cụ thiết kế yêu thích của bạn.

](https://www.figma.com/community/file/912837788133317724/material-ui-for-figma-and-mui-x)