Claude-skill-registry curriculum-package-web

Generate responsive HTML/CSS/JS web content with interactive elements, quizzes, navigation, and accessibility for self-paced or blended learning. Use when creating web content, interactive lessons, or online materials. Activates on "create website", "web content", "interactive web", or "HTML export".

install

source · Clone the upstream repo

git clone https://github.com/majiayu000/claude-skill-registry

Claude Code · Install into ~/.claude/skills/

T=$(mktemp -d) && git clone --depth=1 https://github.com/majiayu000/claude-skill-registry "$T" && mkdir -p ~/.claude/skills && cp -r "$T/skills/data/curriculum-package-web" ~/.claude/skills/majiayu000-claude-skill-registry-curriculum-package-web && rm -rf "$T"

manifest: skills/data/curriculum-package-web/SKILL.md

Web Content & Interactive Materials

Create responsive, accessible web-based learning content with interactivity, navigation, and engagement features.

When to Use

Create standalone websites
Generate interactive lessons
Build self-paced modules
Develop online content
Create web-based activities

Required Inputs

Content: Lessons, assessments, resources
Interactivity: Quiz types, activities needed
Styling: Theme, colors, branding
Features: Navigation, progress tracking, etc.

Workflow

1. Generate HTML Structure

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Course Title</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <nav><!-- Navigation menu --></nav>
  <main><!-- Content --></main>
  <footer><!-- Footer --></footer>
  <script src="interactive.js"></script>
</body>
</html>

2. Add Interactive Elements

Quizzes with immediate feedback
Drag-and-drop activities
Expandable content sections
Progress indicators
Bookmarking
Note-taking

3. Ensure Responsiveness

Mobile-friendly (320px+)
Tablet optimized
Desktop enhanced
Touch and keyboard accessible

4. CLI Interface

# Full course website
/curriculum.package-web --materials "curriculum-artifacts/" --output "course-website/"

# Single interactive lesson
/curriculum.package-web --lesson "lesson1.md" --interactive --quiz "quiz1.json"

# With custom theme
/curriculum.package-web --materials "curriculum-artifacts/" --theme "dark" --primary-color "#3498db"

# Help
/curriculum.package-web --help

Exit Codes

0: Website generated
1: Invalid configuration
2: Cannot load materials
3: Build failed