디자인
CSS 그라디언트 생성기
Linear · Radial · Conic 그라디언트를 시각적으로 만들고 CSS 코드를 바로 복사합니다.
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);그라디언트 유형
방향 / 각도
deg
컬러 스탑
#667eea
%
#764ba2
%
프리셋
추가 CSS 형식
background
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);background-image
background-image: linear-gradient(135deg, #667eea 0%, #764ba2 100%);사용 방법
- 유형 선택 — Linear(선형), Radial(방사형), Conic(원뿔형) 중 하나를 선택합니다.
- 방향·각도 조정 — Linear는 방향 버튼이나 슬라이더로 각도를 설정합니다.
- 색상 편집 — 색상 사각형을 클릭해 색상 피커를 열고, 슬라이더로 위치(0–100%)를 조정합니다.
- 스탑 추가 — 최대 8개까지 추가하거나 랜덤 버튼으로 즉시 생성합니다.
- 복사 — CSS 코드를 복사해 스타일시트에 바로 붙여넣습니다.