이미지 내러티브 덱
+7- 무료PPT146설치 146회1+7
- Claude Code
Codex
Cursor
HTML 프레젠테이션 스타일
필터 탭: 전체 · 피치 & 비즈니스 · 연구 & 교육 · 브랜드 & 크리에이티브
HTML 슬라이드를 쓰는 이유
스크린샷이 아닌 진짜 HTML
어떤 크기에서도 선명하고, 에이전트가 편집하기 쉽습니다.
PPT 스튜디오에서 편집
클릭해서 다시 쓰고, 옮기고, 순서를 바꾸세요.
PowerPoint로 내보내기
파일이 필요할 때는 편집 가능한 PPTX로.
HTML 프레젠테이션 vs PPT 파일
| Aspect | HTML 프레젠테이션 | PPTX 파일 |
|---|---|---|
| 여는 프로그램 | 모든 브라우저 | PowerPoint, Keynote |
| 에이전트가 직접 편집 | 예 | 아니요 |
| CSS 모션과 웹 폰트 완전 지원 | 예 | 아니요 |
| 링크로 공유 | 예 | 아니요 |
AI 에이전트로 HTML 슬라이드 만드는 방법
스타일 선택부터 프레젠테이션까지 세 단계.
1단계HTML 슬라이드 스타일 고르기
프레젠테이션 스타일을 고르고, 설치 전에 실제 슬라이드를 미리 보세요.
발표에 맞는 스타일을 고르세요. 그림 중심의 연구 프레젠테이션, 런칭을 위한 과감한 에디토리얼 프레젠테이션, 클라이언트 업데이트를 위한 차분한 컨설팅 스토리라인 등이 있습니다. 각 Skill 페이지에 실제 슬라이드가 나와 있어 설치 전에 결과를 볼 수 있습니다.
슬라이드 Skills 둘러보기
2단계Skill을 설치하고 발표를 설명하기
설치 프롬프트를 Claude Code나 Codex에 붙여 넣은 뒤 주제, 청중, 슬라이드 수를 알려 주세요.
Read https://skillry.dev/skills/<slug>/install.md and follow the instructions to install the skill.Claude Code, Codex 또는 다른 에이전트에 Skill을 설치한 뒤, 주제, 대상, 슬라이드 수, 참고할 파일을 알려 주세요. 에이전트가 선택한 스타일로 프레젠테이션을 HTML로 작성합니다.
3단계HTML 슬라이드로 발표하거나 PPTX로 내보내기
브라우저에서 전체 화면으로 발표하거나, 편집 가능한 PPTX로 내보내세요.
PPT 스튜디오를 열어 텍스트를 다시 쓰고, 블록을 옮기고, 슬라이드 순서를 바꾸세요. 브라우저에서 전체 화면으로 발표하거나, PowerPoint 파일이 필요한 사람이 있으면 편집 가능한 PPTX로 내보내세요. 관련
Codex Skills
HTML 슬라이드란 무엇인가요?
HTML 프레젠테이션 vs PowerPoint 파일
HTML 프레젠테이션은 한 번에 슬라이드 한 장씩 보여 주는 웹페이지 묶음입니다. 어떤 브라우저에서든 열리고, 어떤 화면에서도 선명하게 확대·축소되며, 웹 폰트, CSS 레이아웃, 모션을 지원합니다. 슬라이드가 코드이므로 AI 에이전트가 다른 파일을 편집하듯 쉽게 작성하고, 스타일을 바꾸고, 업데이트할 수 있습니다. 그래서 에이전트가 만드는 프레젠테이션에는 바이너리 PowerPoint 파일보다 HTML 슬라이드가 더 잘 맞습니다.
HTML을 PPTX로: 슬라이드 내보내기
하나의 형식만 고를 필요는 없습니다. 화면을 직접 다룰 수 있을 때는 브라우저에서 HTML 버전으로 발표하고, 클라이언트, 컨퍼런스, 동료가 PowerPoint 파일을 원할 때는 PPT 스튜디오에서 편집 가능한 PPTX로 내보내세요.
HTML 슬라이드 프레임워크 vs AI Skills
Slidev, reveal.js, Marp는 슬라이드를 코드로 작성하는 인기 오픈소스 도구입니다. Slidev는 Vue 컴포넌트와 개발자 친화적인 편집기로 Markdown을 슬라이드로 바꾸고, reveal.js는 HTML, CSS, JavaScript로 만드는 HTML 프레젠테이션 프레임워크이며, Marp는 일반 Markdown을 슬라이드로 변환해 PDF, PPTX, HTML로 내보낼 수 있습니다. 모든 것을 직접 제어할 수 있지만, 슬라이드 하나하나를 여전히 직접 디자인해야 합니다. HTML 슬라이드 Skill은 한 단계 위에 있습니다. 에이전트가 브리프를 바탕으로 완성된 디자인의 프레젠테이션을 작성하고, PPT 스튜디오에서 편집해 편집 가능한 PPTX로 내보냅니다. 발표를 손수 만들고 싶다면 프레임워크를, 디자인된 프레젠테이션이 빨리 필요하다면 Skill을 쓰세요.
| 도구 | 정체 | 라이선스 |
|---|---|---|
| Slidev | Markdown + Vue 슬라이드 프레임워크 | MIT |
| reveal.js | HTML 프레젠테이션 프레임워크 | MIT |
| Marp | Markdown 슬라이드 생태계 | MIT |
| HTML 슬라이드 Skill | 에이전트가 작성하는 디자인된 프레젠테이션, PPTX 내보내기 지원 | Skillry 라이선스 |
HTML 슬라이드 FAQ
HTML 슬라이드란 무엇인가요?
HTML 슬라이드는 웹페이지로 만든 프레젠테이션입니다. 각 슬라이드를 HTML과 CSS로 배치하고 브라우저에서 전체 화면으로 보여 주므로 웹 폰트, 반응형 레이아웃, CSS 모션을 쓸 수 있습니다. 일반 파일이므로 AI 에이전트가 직접 작성하고 편집할 수 있습니다.
HTML 슬라이드를 PPT로 바꿀 수 있나요?
네. Skillry 슬라이드 Skill에는 편집 가능한 PPTX로 내보내는 PPT 스튜디오가 포함되어 있어, PowerPoint로 발표하는 동료가 프레젠테이션을 계속 작업할 수 있습니다. 텍스트는 편집 가능한 상태로, 이미지는 별도 개체로 유지됩니다.
HTML 프레젠테이션은 오프라인에서도 작동하나요?
프레젠테이션 파일이 프로젝트에 있으면 인터넷 연결 없이 브라우저에서 로컬로 열 수 있습니다. 스타일이 CDN에서 웹 폰트를 불러온다면, 완전한 오프라인 사용을 위해 폰트 사본을 로컬에 포함하세요.
어떤 에이전트로 HTML 슬라이드를 만들 수 있나요?
Claude Code, Codex, Cursor, Antigravity, OpenCode, GitHub Copilot 등 SKILL.md 형식을 읽는 모든 에이전트입니다. 같은 HTML 슬라이드 Skill은 어느 에이전트에서든 같은 디자인을 만들어 냅니다.
HTML 프레젠테이션은 슬라이드를 몇 장까지 만들 수 있나요?
슬라이드 수는 요청할 때 정합니다. 몇 장을 요청하든 Skill이 표지, 섹션, 본문, 마무리 레이아웃을 일관되게 유지하며, 나중에 PPT 스튜디오에서 슬라이드를 추가하거나 삭제할 수 있습니다.
HTML 슬라이드 Skill에 이미지 API가 필요한가요?
Skill마다 다릅니다. 많은 슬라이드 Skill은 자체 이미지 라이브러리를 포함하고 기본으로 이를 재사용하며, 직접 가진 사진과 차트가 항상 우선이므로 이미지 API 없이도 덱을 완성할 수 있습니다. 주제에 맞는 새 이미지를 생성하려면 Codex의 GPT Image처럼 에이전트에 내장된 이미지 도구를 사용합니다. 내장 도구가 없는 에이전트에서는 fal을 지원하는 Skill에 본인의 FAL_KEY가 필요합니다. API 키가 필요한 Skill은 Skill 페이지에 표시됩니다.