01
Khi nào công cụ này hữu ích
Sử dụng công cụ này để tạo nền web hai màu hoặc điểm nhấn cho thẻ. Chọn màu bắt đầu và kết thúc, loại tuyến tính hoặc radial, cùng một góc để nhận cả bản xem trước và CSS.
Trình tạo gradient
Tạo mã linear-gradient hoặc radial-gradient với bản xem trước trực tiếp.
Trình tạo gradient
Kết quả chạy trong trình duyệt để tham khảo và lập kế hoạch.
Cần kiểm tra gì trước khi dùng
02
Cách tạo ra kết quả
Chế độ tuyến tính tạo ra linear-gradient với góc đã nhập; chế độ radial tạo ra radial-gradient dạng tròn. Trình duyệt hiển thị các màu trung gian giữa hai điểm dừng.
03
Ví dụ áp dụng và cách diễn giải
Đặt #3366FF sang #FF6655 với góc 90 độ để tạo nền từ trái sang phải. Sao chép vào thành phần thực và kiểm tra lại độ tương phản của bất kỳ văn bản nào đặt phía trên nó.
04
Phạm vi và hạn chế
Trình tạo này dùng hai điểm dừng màu và không thể loại bỏ sự khác biệt nội suy màu giữa các trình duyệt. Hãy thêm điểm dừng phức tạp, chuyển tiếp alpha, hoặc màu gamute rộng trong trình chỉnh sửa đầy đủ.
Câu hỏi thường gặp
Làm thế nào để chuyển một màu từ trình tạo gradient sang ứng dụng khác?
Sử dụng nút sao chép bên dưới kết quả để sao chép nội dung CSS, HEX hoặc HSL. Xác nhận rằng ứng dụng đích diễn giải cùng một định dạng màu.
Màu màn hình từ trình tạo gradient có khớp với bản in không?
Không tự động. Màn hình RGB phát sáng và giấy, mực in phản chiếu dùng các không gian màu và mô hình pha trộn khác nhau, nên vẫn cần hồ sơ in và bản in thử.
Tôi có thể phê duyệt một token thiết kế chỉ từ trình tạo gradient không?
Dùng nó như một ứng viên, sau đó kiểm tra nền thực tế, chế độ tối, trạng thái tương tác và độ tương phản văn bản trước khi đặt tên và phê duyệt token.