css 그라디언트 생성 사이트

아래 링크에 가면 css 그라디언트를 편하게 생성할 수 있습니다.

https://cssgradient.io/

CSS Gradient — Generator, Maker, and Background

 

 

 

 

 

또 다른 CSS Gradient Generator 사이트 입니다.

 

https://www.colorzilla.com/gradient-editor/

Ultimate CSS Gradient Generator from ColorZilla

 

 

 

 

포토샵 처럼 Presets에서 색을 지정해 줄 수도 있고

 

Color Stop을 클릭해서 색상을 지정해서 Custom해서 사용할 수도 있습니다.

 

 

투명도를 지정하기 위해서는

투명도를 지정하고 싶은 빈영역을 클릭해 줍니다.

 

그러면 이렇게 클릭한 위치에 ColorStop가 생기고 Opacity 영역이 활성화 됩니다.

오른쪽 편에서 미리보기로 방향 사이즈등을 설정해서 css를 복사해서 사용할 수 있습니다.

Color format 변경도 가능합니다.