output-presentation

Applies a Kami-inspired editorial visual system to self-contained HTML documents.

Updated Aug 14, 2026
One-click install
npx skills add https://github.com/MDSIXONE/opencode-config --skill output-presentation-mdsixone
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: output-presentation
Source: https://github.com/MDSIXONE/opencode-config/tree/main/skills/output-presentation
Command: npx skills add https://github.com/MDSIXONE/opencode-config --skill output-presentation-mdsixone

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? When an AI assistant generates long-form HTML reports or documents, the output often looks like a generic dashboard or unstyled page. This Skill provides a consistent, content-first editorial design system so generated HTML documents read like polished paper documents without any external resources. ## Core Features & Use Cases - Editorial Design System: Defines a warm parchment canvas, ivory paper surface, and ink-blue accent palette with serif-first font stacks that work without downloaded fonts. - Component Guidance: Covers layout rules for cards, quotes, code blocks, tables, metrics, tags, and optional table of contents or collapsible sections. - Self-Contained Output: Enforces inline CSS with no CDNs, remote fonts, network requests, analytics, or storage, so documents work fully offline. - Use Case: After a secretary agent decides to deliver a research summary as HTML, apply this Skill to produce a readable, print-like document with clear hierarchy and restrained styling. ## Quick Start Apply the output-presentation style to the HTML report the secretary just generated so it uses the Kami-inspired editorial layout.

Frequently Asked Questions about output-presentation

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I style AI-generated HTML reports with an editorial design?▼

Apply this Skill's design system to the generated HTML: use a parchment canvas, ivory paper surface, ink-blue accent color, and serif-first font stacks. Keep all CSS inline so the document remains self-contained and readable offline.

When should I use this output presentation skill?▼

Use it only after the secretary agent has selected HTML as the output route, or when the user explicitly requests Kami or editorial formatting. It is not intended for short Markdown or chat-only responses.

Does the generated HTML require internet access or external fonts?▼

No. The Skill mandates fully self-contained documents with inline CSS and system font fallbacks for Chinese and Latin text. CDNs, remote fonts, remote images, network requests, and analytics are explicitly prohibited.

Can this skill write files or decide when to use HTML output?▼

No. It defines presentation only. Deciding whether HTML should be used, writing or saving files, opening a browser, and returning delivery status all belong to the secretary agent's core workflow.

What styling elements should be avoided in editorial HTML documents?▼

Avoid heavy shadows, glassmorphism, flashy gradients, decorative animation, dashboard chrome, and oversized decorative quote blocks. Use restrained borders, whisper shadows, and moderate spacing that keeps content primary.