물결 SVG 생성기
물결의 크기·모양·색을 조정해 웹 페이지 구분선이나 배경을 만듭니다. SVG나 배경용 CSS를 복사·저장할 수 있고 PNG 이미지로도 저장할 수 있습니다.
할 수 있는 일
모양과 색 조정
파도의 높이, 개수, 위치와 채우기 방향을 조정하고 단색 또는 두 색으로 만들 수 있습니다.
용도에 맞게 받기
SVG 코드나 CSS 배경을 복사하고 저장하거나 PNG 이미지로도 저장할 수 있습니다.
사용 방법
모양의 출발점 정하기
값을 그대로 조정하거나 “서식 선택”에서 비슷한 모양을 고릅니다.
크기와 색 조정
너비, 높이, 진폭, 파도 개수를 지정합니다. 시작 위치와 중심 높이는 고급 설정에서 조정할 수 있습니다.
SVG 생성 및 확인
생성한 파도의 모양과 투명 부분을 확인합니다. 설정을 바꾸면 다시 생성합니다.
필요한 형식으로 받기
SVG나 CSS 배경을 선택해 복사하거나 저장하고, PNG를 저장합니다.
이럴 때 유용합니다
페이지 구획 나누기
콘텐츠 사이나 푸터 위 등에 파도 모양의 구분을 만듭니다.
사이트 색에 맞추기
단색이나 그라데이션을 사용해 페이지 배색에 맞는 배경 소재를 만듭니다.
파도의 모양과 저장 형식
진폭과 파도 개수
진폭은 위아래로 변화하는 크기이고, 파도 개수는 전체 너비에 들어가는 횟수입니다. 음성 파형을 표시하는 기능이 아닙니다.
파도의 위치와 잘리는 범위
시작 위치는 위상으로, 위아래 위치는 중심 높이로 바꿉니다. 이미지 밖으로 나간 부분은 잘립니다.
SVG와 PNG의 구분 사용
SVG는 모양을 벡터로 표현합니다. PNG는 지정한 픽셀 크기의 이미지로 저장하며 투명 부분도 유지합니다.
CSS 배경을 배치하려면
CSS는 배경 이미지를 지정하는 것입니다. 사용할 요소의 너비와 높이는 붙여넣는 곳에서 지정해 배경이 표시될 영역을 확보하세요.
자주 묻는 질문
파도의 모양과 색을 조정할 수 있나요?
값과 색을 지정할 수 있습니다. “두 색 사용”을 선택하면 두 번째 색과 그라데이션 각도를 설정할 수 있습니다.
서식을 선택하면 현재 설정은 어떻게 되나요?
너비, 높이, 색을 포함한 설정이 서식의 설정으로 대체됩니다. 필요한 값은 선택한 뒤에 조정하세요.
설정을 바꾸면 미리보기도 바뀌나요?
변경한 뒤에는 “SVG 생성”을 눌러 확인합니다. 이전 생성 결과는 표시와 저장 대상에서 제외됩니다.
SVG는 정확한 정현파인가요?
부드러운 3차 곡선으로 근사한 파형입니다. 수학적 측정이나 음성 분석용 파형이 아닙니다.
파일 처리
- 입력
- 파도의 수치 설정과 색으로 만듭니다. 이미지를 선택할 필요가 없습니다.
- 출력
- wave.svg, wave.css, wave.png. SVG와 CSS는 복사도 할 수 있습니다.