Qiaomu Bento Ppt
joeseesun/qiaomu-bento-ppt
Use the standalone qiaomu-bento-ppt skill to create or edit qiaomu-style bento presentations as self-contained .bento.html files from briefs, notes, reports, URLs, data, or existing bento decks.
Upgrade LLM outputs from plain text to structured, rendered formats like HTML, Marp slides, or interactive dashboards.
Install Karpathy Output Evolution
$ npx skills add LearnPrompt/andrej-karpathy-skills --skill karpathy-output-evolution -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install LearnPrompt/andrej-karpathy-skills karpathy-output-evolution --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/LearnPrompt/andrej-karpathy-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/karpathy-output-evolution .claude/skills/karpathy-output-evolution && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "karpathy-output-evolution" agent skill from https://github.com/LearnPrompt/andrej-karpathy-skills/tree/main/karpathy-output-evolution into .claude/skills/karpathy-output-evolution/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "karpathy-output-evolution", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/LearnPrompt/andrej-karpathy-skills/tree/main/karpathy-output-evolutionType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add LearnPrompt/andrej-karpathy-skills --skill karpathy-output-evolution -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install LearnPrompt/andrej-karpathy-skills karpathy-output-evolution --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/LearnPrompt/andrej-karpathy-skills.git skills-src && mkdir -p .agents/skills && cp -r skills-src/karpathy-output-evolution .agents/skills/karpathy-output-evolution && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "karpathy-output-evolution" agent skill from https://github.com/LearnPrompt/andrej-karpathy-skills/tree/main/karpathy-output-evolution into .agents/skills/karpathy-output-evolution/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "karpathy-output-evolution", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add LearnPrompt/andrej-karpathy-skills --skill karpathy-output-evolution -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install LearnPrompt/andrej-karpathy-skills karpathy-output-evolution --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/LearnPrompt/andrej-karpathy-skills.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/karpathy-output-evolution .cursor/skills/karpathy-output-evolution && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "karpathy-output-evolution" agent skill from https://github.com/LearnPrompt/andrej-karpathy-skills/tree/main/karpathy-output-evolution into .cursor/skills/karpathy-output-evolution/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "karpathy-output-evolution", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/LearnPrompt/andrej-karpathy-skills.git --path karpathy-output-evolution--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add LearnPrompt/andrej-karpathy-skills --skill karpathy-output-evolution -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install LearnPrompt/andrej-karpathy-skills karpathy-output-evolution --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/LearnPrompt/andrej-karpathy-skills.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/karpathy-output-evolution .gemini/skills/karpathy-output-evolution && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "karpathy-output-evolution" agent skill from https://github.com/LearnPrompt/andrej-karpathy-skills/tree/main/karpathy-output-evolution into .gemini/skills/karpathy-output-evolution/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "karpathy-output-evolution", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install LearnPrompt/andrej-karpathy-skills karpathy-output-evolutionInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add LearnPrompt/andrej-karpathy-skills --skill karpathy-output-evolution -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/LearnPrompt/andrej-karpathy-skills.git skills-src && mkdir -p .github/skills && cp -r skills-src/karpathy-output-evolution .github/skills/karpathy-output-evolution && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "karpathy-output-evolution" agent skill from https://github.com/LearnPrompt/andrej-karpathy-skills/tree/main/karpathy-output-evolution into .github/skills/karpathy-output-evolution/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "karpathy-output-evolution", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add LearnPrompt/andrej-karpathy-skills --skill karpathy-output-evolution -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install LearnPrompt/andrej-karpathy-skills karpathy-output-evolution --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/LearnPrompt/andrej-karpathy-skills.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/karpathy-output-evolution .opencode/skills/karpathy-output-evolution && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "karpathy-output-evolution" agent skill from https://github.com/LearnPrompt/andrej-karpathy-skills/tree/main/karpathy-output-evolution into .opencode/skills/karpathy-output-evolution/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "karpathy-output-evolution", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
karpathy-output-evolution- GitHub stars
- 110
- Token cost
- ~1.5k tokens
- SKILL.md length
- 211 words
- Files
- 1
- Skills in repo
- 15
- Repo updated
- First seen
- Licence
- MIT
At a glance
Upgrade LLM outputs from plain text to structured, rendered formats like HTML, Marp slides, or interactive dashboards.
- The user wants better-formatted output
- SKILL.md covers Core Principle, The Output Evolution Ladder, Prompt Templates by Output Type and The Universal Upgrade Prompt, plus 5 more sections
- Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
- Needs to convert notes into a presentation
What it does
Karpathy Output Evolution is an agent skill from LearnPrompt/andrej-karpathy-skills. Upgrade LLM outputs from plain text to structured, rendered formats like HTML, Marp slides, or interactive dashboards. Use this skill when the user wants better-formatted output, needs to convert notes into a presentation, wants HTML output from an LLM, needs slides from a document, or says "make this prettier", "render this", "output as HTML", "make slides from this", "structured output", "Marp", "better format". Based on Karpathy 19k-like HTML output post.
Its SKILL.md is about 1.5k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.
It sits in Documents & Office, covering Slides and decks and HTML artifacts. It works with Prettier. The repository describes itself as: Karpathy-inspired Agent Skills collection. The licence is MIT.
When your agent uses it
- The user wants better-formatted output
- Needs to convert notes into a presentation
- Wants HTML output from an LLM
- Needs slides from a document
Example prompts
- “make this prettier”
- “render this”
- “output as HTML”
- “/karpathy-output-evolution”
What it can do on your machine
Read from SKILL.md and the folder at commit 9e46dec. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md.
From the folder's file list and the shell code blocks in SKILL.md.
Network
Links to these hosts (documentation or services it may open):
x.com
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Context cost
Karpathy Output Evolution loads about 1.5k tokens when it runs. Until then it costs about 122 tokens; SKILL.md has 211 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check passed
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
SKILL.md
The full file from LearnPrompt/andrej-karpathy-skills at commit 9e46dec, republished under its MIT licence (© LearnPrompt). 211 words, ~1,501 tokens.
Download SKILL.mdSave it as
.claude/skills/karpathy-output-evolution/SKILL.md (or your agent's skills folder).- name
- karpathy-output-evolution
- description
- Upgrade LLM outputs from plain text to structured, rendered formats like HTML, Marp slides, or interactive dashboards. Use this skill when the user wants better-formatted output, needs to convert notes into a presentation, wants HTML output from an LLM, needs slides from a document, or says "make this prettier", "render this", "output as HTML", "make slides from this", "structured output", "Marp", "better format". Based on Karpathy 19k-like HTML output post.
- disable-model-invocation
- false
- user-invocable
- true
- related_skills
- karpathy-education-first, karpathy-llm-wiki, karpathy-autoresearch, karpathy-idea-files
Skill 7: Output Evolution（输出形式进化）
Source: https://x.com/karpathy/status/2053872850101285137 "HTML output + human-AI I/O evolution" — ~19k likes
Core Principle
Text is the lowest form of output. Demand structure.
Karpathy's progression: Text → Markdown → HTML → Interactive → (future) Neural
Every LLM output can be upgraded. A wall of text becomes a rendered document. A list becomes a sortable table. An explanation becomes a slide deck. The information is the same — but legibility and retention multiply.
The Output Evolution Ladder
Level 1: Plain text ← most common, least useful for complex info
Level 2: Markdown ← better, but not rendered in most contexts
Level 3: Self-contained HTML ← renders anywhere, no dependencies
Level 4: Interactive HTML ← sortable tables, collapsible sections, search
Level 5: Marp slides ← presentations, teaching, sharing
Level 6: Data viz ← charts, graphs, dashboardsDefault rule: Always request at least Level 3 for any output you'll reuse or share.
Prompt Templates by Output Type
HTML Document (Level 3)
[YOUR CONTENT REQUEST]
Output format: A single self-contained HTML file.
Requirements:
- All CSS inline or in a <style> block (no external dependencies)
- Clean, readable typography (use system fonts: -apple-system, sans-serif)
- Proper heading hierarchy (h1 → h2 → h3)
- Key terms in <strong>, code in <code> blocks
- A table of contents at the top if > 3 sections
- Light/readable color scheme (#f8f9fa background, #212529 text)
Start with <!DOCTYPE html> and end with </html>. Nothing else.Marp Slides (Level 5)
[YOUR CONTENT REQUEST]
Output format: Marp markdown slide deck.
Requirements:
- Start with: ---\nmarp: true\ntheme: default\npaginate: true\n---
- Separate each slide with ---
- Max 5 bullet points per slide
- One key concept per slide
- Speaker notes after each slide (<!-- note: ... -->)
- First slide: title + author + date
- Last slide: "Key Takeaways" + 3-5 bullets
Total slides: [N] (default: one per major concept)Interactive HTML Table (Level 4)
Convert this data to an interactive HTML table:
[DATA]
Requirements:
- Self-contained HTML (CSS + JS inline)
- Sortable columns (click header to sort)
- Search/filter box at top
- Alternating row colors
- Responsive (works on mobile)
- Export to CSV button (optional)
Include only standard browser APIs, no jQuery or external libraries.Research Summary as HTML Report (Level 3-4)
[YOUR RESEARCH TOPIC OR NOTES]
Output: A self-contained HTML research report.
Structure:
1. Executive Summary (3 sentences)
2. Key Findings (bulleted, with confidence levels: HIGH/MED/LOW)
3. Evidence (expandable sections, one per finding)
4. Open Questions
5. Sources (linked, with one-sentence descriptions)
Style: Clean academic report. Background #fff, readable font-size 16px, max-width 800px centered.Visual Comparison (Level 4)
Compare these [OPTIONS/APPROACHES/TOOLS]:
[LIST OF THINGS TO COMPARE]
[CRITERIA TO COMPARE ON]
Output: Self-contained HTML comparison page with:
- Side-by-side card layout (CSS grid)
- Color-coded ratings (green/yellow/red) for each criterion
- Summary recommendation at top
- No external CSS frameworksThe Universal Upgrade Prompt
Apply to ANY existing text output to instantly improve it:
Take this content and upgrade it to a self-contained HTML document.
Content:
[PASTE ANY TEXT OR MARKDOWN]
Upgrade rules:
1. Structure the content with proper heading hierarchy
2. Make lists visually distinct (styled bullets or numbered lists)
3. Put any code in syntax-highlighted <pre><code> blocks
4. Add a reading time estimate at the top
5. Make it look like a well-designed blog post
6. Keep the content identical — only change the format
Output: complete HTML file, nothing else.Output Format Selection Guide
| Use Case | Best Format | Command |
|---|---|---|
| Quick notes | Markdown | Default |
| Sharing with non-technical | HTML | "output as HTML" |
| Presentation | Marp | "make slides" |
| Data comparison | HTML table | "as comparison table" |
| Research summary | HTML report | "as research report" |
| Documentation | Markdown + ToC | "with table of contents" |
| Learning material | Marp + speaker notes | "as teaching slides" |
Always Add This to Important Prompts
Output as a self-contained HTML file. No external dependencies.
Clean design. Renders directly in a browser.Workflow
属于工作流：研究到发布（第3步）
| 位置 | 上游 | 下游 |
|---|---|---|
| 第3步（包装） | karpathy-llm-wiki（知识沉淀后） | karpathy-education-first（教学化输出） |
完整链路：autoresearch → llm-wiki → output-evolution → education-first
Prompt Contract
Take this content: <RAW_CONTENT>. Choose the best output format from: Markdown table / Marp slides / self-contained HTML / interactive dashboard / diagram. Justify your choice in one sentence. Then produce the complete rendered-ready artifact. Requirements: self-contained (no external deps), renders correctly, structured for scanning not linear reading.Verification Checklist
- 输出格式匹配使用场景（分享→HTML，演示→Marp，分析→Dashboard）
- 文件完全自包含（无外部 CDN/依赖）
- 可以直接在浏览器中打开并正确渲染
- 结构支持扫读（有标题、表格、分区），不是一坨文字
- 移动端也能基本可读
© LearnPrompt, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Files
Just SKILL.md in karpathy-output-evolution of LearnPrompt/andrej-karpathy-skills.
Open the folder on GitHubat commit 9e46dec
Compare with similar skills
Karpathy Output Evolution next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Karpathy Output Evolution this skillLearnPrompt/andrej-karpathy-skills | 110 | — | ~1.5k | Automated safety check: Pass | MIT | |
| Qiaomu Bento Pptjoeseesun/qiaomu-bento-ppt | 127 | — | ~1.3k | Automated safety check: Pass | MIT | |
| Ky Markdown RebuilderKyrieCheungYep/ky-markdown-rebuilder | 117 | — | ~5.7k | Automated safety check: Pass | None | |
| Ppt PageOWWZO/ai-agent | 188 | — | ~2.4k | Automated safety check: Pass | None | |
| PPT as CodeRussell-cell/PPT-as-code | 191 | — | ~11k | Automated safety check: Pass | MIT | |
| Bento Slidessammcj/agentic-coding | 162 | — | ~2.9k | Automated safety check: Pass | Apache-2.0 |
Similar skills
Ky Markdown Rebuilder
KyrieCheungYep/ky-markdown-rebuilder
Rebuild visual documents into reliable Markdown by combining text extraction with page or screenshot alignment.
Ppt Page
OWWZO/ai-agent
Create single-file HTML presentation galleries as a vertical, single-column feed of capped-width slide cards.
PPT as Code
Russell-cell/PPT-as-code
Plans and builds HTML-based web presentations through staged quick, basic or advanced workflows, with optional visualization planning, motion, a workbench and PPTX export handoff.
Bento Slides
sammcj/agentic-coding
A skill your agent uses when creating or editing Bento (.bento.html) slide decks, including any request for a single-file HTML slide deck.
Sci HTML
ShZhao27208/Aut_Sci_Write
Generate academic presentation-style HTML slide decks and browser reports from PDFs, structured text, Markdown, paper summaries, outlines, or research notes.
More from LearnPrompt/andrej-karpathy-skills
All 15 skills in this repoKarpathy Methodology Index
LearnPrompt/andrej-karpathy-skills
Apply Andrej Karpathy AI methodology and principles from his 2023-2026 insights. Use this skill when the user wants to apply Karpathy-style thinking, needs…
Karpathy Agentic Engineering
LearnPrompt/andrej-karpathy-skills
Apply Karpathy-style agentic engineering to any coding or building task.
AutoResearch Loop
LearnPrompt/andrej-karpathy-skills
Sets up an autonomous research loop where an agent runs experiments on git branches, logs results and proposes the next iteration while you approve each hypothesis change.
Karpathy Education First
LearnPrompt/andrej-karpathy-skills
Apply the education-first mindset — make everything you build teachable, create nano-project explanations, write for beginners.
Karpathy Idea Files
LearnPrompt/andrej-karpathy-skills
Create and share ideas as abstract Gist-style specs instead of code — letting agents or others implement.
Karpathy LLM Simulator
LearnPrompt/andrej-karpathy-skills
Use LLM as a simulator of expert debates and opposing viewpoints instead of getting a single sycophantic answer.
Related
Works with
Categories
Questions about Karpathy Output Evolution
What does Karpathy Output Evolution do?
Upgrade LLM outputs from plain text to structured, rendered formats like HTML, Marp slides, or interactive dashboards. Karpathy Output Evolution is an agent skill from LearnPrompt/andrej-karpathy-skills. Upgrade LLM outputs from plain text to structured, rendered formats like HTML, Marp slides, or interactive dashboards.
When should I use Karpathy Output Evolution?
Karpathy Output Evolution fits situations like: the user wants better-formatted output; needs to convert notes into a presentation; wants HTML output from an LLM; needs slides from a document.
How do I install Karpathy Output Evolution in Claude Code?
Run `npx skills add LearnPrompt/andrej-karpathy-skills --skill karpathy-output-evolution -a claude-code`. Or copy the skill folder (karpathy-output-evolution in LearnPrompt/andrej-karpathy-skills) into .claude/skills/karpathy-output-evolution in your project. Claude Code loads it when a task matches its description.
How do I install Karpathy Output Evolution in Codex?
Run `npx skills add LearnPrompt/andrej-karpathy-skills --skill karpathy-output-evolution -a codex`. Or copy the skill folder (karpathy-output-evolution in LearnPrompt/andrej-karpathy-skills) into .agents/skills/karpathy-output-evolution in your project. Codex loads it when a task matches its description.
Can I use Karpathy Output Evolution in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add LearnPrompt/andrej-karpathy-skills --skill karpathy-output-evolution -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/karpathy-output-evolution, .gemini/skills/karpathy-output-evolution, .github/skills/karpathy-output-evolution and .opencode/skills/karpathy-output-evolution in your project.
What does Karpathy Output Evolution need to run?
SKILL.md names no scripts, command-line tools or credentials: Karpathy Output Evolution is instructions for the agent only.
Does Karpathy Output Evolution access the network?
SKILL.md names 1 domain. As links in the text: x.com. This is read from the text; nothing was executed.
Is Karpathy Output Evolution safe to install?
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
What licence does Karpathy Output Evolution use?
Karpathy Output Evolution is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does Karpathy Output Evolution use?
About 1.5k tokens (SKILL.md is roughly 6k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
What are the alternatives to Karpathy Output Evolution?
Skills that share tags, products or a category with Karpathy Output Evolution: Qiaomu Bento Ppt (joeseesun/qiaomu-bento-ppt, 127 stars), Ky Markdown Rebuilder (KyrieCheungYep/ky-markdown-rebuilder, 117 stars), Ppt Page (OWWZO/ai-agent, 188 stars) and PPT as Code (Russell-cell/PPT-as-code, 191 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains Karpathy Output Evolution?
LearnPrompt (a GitHub user) maintains it in LearnPrompt/andrej-karpathy-skills, which has 110 GitHub stars. The repository holds 15 skills in this directory. The repository was last updated on July 10, 2026.
Source: LearnPrompt/andrej-karpathy-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.