콘텐츠로 건너뛰기

🖼 OGP 이미지 생성기

제목, 부제, 저자, 배경 프리셋을 선택하여 1200x630 OGP 이미지를 생성. 색과 글꼴 크기 조절 가능.

완전 무료 가입 불필요 브라우저 완결 5 개 언어 다크 모드

🔒 개인정보 보호

📖 자주 걸리는 지점

제목 · 부제 · 저자명과 배경 프리셋에서 1200×630 의 OGP 이미지를 만들어 PNG 로 내려받습니다. 처리는 브라우저 안에서 끝납니다. 만든 이미지를 두기만 해서는 아무 일도 일어나지 않습니다 — HTML 의 <head>og:image절대 URL 로 지정해야 비로소 쓰입니다. 설정되었는지는 OGP 검증에서 확인하세요.

사례 무슨 일이 일어나는가 어떻게 하면 되는가
글자가 틀에서 잘린다 1200×630 으로 만든 이미지는 플랫폼에 따라 잘립니다. X 의 큰 카드는 대체로 2:1, 슬랙이나 디스코드의 미리보기는 세로가 더 줄고, 모바일에서는 더 작게 표시됩니다. 가장자리에 붙인 글자나 이미지 네 귀퉁이에 둔 로고는 어딘가에서 반드시 잘립니다. 상하좌우에 각각 100px 정도의 여백을 두고 요소는 중앙 1000×430 범위에 담으세요. 제목은 2행까지, 폰트 크기는 60px 이상을 기준으로 합니다. 스마트폰 타임라인에서 손가락으로 짚었을 때의 크기를 상상해 보세요 — 그 크기에서 읽히지 않는 글자는 실을 의미가 없습니다. 장식보다 한 줄 제목이 확실히 읽히는 편이 효과적입니다.
모든 페이지에서 같은 이미지를 쓰고 있다 사이트 공통의 한 장을 돌려쓰면 어느 기사를 공유해도 같은 그림이 나옵니다. 타임라인에 늘어섰을 때 내용의 차이가 전해지지 않아 클릭률이 떨어집니다. 로고만 있는 이미지는 이 사이트의 어떤 기사 이상의 정보를 갖지 않습니다. 공유받은 쪽에서 보면 무슨 기사인지는 본문 텍스트로만 알 수 있습니다. 적어도 제목을 구워 넣은 이미지를 페이지마다 준비하세요. 기사 수가 많다면 수작업은 이어지지 않으므로 빌드 시에 자동 생성하는 것이 현실적입니다(Next.js 의 ImageResponse, Satori, Playwright 로의 스크린샷 등). 이 화면은 그 구조를 넣기 전의 수십 페이지나 단발 공지 페이지에 어울립니다.
갱신했는데 옛 이미지가 계속 나온다 SNS 는 한 번 가져온 OGP 를 며칠에서 몇 주 캐시합니다. 같은 URL 그대로 이미지만 교체해도 캐시가 끊길 때까지 옛 그림이 계속 나옵니다. 쿼리 문자열(?v=2)을 더하는 방법은 무시하는 플랫폼이 있어 확실하지 않습니다. 파일명째 바꾸세요ogp-v2.png 처럼 새 URL 로 하면 캐시와 무관하게 새 이미지가 취득됩니다. 이미 공유된 게시물을 고치고 싶다면 Facebook 공유 디버거, X 의 Card Validator, LinkedIn 의 Post Inspector 로 재취득을 유도하면 그 플랫폼에서는 반영됩니다. 다만 과거의 게시물 전부가 갱신된다고는 할 수 없습니다.

OGP 이미지는 검색 순위에는 영향을 주지 않습니다. 효과가 있는 것은 SNS 에서 공유되었을 때의 클릭률과 슬랙이나 디스코드에 붙였을 때의 보이는 방식입니다. 뒤집어 말하면 공유될 일이 거의 없는 관리 화면이나 약관 페이지에 공들인 이미지를 준비해도 비용 대비 효과가 없습니다. 우선해야 할 것은 실제로 공유되는 기사와 랜딩 페이지입니다. 파일 형식은 JPEG 나 PNG 로 하세요 — SVG 와 WebP 는 아직 대응하지 않은 플랫폼이 남아 있습니다. 용량은 5MB 미만, 가능하면 300KB 정도로 담으면 미리보기 생성이 빨라집니다.

📖 사용법

  1. 1
    텍스트 입력
    제목, 부제, 저자, 이모지 입력.
  2. 2
    스타일 선택
    배경, 색, 크기 선택. 즉시 미리보기.
  3. 3
    다운로드
    1200x630 PNG 또는 JPEG로 저장.

❓ 자주 묻는 질문

상업적 이용 가능?
예. 자유롭게 사용 가능.
한글 · 이모지 정상 표시?
시스템 글꼴 사용.
왜 1200x630?
FB / Twitter 권장 1.91:1.
🐛 이 도구에서 문제가 발생했나요?

무료 · 가입 불필요. 재현 절차만이라도 도움이 됩니다. 보고는 운영자에게 직접 전달되어 개선에 사용됩니다.

※ 재현을 위해 브라우저 정보 (UA / 화면 / 언어 / URL) 가 자동 전송됩니다