slides-grab 소개
slides-grab은 AI 코딩 에이전트가 만든 슬라이드를 화면에서 직접 영역으로 골라 수정하기 위해 만들어진 슬라이드 제작 도구입니다. 슬라이드 한 장 한 장을 HTML과 CSS 파일로 다루기 때문에, Claude Code나 Codex 같은 코딩 에이전트가 코드를 읽고 고치듯이 슬라이드의 내용과 디자인을 바꿀 수 있습니다. 발표 자료를 PowerPoint 편집기에서 손으로 옮기는 대신, 텍스트 파일을 다루는 에이전트의 강점을 그대로 프레젠테이션 제작에 가져온 셈입니다.
AI로 슬라이드 HTML을 생성하는 도구는 이미 여럿 있지만, slides-grab이 메우려는 빈틈은 "바꾸고 싶은 부분을 눈으로 지목해서 그 자리에서 고치는" 작업 흐름입니다. 슬라이드를 띄운 브라우저 편집기에서 마우스로 영역을 드래그해 선택한 뒤 에이전트에게 수정을 요청하면, 에이전트가 해당 영역에 대응하는 HTML을 다시 작성합니다. 글자, 크기, 굵기 같은 단순한 변경은 편집기에서 직접 손볼 수도 있습니다.
slides-grab은 Builder Josh가 만든 ppt_team_agent 를 기반으로 발전시킨 프로젝트입니다. 슬라이드를 표준 HTML/CSS로 저장하므로 결과물을 PDF나 이미지로 내보낼 수 있고, 실험적인 단계의 PPTX와 Figma 가져오기 흐름도 제공합니다. 본 게시물에서는 slides-grab의 제작 흐름과 비주얼 편집기, 디자인 스타일, 설치와 사용법을 정리합니다.
slides-grab의 슬라이드 제작 흐름
slides-grab은 슬라이드를 만들고 다듬는 과정을 네 단계로 나눕니다. 각 단계는 코딩 에이전트가 수행하거나 사용자가 명령으로 직접 실행합니다.
-
계획(Plan): 에이전트가 주제나 입력 파일을 바탕으로 슬라이드 개요를 구조화합니다.
-
디자인(Design): 각 슬라이드를 독립적인 HTML 파일(
slide-XX.html)로 생성합니다. -
편집(Edit): 브라우저 기반 편집기에서 영역을 드래그로 선택(bbox)하고, 직접 텍스트를 고치거나 에이전트에게 재작성을 맡깁니다.
-
내보내기(Export): 한 번의 명령으로 PDF로 변환하며, 실험적인 PPTX나 Figma 가져오기 흐름도 사용할 수 있습니다.
슬라이드를 HTML 파일로 다룬다는 점이 이 흐름의 핵심입니다. 에이전트는 익숙한 HTML/CSS를 읽고 수정하면 되고, 사람은 그 결과를 브라우저에서 바로 확인하면서 고칠 부분을 영역으로 지정할 수 있습니다.
slides-grab의 비주얼 편집기
slides-grab edit 명령은 슬라이드를 띄우는 브라우저 기반 편집기를 실행합니다. 여기서 영역을 드래그로 선택해 에이전트에게 수정을 요청하는 것이 slides-grab의 중심 기능입니다. 아래 데모는 슬라이드의 한 영역을 골라 편집하는 과정을 보여줍니다.

편집기는 순수 자바스크립트 파일로 구성되어 있어, 새로운 코딩 에이전트를 추가하거나 디자인을 바꾸는 식으로 기능을 직접 확장하기 쉽습니다. 슬라이드 워크스페이스가 준비된 상태에서 edit, build-viewer, validate, convert, pdf 같은 명령을 사용할 수 있고, 갓 클론한 상태에서도 --help, list-templates, list-styles, preview-styles 같은 탐색용 명령은 슬라이드 없이 동작합니다.
slides-grab의 디자인 스타일과 이미지 생성
slides-grab은 35종의 디자인 스타일을 기본 제공합니다. 이 중 30종은 corazzon/pptx-design-styles 에서 가져온 것이고, 나머지 5종은 slides-grab의 자체 스타일입니다. slides-grab list-styles 로 카탈로그를 살펴보거나 slides-grab preview-styles 로 브라우저에서 시각적으로 미리 볼 수 있으며, 에이전트에게 원하는 스타일을 알려주거나 완전히 새로운 디자인을 요청할 수도 있습니다.
슬라이드에 들어갈 이미지는 기본 제공자인 god-tibo-imagen 으로 생성합니다. 이 제공자는 로컬 Codex의 ChatGPT 로그인(~/.codex/auth.json)을 재사용하므로 별도의 OpenAI/Google API 키 없이 사용할 수 있지만, 이미지 생성 권한이 있는 ChatGPT 계정의 Codex CLI 로그인이 필요합니다. 저자는 god-tibo-imagen이 "공식적으로 지원되지 않는 비공개 Codex 백엔드를 호출하므로 예고 없이 동작이 멈출 수 있다" 고 경고하고 있습니다. 기본 제공자 호출이 실패하면 credentials가 있는 대체 제공자(--provider codex 의 OpenAI gpt-image-2, --provider nano-banana 의 Google Gemini)로 자동 전환합니다.
내보내기 단계도 폭이 넓습니다. slides-grab pdf 는 슬라이드를 래스터화해 PDF로 담는 capture 모드가 기본이며, 검색 가능한 텍스트가 필요하면 --mode print 를 사용합니다. slides-grab png 는 슬라이드마다 PNG를 렌더링하고, --slide-mode card-news 를 주면 인스타그램용 1:1 정사각형 카드 뉴스로 만들 수 있습니다. 저장되는 슬라이드는 원격 http(s):// 이미지 URL 대신 /assets/ 에 둔 로컬 파일을 ./assets/ 로 참조하도록 정해져 있어, 내보낸 결과물이 외부 호스팅에 의존하지 않습니다.
slides-grab 설치 및 사용법
slides-grab은 Node.js 20 이상이 필요합니다. 일반적인 사용에는 npm 패키지 설치만으로 충분하며, slides-grab 자체를 수정하거나 기여할 때만 저장소를 클론하면 됩니다.
npm install slides-grab
npx playwright install chromium
npx skills add ./node_modules/slides-grab -g -a codex -a claude-code --yes --copy
코딩 에이전트에서 바로 시작하려면 설치 안내 문서를 읽도록 지시하는 방법도 있습니다. 예를 들어 Claude Code에서는 다음 문장을 붙여 넣습니다.
Read https://raw.githubusercontent.com/NomaDamas/slides-grab/main/docs/installation/claude.md and follow every step.
여러 개의 덱을 다룰 때는 --slides-dir 로 작업 디렉토리를 지정합니다. 아래는 하나의 덱을 편집하고 검증한 뒤 PDF와 PNG로 내보내는 예시입니다.
slides-grab edit --slides-dir decks/my-deck
slides-grab validate --slides-dir decks/my-deck
slides-grab pdf --slides-dir decks/my-deck --output decks/my-deck.pdf
slides-grab png --slides-dir decks/my-deck --output-dir decks/my-deck/out-png
저자는 slides-grab convert(PPTX) 와 slides-grab figma 출력이 현재 experimental / unstable 단계라고 명시하고 있으므로, PowerPoint나 Figma에서 레이아웃이 어긋나거나 수동 정리가 필요할 수 있다는 점을 감안하는 편이 좋습니다. 내보내기 전 slides-grab validate 로 누락된 로컬 에셋과 권장되지 않는 경로 형식을 미리 점검할 수 있습니다.
slides-grab의 라이선스
slides-grab은 MIT 라이선스로 공개되어 있어 개인 및 상업적 목적으로 자유롭게 사용할 수 있습니다.
slides-grab 쇼케이스 갤러리
slides-grab 프로젝트 GitHub 저장소
더 읽어보기
-
Presenton: Gamma, Decktopus 등을 대체하는 것을 목표로 하는 오픈소스 AI 프레젠테이션 생성기
-
Nano-PDF: Gemini 3 Pro Image 기반 자연어 PDF 슬라이드 편집 도구 (feat. Nano Banana)
이 글은 GPT 모델로 정리한 글을 바탕으로 한 것으로, 원문의 내용 또는 의도와 다르게 정리된 내용이 있을 수 있습니다. 관심있는 내용이시라면 원문도 함께 참고해주세요! 읽으시면서 어색하거나 잘못된 내용을 발견하시면 덧글로 알려주시기를 부탁드립니다. ![]()
파이토치 한국 사용자 모임
이 정리한 이 글이 유용하셨나요? 회원으로 가입하시면 주요 글들을 이메일
로 보내드립니다! (기본은 Weekly지만 Daily로 변경도 가능합니다.)
아래
쪽에 좋아요
를 눌러주시면 새로운 소식들을 정리하고 공유하는데 힘이 됩니다~ ![]()

