Ultimate CSS Gradient Generator

2014. 4. 29. 15:47 IT 및 개발/HTML/CSS/JS

이미지 작업할 경우 그라데이션 사용을 많이 해봤을 것입니다.

요즘엔 웹에서도 많이 사용하죠.. 

예전에 그라데이션을 할려면 이미지로 만들어서 배경으로 했었는데요.

CSS3가 나오면서 이미지가 아닌 css로 사용이 가능해졌습니다.

그런데 문제는 크로스브라우징이네요.. 각각 브라우저마다 명령어가 조금씩 다르다보니.. 왜 이렇게 만든겐쥐...

어떻게보면 그냥 이미지로 만들어서 배경으로 사용해버리는게 편하기도 할거 같네요^^

단 배경이 유동적으로 사이즈가 변경이 될 경우가 문제네요^^


아래에 설명할 사이트는 이런 그라데이션 css 코드를 만들어주는 사이트입니다.


Ultimate CSS Gradient Generator 바로가기


포토샵을 사용해보신분은 아시겠지만.. 포토샵 그라데이션 설정 화면과 비슷하게 디자인이 되어있습니다.

Preset을 이용하거나 직접 색을 선택해서 원하는 그라데이션을 만들 수 있습니다.

그런후 생성된 css 코드를 복사해서 사용만 하면 끝입니다.

단 코드가 깁니다.. 모든 브라우저 지원을 하다보니 엄청 기네요.

아무튼 그라데이션 사용할 일이 있으면 편히 위 사이트에서 css 코드를 생성 후 사용하시기 바랍니다.

이 댓글을 비밀 댓글로