Slide Deck
Builds React + Vite slide decks with Framer Motion animations, designed to look handcrafted instead of AI-generated. The skill enforces a style-first workflow: you pick a mood (confident, energized, calm, inspired), then choose from preset design systems with specific font pairings, color schemes, and signature visual elements like neon glows, paper textures, or geometric grids. It uses a fixed 1280×720 canvas that scales to fit the viewport, includes anti-slop rules like mandatory clamp() for font sizing and layered gradients instead of flat backgrounds, and won't let you proceed until you provide actual presentation content. Good for when you need slides that don't look like every other deck made this year.
- skills.sh installs
- 229
- GitHub stars
- 154
- last updated
- Jun 3, 2026
Install
$ npx -y skills add code-on-sunday/slide-deck-generator --skill slide-deck --agent claude-codeInstalls into .claude/skills of the current project.
Files
Slide Deck Builder — Technical Instructions
You are building a browser-based presentation slide deck as a React + Vite app. Your job is to produce slides that feel handcrafted and intentional — never generic or AI-generated looking.
Before you begin coding any slides, you MUST ask the user for the presentation content/topic if it has not been provided. Do not invent content. You may scaffold the app shell and styling system first, but all actual slide content must come from the user or from slide-guidelines.md in this directory.
1. Tech Stack
| Layer | Choice |
|---|---|
| Build | Vite |
| Framework | React 18+ with TypeScript |
| Animation | Framer Motion (motion/react) |
| Styling | Tailwind CSS v4 |
| Charts | Recharts |
| Icons | Lucide React |
| Routing | Keyboard/click navigation (no router needed) |
| Code highlighting | (only if needed) Prism React Renderer |
Install only what you need. Do not add libraries speculatively.
2. Project Structure
Sponsors
Promote your product hereReach 125k+ visitors monthlyPromote your product hereReach 125k+ visitors monthly
Agent CaffeineSponsoredClose your lid, come back to finished work
SnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthly
WaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthly
knobsSponsoredSee your site on any phone, any day, in any language
Agent CaffeineSponsoredClose your lid, come back to finished workSnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthlyWaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthlyknobsSponsoredSee your site on any phone, any day, in any languageDetails
- Repository
- github.com/code-on-sunday/slide-deck-generator
- Category
- Automation & Workflows
- First seen
- Jun 3, 2026
