포토스케이프를 이용한 색상 및 색상 코드 검출 방법

포토스케이프에는 PC 화면에 보이는 모든 영역의 색상을 검출할 수 있으며 동시에 검출하는 색상의 HTML 색상 코드값까지 보여줍니다.

색상 검출을 위해서는 도구 메뉴에서 색상 검출을 클릭합니다.

 

 색상 검출

색상 검출 팝업창이 뜬 상태에서 마우스 커서가 움직이는 PC 화면의 모든 영역 정보가 출력되어 나옵니다.

팝업창에서는 마우스 커서 주위의 색상 정보를 보여주는 데, 마우스 주변 영역을 1배, 2배, 4배, 8배 확대 중에서 선택해서 볼 수 있는 옵션을 두고 있습니다.

포토스케이프는 정교하게 필섹단위를 찍을 수 있는 8배 화면 확대를 기본 옵션으로 하고 있습니다.

마우스 커서 주변을 확대해서 보여주는 창 옆에는 해당 지점의 RGB 색상 코드값을 보여줍니다.

이 6자리의 RGB 색상 코드값은 직접 HTML 코딩 시에 활용할 수 있습니다.

 

원하는 픽셀의 색상을 찿았을 경우 픽업하는 방법은 간단한 데 원하는 색상에 마우스 커서를 올려놓고 키보드의 스페이스바를 누르면 됩니다.

 

색상 검출시 RGB 색상 코드값 표시

스페이스바를 누르면 시간순으로 4개의 코드값까지 복사해갈 수 있도록 버튼을 만들어주며, 해당 코드값의 색상도 함께 버튼 색상으로 표시하여 보여줍니다.

복사하기 버튼을 누르면 해당 색상의 RGB 색상 코드값이 복사되며 메모장 등에 붙여넣기하면 바로 사용할 수 있습니다.

 

간단해 보이는 기능이지만 웹에서 제공하는 색상표들은 단순히 정해진 색상표내에서 골라내는 코드값을 사용하는 방식이라 실제로 작업을 하고 있는 영역의 색상 코드값이 필요한 경우에는 난감하다는 점을 감안하면 때때로 매우 쓸모 있는 기능입니다.

 

아래에서는 포토스케이프의 색상 검출 정보창에서 보여주는 정보들인 RGB, HSB, CMYK, HSL 등의 의미에 대하여 간략하게 알아보도록 하겠습니다.

 

1. RGB

RGB는 빛의 삼원색인 빨강(Red), 초록(Green), 파랑(Blue)색의 3가지 광원을 혼합하여 색을 표현하는 방식으로 색을 섞으면 섞을수록 색이 밝아지기 때문에 가산 혼합이라고도 합니다.

RGB 좌표값은 (0,0,0)일 경우는 빛이 모두 없으므로 검은색, (255,0,0) 일 경우는 빨강 빛만 최대치이고 초록과 파랑 빛은 없으므로 빨간색, 마찬가지로 (0,255,0)은 초록색, (0,0,255)는 파란색을 나타내는 값이 됩니다.

(255,255,255)는 모든 광원의 색이 최대값이므로 가산 혼합 특성에 따라 흰색이 됩니다.

이때, 255를 16진수로 변환하면 FF가 되는데 255를 세번 변환한 값을 모두 나열하면 FFFFFF라는 RGB 색상 코드값이 나오게 되는 것입니다.

 

2. HSB

Hue(색상), Saturation(채도), Brightness(밝기)로 표현하는 색상 표현 모델로 인간의 색상 지각능력에 근거를 두고 있습니다.

기본이 되는 것은 색조 또는 색상이라고 불리우는 Hue값이라고 볼 수 있습니다. 색상값을 보고 색상을 예측할 수 있다면 색상 강도의 개념인 채도(Saturation)와 색상 밝기의 개념인 명도(Brightness)는 보조적 수단에 그치기 때문입니다.

 

Hue 색상값

3. CMYK

CMYK는 시안(Cyan), 마젠타(Magenta), 옐로(Yellow), 블랙(Black = Key)을 나타내는데 섞을수록 명도가 낮아져 검은색이 되므로 감산 혼합이라고 합니다. RGB가 가산 혼합이었던 것과는 반대의 경우입니다. RGB나 HSB보다 표현 가능한 색이 적으며 주로 옵셋인쇄나 프린터 계통에서 사용하게 됩니다.

 

RGB와 CMYK

4. HSL

HSB와 비슷한 개념으로 이  역시 인간의 색상 지각능력에 기반한 색상 구분 방법입니다.

HSL은 색조(hue), 포화(saturation), 밝기(lightness)로 컬러를 표현하는 방법인데 사람이 색을 묘사하는 방법과 유사한 속성을 사용하게 되므로 색조값만 알고 있다면 컬러차트를 보며 색상을 골라내지 않아도 차트를 보지 않고도 만들어 내기가 비교적 쉽다는 장점이 있습니다.