Slide-CN is a code-first presentation framework built for developers who prefer to create slide decks using React components rather than traditional drag-and-drop design tools. Created by Prithvi, it allows for the seamless integration of presentations directly into React applications, leveraging the power of TypeScript and the Shadcn/ui ecosystem. By treating presentations as code, users can manage their slide decks with standard development workflows, including version control, collaborative pull requests, and CI/CD deployment pipelines.

The framework provides a comprehensive set of primitives that enable developers to build highly interactive and visually consistent presentations. Because slides are built as React components, they can easily incorporate any library or tool from the broader JavaScript ecosystem, including advanced data visualization, 3D models via Three.js, or real-time data fetching. This approach offers significant advantages for technical talks, product demos, and startup pitch decks, where dynamic content and programmatic control provide a more engaging experience than static PDFs or slide files.

Some of the key features are:

• Code-First Authoring: Write slides using JSX components with full TypeScript support and type safety.
• Shadcn Integration: Uses the established Shadcn theming system for consistent design and easy styling through CSS variables.
• Interactive Components: Supports advanced features like progressive reveals, code blocks, and dynamic UI state changes.
• Layout Primitives: Includes pre-built layouts such as title slides, horizontal and vertical splits, and flexible content containers.
• Version Control: Manage presentations with Git to track changes, review updates, and maintain audit logs.
• AI-Assisted Creation: Includes a dedicated skill package for AI agents to help scaffold decks and organize slide content.
• Component Library: Provides essential slide primitives including Deck, Slide, Reveal, CodeBlock, and more.

Operating with Slide-CN is similar to standard web development. Developers install the framework via the Shadcn CLI, which adds the necessary deck and slide primitives to their existing project. Presentations are then defined as a series of components wrapped within a parent deck container. Navigation, including keyboard and swipe support, is handled by the framework's core components, allowing the developer to focus entirely on slide content and structure. Once built, the deck can be presented directly in a web browser, eliminating the need for bulky file transfers or proprietary presentation software.

Some common use cases include:

• Technical Presentations: Explaining complex system architectures with step-by-step interactive diagrams and live code execution.
• Startup Pitch Decks: Building dynamic presentations that allow for quick iteration on content, metrics, and visual layouts.
• Product Demos: Creating interactive slide components that showcase live product workflows or specific feature states.
• Educational Content: Delivering lessons that require code snippets, data visualizers, or interactive elements to explain concepts effectively.