⭐ 0
🔍
văn bản Hình ảnh PDF & Tài liệu Âm thanh Âm nhạc Điện tử Thời gian Tiện ích Trình xác nhận Huyền học Trò chơi

Trình tạo gradient hình nón CSS

Xây dựng các gradient CSS một cách trực quan: kiểu tuyến tính, hướng tâm hoặc hình nón, thanh trượt góc và tối đa sáu điểm dừng màu với bản xem trước toàn chiều rộng trực tiếp và mã có thể sao chép.

90°
Đang xử lý... 0%

kết quả

Trang này mở trình tạo gradient với kiểu hình nón đã được chọn: thay vì mờ dần theo một đường hoặc ra khỏi tâm, màu sắc sẽ quét quanh tâm giống như kim đồng hồ, bắt đầu từ góc bạn đặt trên thanh trượt.

conic-gradient() là hàm mới nhất trong ba hàm CSS gradient và là hàm đứng sau biểu đồ hình tròn, bánh xe màu và hiệu ứng viền xoay bắt mắt. Các vị trí dừng theo phần trăm là các vị trí xung quanh vòng tròn — hai điểm dừng ở mức 0% và 100% hòa quyện mượt mà xung quanh, trong khi các điểm dừng được đặt gần nhau tạo ra các hình nêm sắc nét.

Điều chỉnh góc bắt đầu và dừng lại cho đến khi phần xem trước đọc đúng, sau đó sao chép dòng nền. Tất cả các trình duyệt hiện đại đều hỗ trợ độ dốc hình nón, vì vậy mã được vận chuyển an toàn.

🛡️
Thực hiện trong trình duyệt

Các tập tin và dữ liệu đầu vào của bạn sẽ không bao giờ rời khỏi thiết bị này. Quá trình xử lý chạy hoàn toàn ngoại tuyến. An toàn 100%.

Định dạng và quy tắc được chấp nhận

  • Chọn loại chuyển màu (tuyến tính, xuyên tâm, hình nón) với thanh trượt góc cho chế độ tuyến tính và hình nón.
  • Danh sách dừng màu: hai điểm dừng để bắt đầu, thêm hoặc xóa tối đa sáu điểm dừng, mỗi điểm dừng có bộ chọn màu riêng và vị trí theo phần trăm.
  • Dòng CSS nền có thể sao chép cùng với các trang cài sẵn được tạo sẵn cho độ dốc màu hoàng hôn, đại dương và màu phấn.

Lợi ích chính

✓ Bản xem trước toàn chiều rộng sẽ vẽ lại sau mỗi thay đổi — loại, góc và từng điểm dừng màu — vì vậy CSS bạn sao chép chính xác như những gì bạn đã thấy.
✓ Tối đa sáu điểm dừng màu với các vị trí riêng lẻ bao gồm mọi thứ từ độ mờ hai màu đơn giản đến nền nhiều dải phức tạp.
✓ Một khai báo, ba động cơ: chuyển đổi giữa tuyến tính, hướng tâm và hình nón mà không cần xây dựng lại điểm dừng của bạn.

Trường hợp sử dụng

  • • Soạn nền cho phần anh hùng bằng cách kéo góc và các điểm dừng màu thay vì chỉnh sửa bằng tay tuyến tính-gradient() và tải lại.
  • • So sánh các điểm dừng màu giống nhau dưới dạng chuyển màu tuyến tính, hướng tâm và hình nón bằng một công tắc - các điểm dừng chuyển tiếp giữa các loại.
  • • Lấy một sự kết hợp đã được chứng minh từ trang đặt trước về hoàng hôn, đại dương hoặc màu phấn và điều chỉnh nó thành màu sắc thương hiệu của bạn.