컬러 보간

Question

좋아, 나는 전형적인 색상 선택기에서 찾고 있어요 그것은 다음과 같은 :

우리는 채도가 높은 색상을 처리하는 경우는, 혼합 패턴은 다음과 같이 동작합니다

R 255 
G 0 
B 0 

R 255 
G 0 -> 255 
B 0 

R 255 
G 255 
B 0 

R 255 -> 0 
G 255 
B 0 

R 0 
G 255 
B 0 

R 0 
G 255 
B 0 -> 255 

R 0 
G 255 
B 255 

R 0 
G 255 -> 0 
B 255 

R 0 
G 0 
B 255 

R 0 -> 255 
G 0 
B 255 

R 255 
G 0 
B 255 

R 255 
G 0 
B 255 -> 0 

R 255 
G 0 
B 0 

0에서 1까지의 값을 취하여이 스펙트럼에 색상을 생성하는 보간 함수 f를 정의 할 수 있습니까? (여기서 0과 1은 위에 게시 된 스펙트럼의 왼쪽과 오른쪽에 해당합니다)? 나는 채도가 높은 색상 (하나의 구성 요소는 항상 255)에만 관심이 있습니다. 또한이 패턴이 R에서 G, B까지 혼합되어 있음을 알았습니다. 그러나 사이 안, 마젠타 및 옐로우를 혼합 한 유사한 기능이 있습니까? 그리고 이것이 올바르지 않더라도, f (0)이 cyan과 f (1)이 노란색으로 생성되면 f (0.5)는 페인트 두 개를 혼합하면 달성 할 수있는 것과 비슷한 녹색을 낳습니다.

나는 이것이 의미가 있기를 바랍니다. 제발 내가 무엇이든 명확하게 해달라고 해주세요. 감사!

Answer 1

http://www.w3.org/TR/css3-color/#hsl-color은 부족한 CSS3 웹에 대해 HSL을 설명하고 간단한 HSL-> RGB 구현을 포함합니다.

Answer 2

어떤 경우에는 HSL이 RGB보다 좋지만 HCL이 가장 시각적입니다. 계산적으로 비용이 많이 들지만 중간 단계로 사용할 수 있습니다. 표준 보간 기능은 항상 :

C(x) = (1.0 - x) * color_1 + x * color_2, where x in (0.0, 1.0) 

당신은 모든 구성 요소, 빨강, 녹색 및 블루 또는 색상의 채도 및 값이 작업을 수행하고자합니다. 각 구성 요소가 하나 또는 직쇄 정규화 0.0 (1.0에 0.0)에서 255.0까지 가능

R(x) = (1.0 - x) * color_1.red + x * color_2.red 
G(x) = (1.0 - x) * color_1.green + x * color_2.green 
B(x) = (1.0 - x) * color_1.blue + x * color_2.blue 

.

RGB 값을 사용할 때 중간 결과는 시각적으로 달성하기를 원하지 않을 수 있습니다. 그러나 수치 결과는 항상 있어야합니다. 즉, R G와 B 값은 처음부터 끝까지 부드럽게 움직여야합니다. 시각적으로 그러나 이것은 어떤 미지의 회색을 초래할 수 있으며 이것은 HCL이 빛나는 곳입니다.

자세한 내용은 this 튜토리얼을 참조하십시오.