Pha trộn các CSS của riêng bạn với ứng dụng web miễn phí này

Mỗi nhà thiết kế web nên biết về Độ dốc CSS3. Chúng đã tồn tại nhiều năm và chúng được hỗ trợ rộng rãi bởi tất cả các trình duyệt chính.

Và bây giờ, các ứng dụng web miễn phí như trộn cho phép bạn tạo gradient CSS3 nhanh chóng với trình soạn thảo trực quan trong trình duyệt. Bạn có thể chọn giữa độ dốc tuyến tính và hướng tâm trong khi mày mò với màu sắc để pha trộn.

Trang ban đầu tải với hai màu rắn ở hai bên. Bạn có thể dùng bảng màu để lật giữa các màu hoặc nhập một mã HEX thủ công nếu bạn biết màu bạn muốn Khi bạn đã có hai màu bạn thích, hãy nhấp vào “Hãy pha trộn” nút ở Trung tâm.

Cả hai màu hòa trộn với nhau thành một gradient CSS3 với tùy chọn có thể chỉnh sửa gần đầu trang. Bạn có thể chọn giữa độ dốc tuyến tính & độ dốc xuyên tâm, và nếu bạn đang sử dụng kiểu tuyến tính, bạn có thể kéo vị trí trung tâm tất cả trên trang.

Ngoài ra, trong khi bạn trong chế độ pha trộn bạn vẫn có thể quay lại thay đổi màu sắc ở phía dưới Đây giống như trình tạo gradient CSS3 không có mã hoàn hảo mà mọi nhà thiết kế cần.

Khi bạn có hai màu bạn thích, bạn có thể nhấp vào biểu tượng khung mã ở góc trên bên phải. Điều này mang đến một cửa sổ với mã CSS bạn có thể sao chép / dán vào bảng định kiểu của mình.

Blend là một công cụ miễn phí được tạo ra bởi nhà thiết kế NYC Colin Keany. Nó cũng là lưu trữ trên trang web của mình, mặc dù tôi không thấy liên kết đến GitHub hoặc bất kỳ mã nguồn miễn phí nào ở bất cứ đâu. Nhưng anh ấy đã viết một trường hợp nghiên cứu chi tiết quá trình của mình tạo ra Blend với tất cả các tính năng tiện dụng của nó.

Thật không may, phiên bản hiện tại không hỗ trợ nhiều hơn hai màu. Nhưng tôi đang vượt qua các ngón tay của mình để có nhiều lựa chọn màu sắc trong tương lai.

Vì bạn không thể tải xuống một bản sao cục bộ, tôi khuyên bạn nên đánh dấu Blend để sử dụng trong tương lai. Đó là cách hoàn hảo để kiểm tra độ dốc không liên tục chỉnh sửa biểu định kiểu của bạn.

Và, nếu bạn muốn chia sẻ ý tưởng của mình hoặc chỉ nói cảm ơn về công cụ gradient này, bạn có thể tweet Colin @colinkeany.