// Create, manage, validate, preview, and export HTML presentation slides (1920x1080). Load this skill when you need to build a slide deck, export to PDF/PPTX, or preview slides in a browser.
| name | presentations |
| description | Create, manage, validate, preview, and export HTML presentation slides (1920x1080). Load this skill when you need to build a slide deck, export to PDF/PPTX, or preview slides in a browser. |
1920x1080 HTML slide decks. Inter font, D3.js, and Chart.js pre-loaded.
SCRIPT=~/.opencode/skills/GENERAL-KNOWLEDGE-WORKER/presentations/presentation.ts
# Create a slide (content = HTML body only, no html/head/body tags)
bun run "$SCRIPT" create_slide '{"presentation_name":"my-deck","slide_number":1,"slide_title":"Intro","content":"<div style=\"...\">...</div>","presentation_title":"My Deck"}'
# List slides
bun run "$SCRIPT" list_slides '{"presentation_name":"my-deck"}'
# Delete a slide
bun run "$SCRIPT" delete_slide '{"presentation_name":"my-deck","slide_number":2}'
# List all presentations
bun run "$SCRIPT" list_presentations
# Delete a presentation
bun run "$SCRIPT" delete_presentation '{"presentation_name":"my-deck"}'
# Validate dimensions (Playwright)
bun run "$SCRIPT" validate_slide '{"presentation_name":"my-deck","slide_number":1}'
# Export to PDF
bun run "$SCRIPT" export_pdf '{"presentation_name":"my-deck"}'
# Export to PPTX
bun run "$SCRIPT" export_pptx '{"presentation_name":"my-deck"}'
# Generate viewer HTML (no server)
bun run "$SCRIPT" preview '{"presentation_name":"my-deck"}'
# Start on-demand viewer server (port 3210 by default)
bun run "$SCRIPT" serve '{"port":3210}'
The viewer is not a persistent background service. Start it on-demand with the serve action when you need to preview slides:
bun run "$SCRIPT" serve '{"port":3210}'
This starts a Bun server on port 3210 that serves all presentations under the presentations/ directory. When you need it to keep running, launch the same command in pty_spawn.
URL scheme:
http://localhost:3210/ — index listing all presentationshttp://localhost:3210/presentations/<name>/ — viewer for that deckhttp://localhost:3210/presentations/<name>/slide_01.html — raw slide fileAfter starting the server, show the URL to the user via show:
show(action="show", type="url", url="http://localhost:3210/presentations/<name>/", title="Slide Preview")
content is the <body> content only — wrapper injected automaticallybox-sizing: border-box, max 40px paddingwindow.addEventListener('load', () => { ... })presentations/images/ → reference as ../images/filenameTitle slide:
<div style="width:1920px;height:1080px;background:linear-gradient(135deg,#1e1b4b,#312e81);
color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;
box-sizing:border-box;padding:100px;text-align:center;">
<div style="font-size:24px;color:#a5b4fc;letter-spacing:4px;text-transform:uppercase;margin-bottom:32px;">SUBTITLE</div>
<h1 style="font-size:80px;font-weight:800;margin:0;line-height:1.1;">Title</h1>
</div>
Two column:
<div style="width:1920px;height:1080px;background:#0f172a;color:#f8fafc;
display:grid;grid-template-columns:1fr 1fr;gap:80px;
box-sizing:border-box;padding:80px;align-items:center;">
<div><!-- left --></div><div><!-- right --></div>
</div>
Typography: Title 64–80px/700+, Subtitle 36–48px, Body 28–36px, min 18px
create_slide × N → validate_slide → serve → show viewer URL → export_pdf / export_pptx
Discover, compare, and run AI models using Replicate's API. Use this skill whenever the task involves AI-generated media — images (text-to-image, style transfer, editing, upscaling, background removal), video, audio, or any other ML model output. Requires a REPLICATE_API_TOKEN — ask the user for it if not already set.
Use for distinctive production-grade websites, landing pages, and interactive web experiences with strong design and QA discipline.
Transcribe any audio or video file to text using Whisper (Groq or OpenAI). Use when the agent receives voice messages, audio files, video messages, or any media with speech. Triggers on: 'transcribe', 'what does this say', 'voice message', 'speech to text', 'audio', any file path ending in .ogg .mp3 .mp4 .wav .webm .m4a .flac .oga .oga
Browser automation CLI for AI agents. Use when the user needs to interact with websites, including navigating pages, filling forms, clicking buttons, taking screenshots, extracting data, testing web apps, or automating any browser task. Triggers include requests to "open a website", "fill out a form", "click a button", "take a screenshot", "scrape data from a page", "test this web app", "login to a site", "automate browser actions", or any task requiring programmatic web interaction.
Control desktop applications on the user's machine using agent-click. Use when you need to click buttons, type text, read screens, scroll, drag files, move/resize windows, open/quit apps, interact with UI elements, or automate desktop workflows. Triggers: 'click on', 'open app', 'type into', 'scroll down', 'drag file', 'take screenshot', 'read the screen', 'interact with UI', 'desktop automation', 'computer use', 'agent-click'. Built on agent-click (https://github.com/kortix-ai/agent-click, https://www.agent-click.dev/) — an open-source computer use CLI by Kortix. Right now only works on macOS.
Interact with the user's local machine via Agent Tunnel. Use when you need to read/write files on their computer, run shell commands locally, take screenshots, click, type, control the mouse/keyboard, manage windows and apps, read/write the clipboard, or use the accessibility tree to interact with UI elements. Triggers: 'access my machine', 'local file', 'on my computer', 'my desktop', 'take a screenshot of my screen', 'run this on my machine', 'click on', 'open an app', 'accessibility tree'.