Công cụ miễn phí
Tạo màu gradient online
Phối 2 màu, chọn hướng chuyển màu, xem trước ngay và copy mã CSS dán thẳng vào website của bạn.
Gradient có sẵn
Hướng dẫn sử dụng
Tạo gradient CSS trong 4 bước
Chọn hai màu
Bấm vào ô màu để chọn trên bảng màu, hoặc gõ mã hex (VD #FD6500) vào ô bên cạnh cho Màu 1 và Màu 2.
Chọn hướng chuyển màu
Ngang, dọc, chéo hoặc chéo ngược — khung xem trước cập nhật ngay khi bạn đổi.
Thử gradient có sẵn hoặc ngẫu nhiên
Bấm một trong 10 gradient phối sẵn (Hoàng hôn, Đại dương, Bình minh…) hoặc nút Gradient ngẫu nhiên để tìm cảm hứng.
Copy mã CSS
Bấm Copy CSS rồi dán dòng background: linear-gradient(...) vào file CSS, khối HTML tuỳ chỉnh hoặc thuộc tính style của phần tử.
Mã linear-gradient chạy trên mọi trình duyệt hiện đại, không cần ảnh nền nên trang tải nhanh hơn.