slides-generator

To generate interactive React presentations automatically, you provide a topic and research data, and the Skill orchestrates sub-agents to select a design system, generate React and Tailwind CSS components, and export a standalone HTML file. It uses Framer Motion for interactive slide animations.

Yes, you can export React slides to a standalone HTML file. The Skill uses Vite and Puppeteer to build and verify the presentation in a browser, ensuring the final output is a single, portable, high-performance HTML file that runs without a server.

Yes, you need Node.js and Puppeteer to create React presentation slides with this Skill. Puppeteer performs automated browser-based verification to ensure slides are visually perfect before exporting, while Node.js runs the Vite build process for the React components.

The best way to automate presentation design with Tailwind CSS is to use a progressive disclosure workflow that guides you through topic, audience, and style selection. The Skill then integrates with design skills to generate consistent color palettes, typography, and layout patterns automatically.

Browser-verified export for React presentations works by using Puppeteer to run automated browser testing on the generated slides. This verifies that the Framer Motion interactions and Tailwind CSS layouts are visually perfect before building the final standalone HTML presentation file.

When using Tailwind CSS and Framer Motion for slide generation, you are limited to web-based presentation formats rather than traditional slide decks like PowerPoint. Additionally, the automated design system and sub-agent orchestration require a Node.js environment with specific dependencies installed to function correctly.