웹에서 컬러셋을 확인 할 수 있는 페이지를 만들어 봤습니다. 제작이야기 | Posted on 2017. 5. 18. 18:03
음음..
웹상에서 컬러셋을 확인 할 수 있는 페이지( https://manana.kr/color-set/view/ )를 만들어 봤습니다.
이유는, 업무를 진행하다보면, 웹상에서의 코드가 어떻게 나오는지 잘 모르는 디자이너 분들이 많아서.. (.. .. ..)
직접 컬러셋 지정해서 확인해보라고..
웹D일을 해본 사람은 대충 알던데, 처음하거나 하는 사람은 잘 모르더라..
나보고 이상한 컬러셋 쓰지 말라는데, 림이 psd에 지정한 그 컬러셋이거든요!?
색상코드가 적힌 인풋박스를 클릭하면, 팔렛트가 뜨게 되며, 팔렛트에서 색상의 조절이 가능합니다.
물론, 색상코드를 직접 수정해서 확인 하는 방법도 존재합니다.
기본적인 컬러는 5색(본인이 주로 웹사이트 만들때 사용하는 컬러셋의 갯수)이며, 더 적게도, 더 많게도 가능합니다.
색상 지정을 다 하고, 공유를 하고 싶다면 오른쪽 상단의 '주소확인'이라는 버튼을 클릭하면 화면이 새로고침됩니다.
새로고침이 되면 주소가 바뀌게 되는데, 이 주소를 공유해주시면 그 컬러셋을 확인 할 수 있습니다.
주소에서 컬러셋의 색상을 하나 지우면 4개의 색상이 나타나게 됩니다.
(1개의 컬러셋만 볼수도 있습니다.)
반대로 컬러셋의 색상을 늘리면 늘린만큼의 색상이 나타나게 됩니다.
그러니까 주소의 뒤에 %23 하고 뒤에 컬러셋을 붙이면 됩니다.
예를들어 #000을 추가한다면..
%23000/을 위의 주소 뒤에 붙여주시면 됩니다.
#000과 #fff를 추가한다면..
%23000/%23fff/를 주소 뒤에 붙여주시면 되는..
대략 2년전쯤? 부터 한번 만들어 봐야지.. 하면서 생각만하다가 못만들었는데..
생각난김에 만들어 봤습니다.