이미지 워터마크
이미지에 텍스트 워터마크를 추가합니다
이미지를 드래그하거나 클릭하여 업로드
📖 이미지 워터마크는 한글이 안 깨지는데 PDF 워터마크는 왜 깨지나 가이드 보기
이미지 워터마크 추가
이 도구는 Canvas 2D의 fillText 메서드로 이미지 위에 텍스트를 직접 그려 넣는 방식으로 동작합니다. 폰트로 'Noto Sans KR'을 지정하기 때문에 PDF 워터마크 도구와 달리 한글·한자·이모지까지 깨짐 없이 표시할 수 있습니다. 텍스트 배치는 9분할 그리드(좌상단~우하단)로 좌표와 정렬을 자동 계산하며, 회전 각도를 지정하면 translate 후 rotate 변환을 적용해 대각선 워터마크를 만듭니다. 사진 작가의 저작권 표시(©), 블로그·SNS에 게시하는 이미지의 출처 표기, 브랜드 로고 텍스트 삽입 등에 활용됩니다.
자주 묻는 질문
어떤 이미지 형식이 지원되나요?
브라우저의 Image 객체가 디코딩할 수 있는 모든 형식을 지원합니다. PNG, JPG, WebP 모두 문제없이 불러올 수 있습니다.
워터마크 위치를 설정할 수 있나요?
네. 3×3 그리드 버튼으로 9개 위치 중 하나를 클릭하면, 내부적으로 해당 위치의 좌표와 textAlign·textBaseline 값이 자동으로 계산되어 텍스트가 정확히 정렬됩니다.
투명도는 어떻게 설정하나요?
슬라이더로 0~100% 사이 값을 정하면 Canvas의 globalAlpha 속성에 그대로 반영되어, 값을 옮기는 즉시 미리보기가 갱신됩니다.
워터마크를 대각선으로 표시할 수 있나요?
네. 각도 입력란에 값을 넣으면 Canvas의 rotate() 변환이 텍스트 좌표계에 적용되어 원하는 각도로 기울어진 워터마크가 그려집니다. 음수 값을 입력하면 반대 방향으로 기울일 수도 있습니다.
파일이 서버로 전송되나요?
아니요. 이미지를 불러오고 텍스트를 그려 넣는 모든 과정이 Canvas API를 통해 브라우저 안에서 실행되므로 원본 파일이 외부로 전송되지 않습니다.
출력 형식은?
Canvas.toDataURL('image/png')로 PNG 파일이 생성됩니다. 다운로드 시에는 화면 미리보기(최대 660px)가 아니라 원본 해상도 그대로 다시 렌더링해 저장하므로 화질 손실이 없습니다.
한국어·이모지 워터마크도 가능한가요?
네. PDF 워터마크 도구가 사용하는 PDF 표준 내장 폰트와 달리, 이 도구는 브라우저에 로드된 'Noto Sans KR' 웹폰트로 텍스트를 그리기 때문에 한글, 한자, 이모지까지 깨짐 없이 표시됩니다.
이미지 워터마크(로고)는 지원하나요?
현재는 fillText 기반의 텍스트 워터마크만 지원합니다. 로고 이미지를 삽입하려면 drawImage로 별도의 이미지 레이어를 합성하는 기능이 필요한데, 이는 향후 개선 과제입니다.