color picker 온라인 / Chrome Extension / 데스크탑 앱 사용방법 - 윈도우11
Color Picker
Color Picker는 프론트엔드 개발자나
디자이너들이 사용하는 프로그램입니다.
꼭 디자이너가 아니더라도 배경색이나
글자색을 입히기 위해서는 6자리로된
16진수 RGB 코드가 필요하기 때문에
대단한 프로그램은 아니지만 항상
찾게 되는 프로그램입니다.
윈도우 환경에서는 WPF의 color picker
컨트롤을 쉽게 구현할 수 있지만 시중에
워낙 color picker가 많이 나와있어서
직접만들기 보다는 자신에게 맞는 앱을
선택해서 사용하면 좋을 듯 합니다.
여기서는 세가지 방법에 대해서 알아보겠습니다.
1. 온라인
인터넷에서 제일 쉬운 방법은 google에
color picker 라고 검색하면 첫 페이지에
color picker가 나옵니다. 색상을 선택한 후
HEX 코드를 복사해서 사용할 수 있습니다
구글 검색에는 Color Picker 웹사이트가
다양하게 있습니다. 기능은 비슷한데
UI가 조금씩 다르니까 마음에 드는
웹사이트를 사용하면 됩니다.
*온라인은 인터넷만 되면 접근할 수 있지만
브라우저를 하나 사용해야 한다는 단점이 있습니다.
Chrome Extension (크롬 확장)
크롬 확장앱에는 브라우저의 기능으로
설치할 수 있는 앱이 많습니다.
아래처럼 브라우저에서 클릭해서
사용하는 앱이 기본입니다. 자주 사용하는
커스텀 색상을 아래에 추가하는
심플한 앱입니다. 클릭하면 포커스가
Hex로 되므로 Ctrl + C로 바로 복사 후
소스코드에디터에 붙여넣기 할 수 있습니다.
크롬에 보면 Eye Dropper 라는 건 색상
추출기입니다. (스포이드) 대부분 Picker와
Eye Dropper 앱들이니 비슷합니다.
크롬 확장에 놓고 쓰기를 원한다면
본인의 작업에 적당한 앱을 사용하면 됩니다.
데스크탑(Desktop)
ColorPicker를 자주 쓴다면 데스크탑 앱도
선택의 옵션입니다. 보통 코딩은 PC나
노트북에서 하기 때문에 브라우저를
띄우지 않고 사용하는 데스크탑 앱이
편리성에서 나을 수 있습니다.
Colorpicker
말그대로 Colorpicker 입니다.
개인적으로 가장 추천하는 앱입니다.
사이즈도 딱 적당하고 직관적인 UI로
실시간으로 RGB 값을 조작하여
원하는 색상을 Pick 할 수 있습니다.
보통 Color picker를 만드는게 프로그래머다
보니까 UI가 대부분 투박합니다. 그런데 이 앱은
벌써 갬성이 느껴지는게 다릅니다.
디자이너가 아니더라도 충분히
색상의 감각을 느낄 수 있는 UI와
기능적으로 필요한 것들이 다들어 있습니다.
Eyedropper, 팔레트, shade(색조), 투명도 등
자신만의 팔레트를 만들 수 있습니다.
단축키 기능도 충실합니다.
원하는 칼라를 선택한 후 Ctrl+W로
Hex를 받거나 RGB 형식으로 카피합니다.
-> #419558, rgb(65, 149, 88) 이렇게
HTML과 CSS 파일에 바로 쓸 수 있습니다.
자바스크립트와 일렉트론으로 구현한
오픈소스 무료 프로그램으로
아래 사이트에서 다운로드 받을 수 있습니다.
https://colorpicker.fr/#download
Colorpicker - Complete desktop color app
Colorpicker is a clean, easy to use, yet efficient desktop application for color management. Pick any color on your screen with Colorpicker.
colorpicker.fr
Free Color Picker (MS Store)
MicroSoft Free Color Picker는 스크린캡쳐나
이미지 파일에서 색을 추출하기 쉽도록
구현한 프로그램입니다. 기본 Color Panel도
있는데 이미지 파일에서 도트단위의 세밀한
색상 추출이 가능하다는 것이 장점입니다.
(또 Free니까 무료입니다)
MS Store에서 설치할 수 있습니다.
PowerToys Color Picker
최근에 업데이트된 Window 유틸리티 중에
PowerToys란 앱이 있습니다. MS사의
오래된 오픈소스 프로젝트인데
PowerToys 안에 탑재된 Color Picker를
사용할 수 있습니다. MS의 공식 앱 답게
윈도우의 내장 프로그램 처럼
가볍게 사용할 수 있습니다.
