웹솔루션개발 25년 노하우! 해피CGI의 모든것

기본적인 그라데이션 부터 독특한 패턴의 그라데이션을 css로 구현할 수 있게 해주는 사이트 'gradient magic'을 소개합니다. 그라데이션 패턴 스타일, 색상별로 원하시는 그라데이션을 찾아볼 수 있습니다. standard angular stripes checkered burst 위 5가지 스타일의 그라데이션을 확인 할 수 있습니다. 원하는 그라데이션을 선택하여 클릭하시면 큰화면으로 그라데이션을 확인할 수 있습니다. 그라데이션 썸네일 우측하단의 copy css를 통해 해당 그라데이션에 사용된 css소스를 복사하여 사용할 수 있습니다. 복사된 소스는 backgroud css로 사용하시면 됩니다. 사용 예시) 예시와 같이 직접 소스를 사용하셔서 독특한 패턴의 그라데이션들도 사용해보시길 추천드립니다.

여러가지 색상을 이용해서 그라데이션 효과를 만들어서 화면에 보여줄수 있는 스크립트입니다. 첨부파일을 다운로드 받아서 압축을 푸신후에 demo.html 을 웹브라우져로 열어 보면 확인이 가능합니다. 가로를 기준으로 그라데이션 효과를 줬을때 화면 세로를 기준으로 효과를 줬을때 화면 여러가지 색상을 추가해서 효과를 준 예제 색상을 변경할수 있고, 가로나, 세로형태가 아니라 원형으로도 효과를 줄수가 있네요 화면에 보이는 효과를 주기 위해서 사용된 스타일 코드도 확인이 가능하네요. 출처는 http://www.htmldrive.net/items/show/1310/very-nice-and-useful-gradientcolor-selector-with-jQuery 입니다.