Gradient Generator

CSS 그라디언트를 시각적으로 생성하고 미리보기할 수 있습니다.

그라디언트 설정

그라디언트 타입과 방향을 설정하세요

그라디언트 타입

각도 (90°)

색상 정지점

그라디언트의 색상과 위치를 설정하세요

위치:%

프리셋

미리 정의된 그라디언트를 사용해보세요

미리보기

생성된 그라디언트를 확인하세요

생성된 CSS

background: linear-gradient(90deg, #ff0000 0%, #0000ff 100%);

그라디언트 타입 설명

직선 방향으로 색상이 변화하는 그라디언트입니다. 각도를 조정하여 방향을 설정할 수 있습니다.

중심점에서 바깥쪽으로 원형 또는 타원형으로 색상이 변화하는 그라디언트입니다.

중심점을 기준으로 회전하면서 색상이 변화하는 원뿔형 그라디언트입니다.