그라데이션 생성기

그라데이션은 웹사이트 배경, 커버, 배너, 휴대폰 배경화면으로 쓰입니다. 이 페이지는 2~5가지 색 사이의 부드러운 전환을 그려 원하는 크기의 이미지로 저장하거나 완성된 CSS 코드를 제공합니다.

그라데이션은 세 가지 유형을 쓸 수 있습니다. 선형은 원하는 각도의 직선을 따라 이어지고, 방사형은 중심에서 원 모양으로 퍼지며, 원뿔형은 중심을 기준으로 색상환처럼 펼쳐집니다. 각도는 슬라이더로 조절하고 미리보기는 즉시 바뀝니다.

색은 팔레트에서 고르고, 버튼 하나로 색을 추가하거나 뺄 수 있습니다. 직접 고르기 싫다면 준비된 조합과 무작위 그라데이션 버튼을 이용하세요. 마음에 드는 결과가 나올 때까지 눌러 보기에 좋습니다.

이미지 옆에는 파일 없이도 페이지에서 같은 그라데이션을 만들어 주는 CSS 규칙이 표시됩니다. 그 줄을 복사해 스타일 시트에 붙여넣기만 하면 됩니다. 이미지 크기는 1~8000픽셀 범위에서 지정합니다.

이미지는 브라우저에서 만들어지고 서버로 전송되지 않으므로 페이지를 불러온 뒤에는 인터넷 없이도 작동합니다. 저장 형식은 PNG, JPG, WebP 중에서 고릅니다. 부드러운 전환에는 노이즈가 생기지 않는 PNG가 더 알맞습니다.