Skills
.Work. You
Rest

html-didactic-tutorial

Community

Create a single‑file interactive HTML tutorial.

Product & Management#documentation#html#tutorial#sidebar#darkmode#singlefile
Authorpaulovictor237
Version1.0.0
Installs0

System Documentation

What problem does it solve?

It generates a complete, self‑contained HTML tutorial with dark‑mode styling, progress bar, sidebar navigation, and rich components, removing the need to hand‑code complex layouts or manage multiple assets.

Core Features & Use Cases

  • Single‑file output: All CSS, JavaScript, and HTML are embedded in one file ready for distribution.
  • Dark‑mode modern design with a scrolling progress bar and fixed top bar.
  • Automatic sidebar TOC generated from section titles.
  • Rich components such as callouts, cards, steppers, tables, embeds, and code blocks.
  • Use cases: product guides, onboarding manuals, technical documentation, educational tutorials, or any step‑by‑step explanation that benefits from interactive navigation.

Quick Start

Ask the assistant to create an HTML tutorial on “How to set up a local development environment” using the html‑didactic‑tutorial skill.

Dependency Matrix

Required Modules

None required

Components

assets

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: html-didactic-tutorial
Download link: https://github.com/paulovictor237/PeveAgent/archive/main.zip#html-didactic-tutorial

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.