노션 갤러리 커버 자동 생성 웹앱 - Notion Gallery Cover 사용법

노션 DB 커버가 제각각이신가요? 노션 갤러리 커버로 페이지 제목 기반 커버를 단색·그라데이션·패턴·이모지 스타일과 다양한 한글 폰트로 자동 생성하고, 데이터베이스 전체에 한 번에 일괄 적용하세요.

Jun 25, 2026

노션 갤러리 커버 자동 생성 웹앱 - Notion Gallery Cover 사용법

📌

노션 데이터베이스를 갤러리 보기로 쓰는데, 커버 이미지가 제각각이거나 비어 있어 지저분하신가요? 매번 이미지를 직접 만들어 한 장씩 올리고 계신가요?

Notion Gallery Cover를 사용하면 노션을 OAuth로 연결해, 페이지 제목을 기반으로 깔끔하고 일관된 커버 이미지를 자동 생성하고 데이터베이스 전체에 일괄 적용할 수 있습니다. 코드 없이 브라우저에서 디자인만 고르면 끝입니다.

이 글에서 배울 내용 ⏳ 읽기 3분

Notion Gallery Cover가 무엇인지
노션 연결 및 사용 방법
지원하는 커버 스타일·디자인 종류
생성한 커버를 데이터베이스에 일괄 적용하는 법
개인정보 처리 방침

Notion Gallery Cover란?

Notion Gallery Cover는 노션 데이터베이스의 각 페이지에 대해, 페이지 이름(제목)을 기반으로 통일감 있는 갤러리 커버 이미지를 자동 생성·적용해주는 웹앱입니다. OAuth로 워크스페이스를 한 번 연결하면, 데이터베이스를 고르고 디자인 프리셋만 선택해 전체 페이지에 커버를 일괄로 입힐 수 있습니다.

갤러리 보기 기반의 노션 데이터베이스를 이미지 편집 도구 없이도 정돈된 카드 형태로 만들 때 유용합니다. 수업 자료·실험 목록·학생 명렬표·콘텐츠 기획표처럼 페이지가 많은 데이터베이스를 한눈에 보기 좋게 정리할 수 있습니다.

💡

팁: 커버는 페이지 제목으로 실시간 생성되므로, 제목만 바꾸면 일관된 디자인의 새 커버가 그대로 따라옵니다.

노션 연결 및 사용 방법

1. 웹앱 접속

브라우저에서 Notion Gallery Cover 사이트(배포 도메인)에 접속합니다.

2. 노션 OAuth 인증

노션으로 연결하기 버튼을 누르면 OAuth 인증 창이 열립니다.
노션 계정으로 로그인하고, 커버를 적용할 데이터베이스에 대한 권한을 허용합니다.
인증 화면에서 직접 선택한 페이지·데이터베이스에만 권한이 부여됩니다.

💡

팁: 권한이 부족하면 헤더의 "데이터베이스 추가"로 다시 인증해 대상 데이터베이스를 확장할 수 있습니다.

3. 데이터베이스 선택

연결된 데이터베이스 중 커버를 적용할 대상을 고릅니다. 선택하면 해당 DB의 페이지 목록을 불러옵니다.

4. 디자인 구성

내장 프리셋(단색·그라데이션·패턴·이모지) 중 하나를 고르거나, 색상·이모지·패턴·정렬·크기를 조정해 직접 디자인합니다. 설정을 바꿀 때마다 실시간 미리보기로 커버가 갱신됩니다.

5. 커버 일괄 적용

디자인을 정하면 선택한 데이터베이스의 페이지들에 커버를 일괄 적용합니다. 각 페이지의 제목이 그대로 커버 텍스트로 들어가, 갤러리 보기가 통일된 카드 모음으로 정돈됩니다.

⚠️

주의: 노션은 커버 이미지 URL을 노션 서버가 직접 불러옵니다. 로컬(localhost)은 노션에서 닿을 수 없으므로, 실제 적용은 Vercel 배포 등 공개 URL 환경에서 해야 합니다.

지원하는 커버 스타일 및 기능

🎨 커버 스타일

페이지 제목을 텍스트로 넣고, 4가지 스타일로 커버를 생성합니다. (기본 크기 1500×600)

단색(solid): 배경색(bg) 한 가지로 깔끔하게
그라데이션(gradient): 두 색상(bg, bg2)과 각도(angle)로 입체감 부여
패턴(pattern): 도트·라인·그리드·웨이브·서클 등 배경 패턴 적용
이모지(emoji): 이모지 + 배경, 측면(side)/적층(stack) 레이아웃 선택

공통 옵션으로 글자색(fg), 정렬(좌측/중앙), 글자 크기, 가로·세로 크기를 조정할 수 있습니다.

✏️ 커스텀 디자인

"+ 새 디자인"으로 색상·이모지·패턴을 조정해 나만의 프리셋을 만들고 저장할 수 있습니다. 커스텀 디자인은 브라우저 localStorage에 저장됩니다(기기·브라우저별).

🔤 다양한 한글 폰트 선택

커버에 들어가는 제목 글꼴을 여러 한글 폰트 중에서 골라 적용할 수 있습니다. 강원교육모두체·강원교육새움체·강원교육튼튼체, 경기천년 바탕체·제목체, 그리운 요은또박·요은홀림, 노토 산스 KR 등 무료 한글 폰트를 지원하며, 선택한 폰트는 edge 런타임에서 임베드되어 깨짐 없이 선명하게 렌더링됩니다.

🧩 일관된 디자인 시스템

UI는 노션 스타일의 디자인 시스템을 따릅니다. 웜 뉴트럴 팔레트, 얇은 보더, 단일 액센트 컬러, Pretendard/Inter 타이포그래피로 노션 화면에 자연스럽게 어울립니다.

기술 스택

프론트엔드: Next.js + React
커버 생성: @vercel/og로 PNG 커버 이미지를 동적 생성 (/api/cover?name=...&style=...)
노션 연동: Notion 공식 API(OAuth, DB·페이지 조회, 커버 일괄 적용), httpOnly 쿠키 세션
배포: Vercel (환경 변수로 OAuth Client ID/Secret·Redirect URI 설정)

개인정보처리방침

최종 업데이트: 2026년 6월

Notion Gallery Cover(이하 "본 서비스")는 사용자의 개인정보를 중요하게 여깁니다. 본 방침은 본 서비스가 수집·사용·보관하는 정보를 설명합니다.

1. 수집하는 정보

Notion 액세스 토큰: OAuth 인증 후 발급된 토큰을 세션(httpOnly 쿠키)으로 보관하며, 사용자가 권한을 부여한 데이터베이스를 읽고 커버를 적용하는 데에만 사용합니다.
데이터베이스·페이지 정보: 커버를 적용할 데이터베이스 목록과 페이지 제목을 읽습니다.
커스텀 디자인 설정: 사용자가 만든 디자인 프리셋은 브라우저 localStorage에 저장됩니다.

2. 수집하지 않는 정보

사용자의 이름·이메일·연락처 등 개인 식별 정보를 별도로 수집하지 않습니다.
권한을 부여하지 않은 데이터베이스나 페이지에는 접근하지 않습니다.
광고 식별자나 마케팅용 추적 데이터를 수집하지 않습니다.

3. 정보의 사용

수집된 정보는 오직 다음 목적으로만 사용됩니다.

사용자가 선택한 노션 데이터베이스의 페이지에 커버 이미지를 생성·적용
커버 디자인 미리보기 및 저장

어떠한 정보도 제3자에게 판매·공유되지 않습니다.

4. OAuth 및 토큰 처리

노션 계정 연결 시 OAuth 인증 코드가 본 서비스 서버를 경유해 액세스 토큰으로 교환됩니다. 토큰은 세션 쿠키로 보관되며, 데이터베이스 조회·커버 적용 외의 용도로 사용되지 않습니다.

5. 데이터 삭제

노션 설정의 연결된 앱(통합) 목록에서 본 서비스의 권한을 해제하면 액세스가 즉시 중단됩니다. 브라우저에 저장된 커스텀 디자인은 localStorage를 비우면 삭제됩니다.

6. 문의

개인정보 처리에 관한 문의는 GitHub 리포지토리 이슈를 통해 연락해 주세요.

지금 바로 시작하기

Notion Gallery Cover는 노션 데이터베이스를 OAuth로 안전하게 연결해, 페이지 제목 기반의 일관된 갤러리 커버를 자동 생성·적용하는 웹앱입니다.
권한을 준 데이터베이스만 읽고 적용하며, 나머지 워크스페이스 콘텐츠에는 접근하지 않습니다.

이제 제각각인 커버를 하나씩 손보지 마세요. 아래 리포지토리에서 코드를 받아 배포하고, 데이터베이스를 연결해 통일된 커버를 입혀 보세요.

Notion Gallery Cover 바로가기: https://notion-gallery-cover.vercel.app/

📝 핵심 정리

노션 데이터베이스를 OAuth로 연결하면 페이지 제목 기반 커버를 자동 생성·일괄 적용할 수 있습니다.
단색·그라데이션·패턴·이모지 4가지 스타일과 커스텀 디자인을 지원합니다.
강원교육체·경기천년체·노토 산스 KR 등 다양한 한글 폰트를 골라 적용할 수 있습니다.
권한을 준 데이터베이스만 읽으며, 노션 서버가 직접 fetch하므로 공개 URL(예: Vercel) 배포가 필요합니다.

HWP/HWPX 문서 통합 스킬 - 한글 문서 자동화 에이전트 노션 데이터베이스 차트 웹앱 - Notion Charts 사용법

케미가 체질쌤