Tạo gradient
Xây dựng CSS gradient tuyến tính, hướng tâm và hình nón từ đầu với điều khiển đa điểm dừng có thể kéo và các preset được tuyển chọn. Sao chép CSS sẵn dán ngay lập tức.
background: —;
Mọi thứ được tính toán trực tiếp trong trình duyệt — không đăng ký, hoàn toàn miễn phí.
Giới thiệu về Tạo gradient
Trình Tạo Gradient xây dựng các gradient CSS tùy chỉnh từ đầu. Chọn loại tuyến tính, hình tròn hoặc hình nón, đặt góc độ, và định hình bản pha trộn với trình biên tập đa điểm dừng: kéo các tay cầm để di chuyển điểm dừng, nhấp vào thanh để thêm điểm mới, và đổi màu bất kỳ điểm dừng nào bằng bảng chọn màu, bản xem trước trực tiếp cập nhật ngay khi bạn thao tác.
Các mẫu được chọn sẵn cho bạn một điểm khởi đầu tốt khi bạn không muốn bắt đầu từ một trang trống, và các thao tác một cú nhấp: ngẫu nhiên, đảo ngược, xoay 45°, giúp việc khám phá nhanh chóng. Mã CSS được tạo ra luôn hiển thị và luôn đồng bộ với bản xem trước, nên những gì bạn sao chép chính xác là những gì bạn đã thấy.
Mọi thứ được tính trực tiếp trong trình duyệt của bạn, hoàn toàn miễn phí. Sao chép toàn bộ quy tắc CSS hoặc chỉ riêng giá trị background rồi dán vào stylesheet, kiểu nút bấm hoặc một phần hero, một trình tạo gradient CSS đơn giản cho nền, lớp phủ và điểm nhấn giao diện.
Cách sử dụng Tạo gradient
- Chọn loại gradient: tuyến tính, hình tròn hoặc hình nón.
- Bắt đầu từ một mẫu có sẵn hoặc nhấp "Ngẫu nhiên" để có điểm khởi đầu ngay lập tức.
- Kéo các tay cầm điểm dừng để định vị màu, nhấp vào thanh để thêm điểm dừng, và chỉnh sửa màu của từng điểm dừng.
- Điều chỉnh góc độ, hoặc dùng "Đảo ngược" và "Xoay 45°" để định hướng lại bản pha trộn.
- Sao chép quy tắc CSS hoặc giá trị background rồi dán vào dự án của bạn.