NomaDamas/slides-grab

Best harness + editor + linter for generating slides in Claude Code / Codex - Claude Design Open Source Alternative

slides-grab 는 AI 에이전트의 지원을 받아 HTML 슬라이드를 생성하고 편집할 수 있는 명령줄 도구입니다. 시각적 에디터, PDF/PNG/PPTX로 내보내기, 디자인 템플릿 포함, AI를 통한 이미지 생성 기능을 제공합니다. Claude나 Codex와 같은 코드 에이전트와 함께 사용하도록 설계되어, 프레젠테이션 워크플로우에서 AI를 실용적으로 활용할 수 있도록 합니다.

기능:

  • 간단한 개요에서 각 슬라이드가 자체 포함된 HTML 파일인 슬라이드 데크를 생성합니다.
  • slides-grab edit 명령어로 시각적 에디터를 제공하며, 요소를 클릭하고 드래그하여 선택하고 AI에게 스타일을 재설정하거나 다시 작성하도록 요청할 수 있습니다.
  • PDF, PNG 이미지, 또는 파워포인트(PPTX)로 내보내기 가능 — PPTX 내보내기는 실험적입니다.
  • 95개의 디자인 스타일과 템플릿 라이브러리가 있으며, 기존 데크를 스타일 참조로 가져올 수 있습니다.
  • AI를 사용해 슬라이드용 이미지를 생성할 수 있습니다 (기본적으로 Codex 로그인 정보를 재사용, 별도의 API 키 필요 없음) 또는 OpenAI/Google 제공자 경유로 생성 가능합니다.
  • 인스타그램용 정사각형 1:1 '카드 뉴스' 슬라이드와 같은 특수 워크플로우를 지원하며, tldraw 다이어그램을 SVG 자산으로 렌더링할 수 있습니다.

작동 방식:

  • --slides-dir 옵션을 사용해 slides-grab edit 또는 slides-grab pdf 명령어를 실행합니다.
  • 도구는 HTML 슬라이드 파일을 읽고 쓰며, Playwright(브라우저 자동화 라이브러리)를 사용해 렌더링 및 내보내기를 수행합니다.
  • AI 이미지 생성 시, 기존 Codex 로그인 정보를 재사용하는 내부 서비스(codex-imagen)를 호출합니다 — 별도의 API 키가 필요 없습니다.
  • npm 패키지로 배포되며, Claude나 Codex가 워크플로우를 직접 이해할 수 있도록 하는 "에이전트 기술"도 포함되어 있습니다.

왜 유용한가:

  • AI 에이전트와 시각적 디자인 사이의 갭을 메웁니다: 특정 요소를 가리키고 "이 부분을 바꿔줘"라고 요청하면 에이전트가 직접 HTML을 수정할 수 있습니다.
  • 모든 것이 일반적인 HTML/CSS이므로, 필요 시 수동으로 버전 관리나 편집이 가능합니다.
  • 렌더링, 내보내기, 이미지 생성과 같은 번거로운 작업을 자동화해 콘텐츠 중심 작업에 집중할 수 있습니다.

참고: PPTX 및 Figma 내보내기 경로는 실험적/불안정으로 표시되어 있습니다 — 레이아웃 이동이나 수동 정리가 필요할 수 있습니다. 프로젝트는 MIT 라이선스이며, 이전 도구인 ppt_team_agent를 기반으로 개발되었습니다.

자세한 내용은 README 를 참조하세요.

관련

  • 프로젝트
  • 프로젝트
  • 프로젝트
  • 프로젝트
  • 프로젝트