Tạo ra một loạt các màu giữa hai màu

Với một màu bắt đầu và một màu kết thúc, liệu thuật toán có thể tạo ra một loạt các màu giữa chúng không? Ví dụ, với các sắc thái sáng và tối của màu xanh / xám ở đầu và cuối của hình ảnh bên dưới, làm thế nào tôi có thể tạo ra các sắc thái trung gian?

Một giải pháp khả thi tôi đang xem xét là tạo một gradient từ hai màu và sau đó lấy mẫu màu tại các điểm tương đương dọc theo gradient đó. Đó có phải là cách tiếp cận tốt nhất?

Điều này được gọi là nội suy màu . Đó là những gì gradient làm dưới mui xe. Bạn có thể làm như vậy bằng nhiều phương tiện và phương pháp khác nhau và chính xác cách kết quả được nội suy phụ thuộc vào phương pháp.

Tôi thường làm điều này cho các dự án web bằng JavaScript để tôi có thể thay đổi màu sắc một cách linh hoạt, chẳng hạn như trong trình hiển thị nhạc này . Một triển khai JavaScript có phương pháp nội suy tuyến tính rất đơn giản sử dụng RGB, được lấy từ ví dụ trên, như sau:

Bản thử trực tiếp

// Returns a single rgb color interpolation between given rgb color
// based on the factor given; via https://codepen.io/njmcode/pen/axoyD?editors=0010
function interpolateColor(color1, color2, factor) {
    if (arguments.length < 3) { 
        factor = 0.5; 
    }
    var result = color1.slice();
    for (var i = 0; i < 3; i++) {
        result[i] = Math.round(result[i] + factor * (color2[i] - color1[i]));
    }
    return result;
};
// My function to interpolate between two colors completely, returning an array
function interpolateColors(color1, color2, steps) {
    var stepFactor = 1 / (steps - 1),
        interpolatedColorArray = [];

    color1 = color1.match(/\d+/g).map(Number);
    color2 = color2.match(/\d+/g).map(Number);

    for(var i = 0; i < steps; i++) {
        interpolatedColorArray.push(interpolateColor(color1, color2, stepFactor * i));
    }

    return interpolatedColorArray;
}

Được sử dụng như vậy và trả về một mảng các màu được nội suy:

var colorArray = interpolateColors("rgb(94, 79, 162)", "rgb(247, 148, 89)", 5);

Bạn cũng có thể tìm thấy các tiện ích mở rộng PhotoShop (và có thể là chương trình khác) để thực hiện phép nội suy màu. Tuy nhiên, bạn có thể muốn kiểm tra để đảm bảo phương pháp nội suy giống với phương pháp mà bạn mong muốn, vì bạn có thể sử dụng bất kỳ hàm nào để nội suy dựa trên.

Hãy xem câu trả lời này. Làm thế nào để làm cho một màu nhất định tối hơn hoặc sáng hơn một chút?

Nơi bạn chỉ cần lấy các giá trị riêng biệt của từng thành phần RGB và chia các giá trị.

Nhưng chúng ta có một vấn đề, không chỉ có một cách để thực hiện chuyển đổi màu.

Aproach đầu tiên sẽ cung cấp cho bạn tuyến đường ngắn nhất (1) nhưng có lẽ tuyến đường đó không phải là thứ bạn cần.

Điều này cũng được áp dụng bởi mô hình màu hoặc logic. Ví dụ, trong mô hình màu Lab *, Đỏ và Xanh lục là các màu bổ sung, do đó, tuyến đường ngắn trên mô hình đó sẽ chuyển qua màu xám trung tính (3).

Nếu bạn chỉ cần sắc thái của một màu, câu trả lời khác là một màu phù hợp.

Sử dụng kết hợp trong Illustrator trong RGB hoặc CMYK:

• tạo 2 hình dạng với màu bắt đầu và màu kết thúc (một màu xám và một màu đen trong ví dụ này, nhưng chọn bất cứ thứ gì bạn cần)
• đi đến Object → Blend → Blend Optionsvà nhập số lượng Specified stepsbạn cần ở giữa (20 trong ví dụ của tôi dưới đây)
• chọn hai đối tượng của bạn và chọn Object → Blend → Make. Điều này sẽ tạo ra sự pha trộn mà sau đó bạn có thể chuyển đổi thành các đối tượng riêng lẻ thông qua Object → Expand. Sau đó, bạn có thể thấy từng đối tượng trung gian với mã màu riêng.

Đây là một bổ sung cho các câu trả lời khác.

Khi bạn nội suy màu sắc trong sRGB, bạn phải xem xét rằng các giá trị RGB không phải là tuyến tính ở cường độ ánh sáng mà là tuyến tính ở cường độ ánh sáng nhận biết của con người. Điều này làm cho việc lưu các giá trị dễ dàng hơn, nhưng đối với các hoạt động màu khác nhau, cần phải chuyển sang không gian màu tuyến tính.

Nhận thức của con người về cường độ ánh sáng là theo một định luật sức mạnh, vì vậy với

linear = sRGB^2.2
sRGB = linear^(1/2.2)

có thể được sử dụng để biến đổi giữa hai. Điều này sử dụng giá trị gamma là 2.2, là giá trị cho sRGB. Để biết thêm thông tin về vấn đề này thấy này bài viết Wikipedia.

Một phân tích chi tiết về vấn đề này và các ví dụ về việc triển khai sai có thể được tìm thấy ở đây . Một trong số đó là một dải màu sử dụng phép nội suy tuyến tính và sRGB.

Độ dốc của Photoshop (hoặc tương đương "Blend" trong Ai) đã được trình bày như một cách để có được sự chuyển đổi màu tuyến tính giữa màu bắt đầu và màu kết thúc. Làm thế nào để chúng ta có được một cái gì đó phi tuyến (một đường chuyển tiếp cong) mà không cần lập trình một số mã script?

Một giải pháp là sửa đổi đường dẫn chuyển tiếp gradient bằng cách điều chỉnh các lớp hoặc chế độ hòa trộn hoặc cả hai. Điều này thực sự tạo ra một sự biến đổi liên tục từ màu bắt đầu sang màu kết thúc, nếu các lớp sửa đổi có mặt nạ lớp liên tục và làm cho affection = Zero ở đầu và cuối.

Đây là một twist khá phức tạp. Lớp "Target một mình" có độ dốc và lớp "Công cụ sửa đổi" tạo ra sự thay đổi màu liên tục bằng cách trộn chế độ "Màu" Để làm cho tất cả bị xoắn, bản thân công cụ sửa đổi là một gradient.

Nhiều vòng xoắn được tạo ra bởi một lớp điều chỉnh "Curves" có thêm độ tương phản. Nó có mặt nạ lớp giống như Modifier, nhưng điều đó không bắt buộc. Bất kỳ mặt nạ nào cũng được, nếu nó liên tục và đen ở đầu và cuối.

Có tồn tại một số chế độ pha trộn không liên tục và các đường cong gây ra một bước nhảy đột ngột. Một trong số đó là "Huế". Một khả năng khác để làm hỏng hiệu ứng là "không thay đổi", một vùng màu không đổi có thể nhìn thấy được bằng cách cắt tất cả bằng 0 hoặc tất cả 255. Tôi chưa kiểm tra cũng không tính toán, thực tế nó giúp sử dụng chế độ RGB 48 bit / pixel như thế nào. Có lẽ hoàn toàn không, vì chúng ta vẫn chỉ có 24 bit / pixel trên màn hình.