Trình tạo Gradient CSS

Công cụ này giúp bạn làm gì

Tạo dải màu có thể tái lập, xem trước từng điểm dừng được tạo và sao chép chuỗi HEX chính xác cho CSS, biểu đồ hoặc design token.

Ví dụ minh họa

Cách tạo ra kết quả

Mỗi màu trung gian được tạo bằng phép nội suy tuyến tính các kênh đỏ, lục và lam. Điểm đầu cuối được giữ nguyên, các màu còn lại được đặt ở khoảng cách đều nhau.

Quy trình hữu ích

• Tạo màu biểu đồ có thứ tự hoặc dải màu nhiệt
• Xây dựng màu trạng thái hover và trạng thái giữa hai design token
• Tạo bảng màu gọn cho gradient nền

Giới hạn quan trọng

• Nội suy RGB có thể trông tối hoặc bẩn hơn giữa một số màu bổ túc.
• Bảng màu trông mượt không tự động thân thiện với người mù màu.
• Trình tạo này tạo màu RGB cách đều; không tuyên bố tính đồng nhất tri giác.

Câu hỏi thường gặp

Tại sao điểm giữa có thể trông xám hoặc bẩn?

Các kênh RGB đối lập có thể trung bình về màu trung tính. Thêm màu trung gian phù hợp trong quy trình CSS nhiều điểm dừng khi cần độ sống động thị giác.

Tôi nên tạo bao nhiêu màu?

Sử dụng số lượng nhỏ nhất khớp với trạng thái hoặc dải dữ liệu riêng biệt bạn cần; nền liên tục có thể dùng nhiều bước hơn.