Trình tạo chuyển sắc CSS
Tạo chuyển sắc CSS tuyến tính, tỏa tròn và hình nón với nhiều điểm dừng màu rồi sao chép mã.
background: —;
Mọi thứ chạy trong trình duyệt của bạn — không tải lên, không cần đăng ký.
Giới thiệu về Trình tạo chuyển sắc CSS
CSS Gradient Generator dựng gradient tuyến tính (linear), tỏa tròn (radial) và hình nón (conic) với khả năng kiểm soát trực quan đầy đủ. Thêm điểm dừng màu bằng cách click vào thanh gradient, kéo để định vị lại, và gán cho mỗi điểm dừng màu, độ mờ và vị trí riêng. Gradient tuyến tính có điều khiển góc; gradient tỏa tròn có hình dạng (circle hoặc ellipse) và vị trí; gradient hình nón có góc bắt đầu.
Bản xem trước sống động hiển thị chính xác những gì trình duyệt sẽ render, và một nút ngẫu nhiên hóa cùng bộ preset được tuyển chọn luôn sẵn sàng khi bạn cần điểm khởi đầu thay vì một khung trống. Điểm dừng có thể thêm và bớt tự do — một gradient chỉ cần ít nhất hai điểm dừng.
Khi đã ưng ý, sao chép giá trị gradient thuần túy hoặc một quy tắc CSS hoàn chỉnh. Công cụ chạy hoàn toàn trên trình duyệt của bạn, không tải lên, không cần đăng ký, khiến nó thành người bạn đồng hành nhanh gọn cho nút bấm, nền hero, viền và hiệu ứng chữ.
Cách sử dụng Trình tạo chuyển sắc CSS
- Chọn kiểu gradient: linear, radial hoặc conic.
- Đặt góc (linear), hình dạng và vị trí (radial), hoặc góc bắt đầu (conic).
- Click vào thanh gradient để thêm điểm dừng màu và kéo chúng vào vị trí.
- Gán màu, độ mờ và vị trí chính xác cho mỗi điểm dừng.
- Thử các preset hoặc nút ngẫu nhiên hóa để có cảm hứng nhanh.
- Sao chép giá trị gradient hoặc toàn bộ quy tắc CSS.