slides

Generate and edit presentation slide decks using React and Tailwind CSS.

Updated Mar 13, 2026
One-click install
npx skills add https://github.com/tann200/CodingAgent --skill slides-tann200
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: slides
Source: https://github.com/tann200/CodingAgent/tree/main/tui/.local/skills/slides
Command: npx skills add https://github.com/tann200/CodingAgent --skill slides-tann200

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill streamlines the process of creating professional slide decks, making it easy to build visually stunning presentations.

Core Features & Use Cases

  • Professional Design: Offers design guidance and tools for creating decks that look like they were designed by a top-tier agency.
  • Slide Creation: Provides instructions for building slide decks with React and Tailwind CSS.
  • Use Case: Ideal for creating presentations, pitches, and other professional slide-based content. The Skill ensures decks are well-designed, consistent, and visually engaging.

Quick Start

Use the slides skill to generate a new slide deck with a specific aesthetic direction, focusing on brand colors, fonts, and visual identity.

Frequently Asked Questions about slides

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

FAQPage Schema
How do I create a presentation slide deck using React and Tailwind CSS?

To create a presentation slide deck with React and Tailwind CSS, use this Skill to generate structured slide components and apply professional design guidance for visually appealing results.

Can I build professional presentation designs without external slide software?

You can build professional presentation designs directly within your development environment using React and Tailwind CSS, bypassing traditional slide software for a more code-driven, consistent visual workflow.

What do I need to set up before generating slide decks with this Skill?

Generating slide decks requires a Replit workspace and foundational knowledge of React component architecture to properly implement the manifest contract and slide component conventions.

How does Tailwind CSS improve presentation design in a React project?

Tailwind CSS improves presentation design by enabling rapid, consistent styling of React slide components, ensuring brand colors, fonts, and visual identity are applied uniformly across the deck.

Are there limitations to building slide decks with React components?

Limitations include the necessity of a Replit workspace and React component architecture knowledge, making this approach less suitable for users seeking a drag-and-slide visual editor.

What is the best way to ensure visual consistency across a React presentation?

The best way to ensure visual consistency across a React presentation is to follow the Skill's design guidance and slide component conventions, applying unified Tailwind CSS styling based on brand identity.