Trình tạo gradient CSS

Mỗi gradient có thể có nhiều lớp, và mỗi lớp có kiểu, góc và màu riêng. Kết quả là CSS thuần không cần tiền tố trình duyệt, sẵn sàng dán vào dự án của bạn. Liên kết của trang lưu lại gradient, nên bạn có thể chia sẻ hoặc mở lại sau.

Cách dùng trình tạo gradient

Chọn kiểu gradient
Chọn tuyến tính, xuyên tâm hoặc hình nón cho từng lớp. Tuyến tính hòa trộn màu dọc theo một đường thẳng, xuyên tâm lan màu từ một điểm trung tâm, hình nón xoay màu quanh tâm.

Chỉnh màu và lớp
Nhấp vào thanh màu để thêm điểm màu, kéo để đổi vị trí và chọn bất kỳ màu nào kèm độ trong suốt. Nút thêm lớp sẽ đặt thêm một gradient lên trên.

Xem trước thiết kế
Kiểm tra gradient trên sáu hình: toàn màn hình, hình vuông, hình chữ nhật ngang và dọc, hình tròn và ngôi sao. Bạn cũng có thể đổi nền phía sau hình.