CodeKitHub
생성기 도구

페이스북 스토리 생성기

마지막 업데이트:

페이스북 스토리 생성기 — 아바타 링, 타임스탬프, 배경 이미지 또는 그라데이션, 오버레이 텍스트, 답장 바까지 갖춘 실감 나는 세로형 페이스북 스토리 미리보기를 만들어 보세요. 모두 HTML Canvas API를 사용해 브라우저에서 로컬로 렌더링됩니다.

⚠️ 오락 및 디자인 목업 용도로만 사용하세요

이 도구는 오락, 밈, 프레젠테이션, UI/UX 프로토타입 및 소셜 콘텐츠 용도로만 사용되는 가상의 스크린샷을 생성합니다. 부정한 증거를 조작하거나, 누군가를 괴롭히거나 명예를 훼손하거나, 실제 인물의 실제 게시물이나 메시지를 사칭하는 용도로 절대 사용해서는 안 되며, 이는 관할 지역에 따라 불법일 수 있습니다. 모든 작업은 브라우저에서 로컬로 생성되며 서버에 업로드되지 않습니다.

이 도구는 무엇인가요?

페이스북 스토리 생성기는 실제 페이스북 스토리의 세로형 전체 화면 모습을 그대로 재현합니다 — 프로필 링, 이름과 타임스탬프가 있는 헤더, 배경 사진 또는 그라데이션, 굵은 오버레이 텍스트, 그리고 하단의 답장 바 띠까지요.

사기성 증거를 조작하거나, 누군가를 괴롭히거나 명예를 훼손하거나, 실제 인물의 실제 게시물이나 스토리를 사칭하는 데 사용해서는 절대 안 됩니다 — 관할 지역에 따라 불법일 수 있습니다.

모든 것은 HTML Canvas API를 사용해 브라우저에서 로컬로 생성되며, 서버에 업로드되는 것은 전혀 없습니다.

왜 사용해야 할까요?

  • 단체 채팅방에서 유행하는 스토리 형식 밈을 만드는 중이고, 어설프게 편집한 스크린샷이 아니라 하단 답장 바까지 포함해 진짜 스토리와 똑같은 화면이 필요할 때.
  • 스타트업 앱의 새 스토리 기능 콘셉트를 투자자에게 발표해야 하고, 실제로 기능을 개발하기 전에 전문적으로 보이는 세로형 목업이 필요할 때.
  • 소셜 미디어 강의 자료를 만들면서 학생이나 다른 사람의 개인 계정을 쓰지 않고 오버레이 텍스트와 그라데이션이 있는 스토리 스타일 예시를 보여주고 싶을 때.
  • 그래픽 디자인 포트폴리오에 스토리 UI 예시를 추가하면서, 디자인 툴에서 일일이 수동으로 재지 않고도 실제와 똑같은 9:16 비율이 필요할 때.
  • 캠페인 최종 디자인을 정하기 전에 배경 그라데이션과 오버레이 텍스트 조합을 여러 번 시도해보고 싶을 때 — 워터마크나 횟수 제한 없이 몇 번이든 다운로드할 수 있습니다.

사용 방법

  1. 이름, 타임스탬프, 아바타 색상을 설정하세요(또는 사진 업로드).
  2. 배경 그라데이션을 선택하거나 직접 이미지를 업로드하세요.
  3. 스토리 하단 근처에 표시될 오버레이 텍스트를 입력하세요.
  4. 세로형 미리보기가 실시간으로 업데이트되는 것을 확인한 뒤 "Download PNG"를 클릭해 이미지를 저장하세요.

예시

입력

이름: "Sam Whitfield" · 시간: "4h" · 배경: 파란색에서 분홍색 그라데이션 · 텍스트: "일요일 아침 커피 ☕"

결과

360×640 PNG 이미지로 실제 페이스북 스토리 스타일을 보여줍니다: 프로필 링이 있는 아바타, 이름과 타임스탬프, 화면을 꽉 채우는 그라데이션 배경, 중앙에 굵게 표시된 오버레이 텍스트, 하단에 하트 아이콘이 있는 답장 바 띠.

이미지는 실시간 미리보기 캔버스에서 즉시 렌더링되며 클릭 한 번으로 다운로드됩니다 — 대기 시간도, 서버 왕복도 없습니다.

사용자 지정 가능 항목

  • 프로필 이름, 타임스탬프, 아바타 색상 또는 사진.
  • 배경: 두 가지 색상의 그라데이션 또는 업로드한 이미지.
  • 스토리 하단 근처에 표시되는 굵은 오버레이 텍스트.
  • 실제 페이스북 스토리의 시각적 스타일과 일치하는 레이아웃 세부 요소.

책임감 있는 사용

이 생성기는 유머, 스토리텔링, 디자인 작업을 위해 명확히 허구인 목업 이미지를 쉽게 만들 수 있도록 존재합니다. 이 도구로 만든 이미지를 공유할 때는 실제 스토리가 아님을 알 수 있도록 맥락을 추가하는 것이 좋습니다.

스토리 vs. 댓글 스레드 vs. 프로필 — 어떤 목업을 언제 쓸까

페이스북에는 여러 콘텐츠 형식이 각기 다른 비주얼 스타일로 존재하며, 이 사이트는 정확도를 위해 형식마다 별도의 도구를 제공합니다.

형식방향실제 페이스북에서 유지되는 기간
스토리(이 도구)세로 9:16, 전체 화면24시간 후 자동 소멸
댓글 스레드넓은 세로 열, 매우 길어질 수 있음삭제 전까지 영구 유지
프로필 헤더가로로 넓고 아바타가 겹쳐짐영구 유지, 언제든 교체 가능

자주 묻는 질문

이 도구를 사용하는 것이 합법적이고 윤리적인가요?

도구 자체는 오락, 목업, 프레젠테이션, 디자인 작업에 사용하는 것이 합법입니다. 합법적이지도 윤리적이지도 않은 것은 생성된 이미지를 이용해 누군가를 속이는 것입니다. 명확히 허구이거나 예시 목적으로만 사용하세요.

이 도구가 제 콘텐츠를 어딘가에 업로드하나요?

아니요. 입력하거나 업로드한 모든 내용은 브라우저 메모리에 남아 JavaScript로 캔버스 요소에 직접 그려집니다. PNG는 기기에서 생성 및 다운로드되며 서버로 전송되는 것은 전혀 없습니다.

제 사진을 스토리 배경으로 업로드할 수 있나요?

네 — "Video background" 아래의 업로드 링크를 클릭하면 그라데이션 대신 직접 이미지를 화면 전체 스토리 배경으로 사용할 수 있습니다.

내보내는 이미지 크기는 어떻게 되나요?

내보낸 PNG는 360×640으로, 실제 페이스북 스토리가 사용하는 9:16 세로 비율과 일치합니다.

이 도구와 다른 페이스북 목업 생성기 중 무엇을 써야 하나요?

전체 화면 세로형 스토리를 목업하려면 이 스토리 생성기를 사용하세요. 댓글 스레드가 필요하면 페이스북 댓글 생성기를, 커버 사진과 소개글이 있는 프로필 페이지 전체가 필요하면 페이스북 프로필 생성기를 사용하세요.

하단 답장 바에 "메시지 보내기" 같은 사용자 지정 텍스트를 넣을 수 있나요?

답장 바는 실제 페이스북 스토리 화면을 모방한 고정 요소로 그려지므로 텍스트가 이미 정해져 있습니다. 덕분에 세세한 부분까지 직접 조정하지 않아도 결과물이 원본 스타일과 일관되게 유지됩니다.

오버레이 텍스트가 너무 길면 잘리나요?

오버레이 텍스트는 실제 페이스북이 긴 캡션을 처리하는 방식과 비슷하게, 표시 영역 안에서 자동으로 줄바꿈되도록 설계되어 있습니다. 가장 좋은 결과를 위해서는 일반적인 스토리 캡션처럼 문장을 짧게 유지하세요.

일관된 비주얼 스타일로 스토리 여러 장을 연속으로 만들 수 있나요?

가능합니다 — 같은 그라데이션 조합과 아바타 설정을 유지한 채 오버레이 텍스트만 바꾸고, 화면마다 새 PNG를 다운로드하면 됩니다. 다운로드 횟수 제한이 없어서 하나의 이야기처럼 이어지는 스토리 연작을 만들 수 있습니다.

아바타 링이 시청 여부 같은 상태에 따라 색이 바뀌나요?

아니요 — 이 도구의 아바타 링은 순전히 정적인 장식 요소이며, 실제 페이스북처럼 "확인함"이나 "확인 안 함" 상태를 시뮬레이션하지 않습니다. 이는 정지 이미지 목업의 범위를 벗어나는 기능이기 때문입니다.

관련 도구