docs-page

Generate a self-contained HTML documentation page with three-column layout.

84.7k|9.9k|Updated Apr 28, 2026
One-click install
npx skills add https://github.com/nexu-io/open-design --skill docs-page-nexu-io
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: docs-page
Source: https://github.com/nexu-io/open-design/tree/main/skills/docs-page
Command: npx skills add https://github.com/nexu-io/open-design --skill docs-page-nexu-io

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Quickly assemble a complete, publish-ready documentation page in a single HTML file that organizes navigation, content, and a dynamic table of contents.

Core Features & Use Cases

  • Three-column layout with left navigation, centered article, and right TOC
  • Inline code blocks, callouts, and responsive behavior for desktop and mobile
  • Real-world example: turn API docs into a navigable HTML doc with sections, anchors, and a sticky TOC

Quick Start

Create a ready-to-publish three-column docs HTML page using the provided content.

Frequently Asked Questions about docs-page

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

FAQPage Schema
How do I create a three-column documentation layout in a single HTML file?

A three-column documentation layout in a single HTML file requires a left navigation rail, a centered article region, and a right-hand table of contents. This approach embeds CSS inline to ensure the page is self-contained and publish-ready for offline use.

What is the best way to generate a self-contained HTML page for API references and guides?

Generating a self-contained HTML page for API references involves embedding inline CSS and adding anchor IDs to headings. This creates a durable, navigable document with a sticky table of contents that supports responsive behavior without external dependencies.

Can I build a responsive docs page with a sticky table of contents for offline deployments?

Yes, you can build a responsive docs page with a sticky TOC for offline deployments. The HTML document applies responsive behavior for desktop and mobile, ensuring accessible typography and code blocks render correctly without an internet connection.

How do I add a dynamic table of contents and anchor links to an HTML tutorial?

Adding a dynamic table of contents to an HTML tutorial requires placing anchor IDs on all headings within the centered article region. The right-hand TOC then maps to these anchors, enabling seamless in-page navigation for users.

Does this documentation layout support inline code blocks and callouts?

Yes, this documentation layout supports inline code blocks and callouts within the centered article region. It provides accessible typography for these elements, ensuring code snippets and highlighted notes render properly across desktop and mobile devices.