웹 사이트의 색상을 분석해 보자

블로그/추천사이트

블로그나 웹 사이트를 운영하는 사람이라면 사이트의 디자인에 대하여 늘 고민하게 됩니다. 보기 좋은 떡이 먹기도 좋다는 속담이 있듯이 방문자가 사이트를 방문했을 때, 멋진 디자인으로 맞이한다면 좋은 인상을 남길 수 있으므로 재방문할 확률이 높기 때문입니다.

인터넷을 서핑하다 보면 디자인이 멋진 사이트를 만나게 됩니다. 이럴 때 웹 사이트 색상 분석기를 이용하면 쉽게 그 사이트에서 사용한 색상을 분석하고 참고할 수 있는데 그러한 색상 분석기를 무료로 사용할 수 있는 곳이 있어서 소개합니다. 따라서 즐겨찾기에 등록해 두고 필요할 때 한 번씩 이용한다면 웹 사이트나 블로그 제작 시 여러모로 도움이 될 것입니다.

웹 사이트 색상 분석기 Colorfy

이 도구를 사용하면 어떤 웹 사이트의 색상을 검색할 수 있습니다. 단순히 주소 입력란에 사이트의 주소만 입력하면 그 사이트에서 사용된 모든 색상과 그 색상코드를 추출해 보여 줍니다. 그럼 사용법을 살펴 볼까요?

홈페이지에 접속한 뒤 'Import URL'에 분석하고 싶은 사이트의 주소를 입력하고 'Colorfyit'을 클릭합니다.

웹 사이트 색상 분석기 Colorfy

클릭하면 기본화면이 아래처럼 나오며 각각의 셀에 마우스를 올리면 색상 코드와 그 색상이 사이트에서 몇 번 사용되었는지 표시됩니다.

웹 사이트 색상 분석기 소개

웹 사이트 색상 분석기 소개-2

Small 탭을 클릭하면 기본화면의 셀 크기가 작아지므로 사이트에서 사용된 색상을 한눈에 파악할 수 있습니다.

웹 사이트 색상 분석기 소개-3

Wide 탭에서는 색상을 16진수 표기와 RGB 및 HSV 형태로 표시해 주며 코드를 복사할 수 있습니다.

aco 파일 다운로드

Export to ACO: All 탭을 클릭하면 aco 파일을 내려받을 수 있습니다.

'ACO'의 전체 파일명은 Adobe Photoshop Color Swatch File으로 포토샵 컬러 스와치 정보를 담고 있는 파일입니다. 포토샵 스와치 팔레트 오른쪽 부분의 삼각형 팝업 단추를 누르면 나오는 메뉴에서 색상 견본 불러오기로 불러와 사용할 수 있습니다.

Paste CSS or HTML는 스타일 시트의 스타일이나 웹 문서의 소스를 입력하면 소스에 적용된 색상을 추출해 보여줍니다.

웹 사이트 색상 분석기 소개-4

마무리 하면서...

색상을 잘 배합한다면 화려한 이미지를 사용하지 않아도 멋진 사이트를 만들 수 있습니다. 인터넷 서핑 중 만난 멋진 사이트가 있다면 어떤 색을 사용했는지 확인해보세요.

+ 댓글은 큰 힘이 됩니다. 0