플레이스홀더 이미지 생성기 (샘플 이미지 만들기)

너비, 높이, 배경색, 글자색을 지정하기만 하면 브라우저 안에서 샘플 이미지를 만들어 PNG로 다운로드할 수 있습니다. 이미지는 서버로 전송되지 않습니다.

자주 쓰는 샘플 이미지 크기

크기 주요 용도
300×200 작은 배너나 광고 영역용 플레이스홀더
800×600 블로그 글 삽입 이미지 또는 와이어프레임용 임시 이미지
1200×630 Facebook·X(트위터) 공유 카드용 OGP 이미지
1080×1080 Instagram 등 SNS의 정사각형 게시물
1920×1080 풀HD 히어로 이미지 또는 슬라이드쇼 배경
640×360 16:9 동영상 썸네일 또는 카드형 UI 썸네일

사용 팁

  • "1200×630 (OGP)" 프리셋을 사용하면 Facebook·X(트위터) 공유 카드에서 잘리지 않고 표시되는 표준 크기 이미지를 바로 준비할 수 있습니다.
  • 오버레이 텍스트를 비워두면 "너비×높이" 숫자가 자동으로 표시되어, 여러 와이어프레임을 비교할 때 크기를 한눈에 구분할 수 있습니다.
  • 배경색과 글자색은 색상 선택기로 고를 수도 있고 16진수 색상 코드를 직접 입력할 수도 있어, 디자인 시안의 배색에 정확히 맞출 수 있습니다.
  • 생성된 이미지는 로컬 기기에만 다운로드되며, 이 사이트의 서버로 전송되거나 저장되는 일은 전혀 없습니다.

자주 묻는 질문

웹사이트나 앱 디자인 시안·와이어프레임에서 아직 실제 사진이나 일러스트가 준비되지 않은 부분에 임시로 채워 넣는 "더미 이미지"로 사용됩니다. 실제 소재가 완성되기 전에 레이아웃 확인이나 코딩 작업을 진행할 수 있다는 장점이 있습니다.

아니요, 저장되지 않습니다. 이 도구는 요소를 사용해 브라우저 안에서만 이미지를 그리고 PNG로 변환하기 때문에, 이미지 데이터가 서버로 업로드되는 일은 전혀 없습니다. 다운로드 버튼을 누르면 사용 중인 기기에 직접 저장됩니다.

Facebook·X(트위터) 등 주요 SNS에서는 1200×630px(가로세로 비율 약 1.91:1)을 권장 크기로 제시하고 있습니다. 이보다 극단적으로 작으면 화질이 거칠어지고, 비율이 다르면 표시될 때 예상치 못한 위치에서 잘릴 수 있습니다.

이 도구에서는 1px~4000px 범위에서 지정할 수 있습니다. 브라우저의 요소는 브라우저마다 구현상의 상한이 있으므로, 수만 픽셀 크기 같은 극단적으로 큰 크기는 피하는 것이 좋습니다.
ツールくん

여담 ― 플레이스홀더 이미지라는 문화

웹 제작 현장에서는 정식 사진이나 일러스트가 준비되기 전까지 "임시 이미지"로 플레이스홀더 이미지를 사용하는 문화가 오래전부터 자리 잡고 있습니다. 인쇄 업계에서 아직 완성되지 않은 문구 대신 사용하는 "로렘 입숨(lorem ipsum)" 더미 텍스트와 같은 발상을, 이미지 버전으로 적용한 것이라 할 수 있습니다.

2014년에 등장한 "Lorem Picsum"이라는 서비스는 실제 사진을 무작위로 제공하는 플레이스홀더 이미지 서비스로 널리 사용되었습니다. URL에 너비와 높이만 지정하면 사진이 반환되는 간편함 덕분에 수많은 디자인 시안과 튜토리얼에서 채택되었습니다. 다만 외부 서비스에 의존하다 보니 오프라인 환경이나 기밀성이 높은 프로젝트에서는 사용하기 어렵다는 제약도 있습니다.

이 도구는 그러한 외부 서비스에 의존하지 않고, 브라우저의 만으로 단색 배경과 텍스트 라벨 이미지를 즉시 생성하는 방식을 택했습니다. 사진처럼 사실적이지는 않지만, 크기와 가로세로 비율 확인, SNS 공유 이미지의 레이아웃 테스트 등 "일단 올바른 크기의 이미지가 하나 필요하다"는 상황에는 충분한 역할을 합니다.