정보

맥북 포토스케이프를 이용해서 색깔검출(색상코드 확인) 하는 방법

ㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤ 2020. 5. 5.

색상코드(Color Code) 란?

솔직히 필자도 뭐 자세하게 알지는 못합니다. 하지만 우리가 기기를 통해 눈에 보이는 색상들 대부분은 코드를 통해서 입력되어있을 것입니다. 예를들어 네이버를 생각하면 처음으로 떠오르는 색상은 "초록색" 입니다. 또, 카카오를 생각하면 "노란색" 이 떠오르겠죠. 눈에보이는 개체들의 색을 표현하기 위해 만들어진 디지털 코드를 색상코드라고 부른다고 합니다. 코딩이나 프로그래밍 작업을 하실 때, HTML 등에서 사용되곤 합니다. 

 

이렇듯 인터넷 상에서 보이는 색상들은 모두 HTML로 코딩이 되어있습니다. 아래는 이러한 색상차트를 정리해둔 사이트입니다. 

 

HTML 컬러 코드

HTML 컬러 차트 사각형 모양의 컬러버튼을 클릭하여 HTML 컬러 코드를 찾으세요. HTML 컬러 코드 이론 "이 이상한 기호와 숫자와의 조합이 어떤 의미가 있을까?" 하고 궁금하신가요. 그 답은 "예" 입니다. 다음의 설명을 참조하세요. :) HTML 코드 포맷 : 각각의 HTML 코드는 "#"와 6자리 숫자로 되어있습니다. 이 숫자는 16진법의 숫자 시스템입니다. 예를 들면 16진법에서 "FF"는 십진법에서의 숫자 25를 나타냅니다. 상징의 의미 :

html-color-codes.info

 

네이버의 초록색에 사용된 색상코드는 #17ce61 입니다. 

 

카카오의 노란색에 사용된 색상코드는 #fce100 입니다. 

 

자, 그럼 이런 정보는 어떻게 얻을 수 있을까요? 사이트 등에 접속해 손끝의 감각을 믿고 때려맞추면 될까요?

그렇지 않습니다. 많은 프로그램과 툴에서 색상검출 등의 서비스를 제공하고 있습니다. 필자는 맥북의 포토스케이프 라는 무료프로그램을 가장 즐겨 사용합니다. 포토스케이프를 통해 색상 검출을 하는 방법을 알아보겠습니다.  

 

 

 

 

포토스케이프에서 도구 - 색상검출 클릭

 

 

 

 

색상검출을 원하는 개체 포토스케이프에 불러오기 

 

 

 

 

색상검출 원하는 부분에 마우스 스크롤 가져댄 후 Space 키 누르기.

 

 

 

이렇게 포토스케이프의 색상검출 기능을 이용하면 원하는 개체 색상의 정확한 코드를 찾을 수 있습니다. 

디자인을 하시는 분들이 아니더라도 아주 컴퓨터 지식이 없는 분들도 쉽게 따라할 수 있으니 궁금하신 분들에게 도움이 되었으면 좋겠습니다. 

댓글

💲 추천 글