[Tistory] 색상표와 이미지에서 HTML색상코드 추출하기

반응형

안녕하세요? 우리노트지기 Benjamin Song입니다.


이번에는 앞서 살펴본 html 색상코드 원리에 이어서 색을 실제로 보고 바로 html코드값을 뽑아내는 방법에 대해 알아보도록 하겠습니다.


- 관련 글 -


[Tistory] html 색상코드 원리


html 색상표를 제공하는 사이트가 여러군데가 있는데요. 저는 개인적으로 아래의 사이트가 마음에 들어 자주 사용하고 있습니다.


http://html-color-codes.info/




사이트의 우측 상단에 보면 언어를 손쉽게 변경 가능하도록 국기 모양이 표시되어있습니다. 한국어도 제공하니 언어를 변경해서 보면 더 편리하게 사용 가능합니다.


색상 HTML 코드 추출


[Color Tools] 에서 2가지의 색상 추출 방법을 제공합니다


HTML Color Chart 에서 대표적인 색 몇가지를 제공하고 있어 해당 색을 마우스로 클릭하면 아래쪽에 history list 가 생성되면서 선택한 색상의 코드값이 표시됩니다.




HTML color Picker 에서는 앞의 글에서 설명한 색상 값 조합으로 16777216 가지의 색을 선택이 가능합니다.

원하는 색을 선택하시던지 RGB값을 입력하신다음 우측하단의 [On the list] 를 선택하시면 위에서와 마찬가지로 list 가 생성됩니다.




이미지에서 색 추출


추가로 재미있는 기능이 있어서 함께 소개해 드립니다. 

상단 메뉴중에 보이는 [Color from images] 입니다. 메뉴 이름 그대로 이미지의 색상값을 찾아주는 프로그램입니다.

[파일선택]을 눌러서 내 컴퓨터의 이미지 파일을 선택하고 [Show image]를 누르시면 미리보기 화면이 나옵니다. 이미지 화면 중 코드 값을 알고 싶은 부분을 클릭하면 우측하단에 코드값이 추출되어져 나옵니다.




누군가에게 유용한 정보가 되었기를 기대하며 색상표와 이미지에서 HTML색상코드 추출하기에 관련된 글을 마칩니다.


댓글

Designed by JB FACTORY