Tạo Gradient CSS — Nền Đẹp Không Cần Vất Vả

Gradient CSS là kỹ thuật nền mạnh mẽ từng đòi hỏi hình ảnh. Trình tạo của chúng tôi cho phép xây dựng gradient trực quan và tạo code CSS dùng ngay lập tức.

Gradient Tuyến Tính, Hướng Tâm và Hình Nón

Tuyến tính (linear-gradient()) chuyển đổi theo đường thẳng. Hướng tâm (radial-gradient()) tỏa ra từ tâm điểm. Hình nón (conic-gradient()) xoay quanh điểm — lý tưởng cho hiệu ứng biểu đồ tròn.

Color Stop và Vị Trí

Color stop xác định nơi màu bắt đầu hoặc kết thúc. Nhiều stop tạo gradient nhiều màu. Chuyển tiếp cứng bằng hai stop ở cùng vị trí: #ff0000 50%, #0000ff 50%.

Kết Hợp Gradient

Nhiều gradient xếp chồng bằng dấu phẩy tạo ra các mẫu phức tạp. repeating-linear-gradient() lặp lại một mẫu. Tạo animation gradient qua background-position để thay đổi màu mượt mà.