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

[해피CGI][cgimall] 독특한 css 그라데이션 갤러리 Gradient Magic 본문

웹프로그램밍 자료실/기타 자료

[해피CGI][cgimall] 독특한 css 그라데이션 갤러리 Gradient Magic

해피CGI윤실장 2019. 9. 26. 09:12


기본적인 그라데이션 부터 독특한 패턴의 그라데이션을

css로 구현할 수 있게 해주는 사이트 'gradient magic'을 소개합니다.


그라데이션 패턴 스타일, 색상별로 원하시는 그라데이션을 찾아볼 수 있습니다.



standard


angular


stripes


checkered


burst


위 5가지 스타일의 그라데이션을 확인 할 수 있습니다.



원하는 그라데이션을 선택하여 클릭하시면 큰화면으로 그라데이션을 확인할 수 있습니다.



그라데이션 썸네일 우측하단의 copy css를 통해
해당 그라데이션에 사용된 css소스를 복사하여 사용할 수 있습니다.

복사된 소스는 backgroud css로 사용하시면 됩니다.

사용 예시)
<div style="width:500px; height:500px; background:linear-gradient(135deg, rgb(68, 202, 201) 0%,rgb(252, 255, 114) 100%)"></div>



예시와 같이 직접 소스를 사용하셔서 독특한 패턴의 그라데이션들도 사용해보시길 추천드립니다.




홈페이지바로가기

Comments