skills.rest
Within-7
Within-7OFFICIAL
Explore all skills by this author →
GitHub

beauty-normal-step3

Convert slide inventories into JSON data and runnable McKinsey-style HTML packages.

Updated Aug 27, 2026
Search Tags:#workflow#template#html#rendering#json#presentation#mcKinsey
One-click install
npx skills add https://github.com/Within-7/minto-plugin-tools --skill beauty-normal-step3
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: beauty-normal-step3
Source: https://github.com/Within-7/minto-plugin-tools/tree/main/html-presentation-beautifier/skills/beauty-normal-step3
Command: npx skills add https://github.com/Within-7/minto-plugin-tools --skill beauty-normal-step3

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill automates turning the Step 2 slide content inventory into a deterministic JSON data structure and an HTML rendering pipeline, producing a runnable McKinsey-style HTML package that includes CSS styles, JSON data, and JavaScript rendering logic.

Core Features & Use Cases

  • JSON data generation: Convert the step-2 slide list into a structured JSON representation suitable for dynamic rendering.
  • HTML rendering: Generate a complete, runnable McKinsey-style HTML output with embedded CSS and JavaScript.
  • Workflow integration: Designed to operate during Step 3 of the beauty-normal workflow, transforming slide inventories into a deliverable format ready for browser viewing.

Quick Start

Use the beauty-normal step3 skill to transform your Step 2 slide list into a JSON data file and a corresponding HTML package that can be opened in a browser.

Frequently Asked Questions about beauty-normal-step3

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

FAQPage Schema
How do I convert slide content into a McKinsey-style HTML presentation?▼

To convert slide content into a McKinsey-style HTML presentation, this skill transforms your slide inventory into a structured JSON data file and loads it into a runnable HTML renderer with embedded CSS and JavaScript.

How does JSON data structure work for dynamic HTML slide rendering?▼

JSON data structures for dynamic HTML slide rendering work by mapping slide content into a deterministic format, which JavaScript rendering logic then reads to generate the final McKinsey-style visual output in a browser.

Can I use this skill to generate a complete HTML package with CSS and JavaScript?▼

Yes, you can use this skill to generate a complete HTML package that includes embedded CSS styles, structured JSON data, and JavaScript rendering logic ready for browser viewing.

What is the best way to automate McKinsey slide rendering from a content inventory?▼

The best way to automate McKinsey slide rendering from a content inventory is to use a workflow that converts the slide list into a deterministic JSON structure and passes it through an HTML rendering pipeline.

Do I need a Step 2 slide inventory before starting the HTML rendering workflow?▼

Yes, you need a Step 2 slide content inventory because this skill is designed to operate during Step 3 of the beauty-normal workflow to transform that specific inventory into a deliverable HTML format.

Why does my JSON slide rendering not match McKinsey presentation templates?▼

JSON slide rendering may not match McKinsey presentation templates if the data does not adhere to the specific JSON data structure standards described in the required template documentation.

Related Skills

Explore More Design & Creative Skills→
deichworxdeichworx

pptx

Convert HTML templates into PowerPoint slides with Python tooling.

Community
Advanced
juandaniel190juandaniel190
1

html-strategic-ppt

Generate a single-file HTML presentation with React, Recharts, and Tailwind CSS.

Community
Advanced
pinion05pinion05
3

presentation-generator

Generate interactive HTML presentations with PNG and PDF exports from structured content.

Community
Intermediate
inclusionAIinclusionAI
1.2k

ppt

Generate PowerPoint presentations from structured outlines and HTML-style templates.

Official
Advanced