'그라데이션(gradation)'은 그림, 사진, 인쇄물 따위에서 밝은 부분부터 어두운 부분까지 변화해 가는 농도의 단계를 표시하는 것을 의미합니다. 제대로 된 한글 표기 원칙은 ‘그러데이션’입니다.
현재 운영하는 블로그에서 썸네일 이미지를 만들 때 그라데이션을 많이 사용하고 있고, 티스토리 스킨에 있는 CSS에서 블로그 링크, 폰트 색상, 텍스트 등과 같은 여러 구성 요소에 그라데이션을 적용하기도 합니다.
포토샵과 같은 그래픽 편집 프로그램에서 그라데이션(gradation)을 만드는 방법은 비교적 어렵지 않습니다. 하지만 어떤 색상 조합으로 그라데이션을 만들지 결정하는 건 상당히 어렵습니다.
색상 디자인에 대한 아이디어나 센스가 많으면 모르겠지만 디자인 감각이 없는 분들은 색상을 선택하고 결정하는데 많은 시간을 할애하게 됩니다.
그라데이션(gradation) 색상 조합 사이트, uigradients
오늘 소개하려는 'uigradients'는 그라데이션(gradation) 색상 조합 사이트로 색상 디자인 능력이 부족하거나 디자인 전공하시는 분들에게 매우 유용한 사이트입니다.
홈페이지에 접속하시면 홈페이지에서 자동으로 그라데이션이 추천되어 나오게 됩니다.
왼쪽과 오른쪽 양쪽 끝에 있는 방향 표시 아이콘을 클릭하시면 다른 그라데이션 색상 조합이 나오게 됩니다. 키보드 좌/우 방향키를 눌러도 됩니다.
홈페이지 왼쪽 상단에 있는 [Show all gradients] 아이콘을 클릭해주세요.
10가지 색상을 골라주시면 선택한 컬러와 색상 조합된 다양한 그라데이션 정보를 확인하실 수 있습니다.
2가지 색상 조합이 아닌 4가지 색상 조합된 그라데이션 형태도 제공됩니다.
[Rotate gradient] 아이콘을 눌러주시면 그라데이션 진행 방향을 회전시키는 것도 가능합니다.
현재 그라데이션을 CSS code로 바로 확인할 수 있어서 블로그에 바로 적용하는 것도 가능합니다.
자신이 원하는 그라데이션은 'jpg' 이미지 파일로 다운로드해서 사용하실 수 있습니다.
uigradients 사이트에서 저장한 그라데이션 이미지 파일입니다.