Brain-ai-biz

Brain Edit Slides — Design skill for Claude Code

Design community

✏️ Canva-style visual Edit Mode for any HTML presentation built with Claude Code - drag, edit text, paste screenshots, save.

How to install Brain Edit Slides

This entry records only its repository, not the path inside it, so there is no exact command to give. Open Brain-ai-biz/Brain-edit-slides and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

What Brain Edit Slides does

✏️ Canva-style visual Edit Mode for any HTML presentation built with Claude Code - drag, edit text, paste screenshots, save. Zero dependencies.

Alternatives in Design

Doc — Read, create, and edit .docx documents with formatting and layout fidelity 14.6k ★
Studio — Launch the local design Studio — a live token editor over the latest extraction 3.6k ★
Skill Deck — Generate slide deck presentations from briefs — use when you need slides, pitch decks, or visual summaries 2.8k ★

README

Deck Edit Mode ✏️

**מצב עריכה ויזואלי (בסגנון Canva) לכל מצגת HTML שנבנתה עם Claude Code.**

יצרתם מצגת HTML מהממת עם Claude - אבל כל תיקון קטן דורש עוד פרומפט? החבילה הזו מוסיפה למצגת כפתור **✏️ עריכה** שהופך אותה לעריכה חיה בדפדפן: גוררים, מקלידים, מדביקים צילומי מסך - ושומרים. בלי שרת, בלי התקנות, הכל נשאר בקובץ HTML אחד.

![Brain Edit Slides - מצב עריכה בפעולה](assets/demo.gif)

מה אפשר לעשות במצב עריכה


🖱️ הזזה חופשית	לחיצה בוחרת, גרירה מזיזה - עם קווי הצמדה למרכז
✍️ עריכת טקסט	לחיצה כפולה על כל טקסט - מקלידים ישר על השקף (Esc מבטל)
📋 הדבקת צילום מסך	צילמתם מסך? Cmd+V והוא על השקף. אפשר גם לגרור תמונה מהמחשב
📑 העתק-הדבק אלמנטים	Cmd+C / Cmd+V על כל אלמנט בשקף, Cmd+D לשכפול
🎨 צבעים	עיגולי צבע + גרדיאנט - לכל האלמנט או רק למילה מסומנת
🌫️ טשטוש / הסתרה	פאנל טשטוש לכיסוי נתון רגיש, כולל מצב אטום
🎯 דיוק	חצים = פיקסל (Shift = 10), כפתורי מרכוז, שכבות קדימה/אחורה
↩️ ביטול/חזרה	Cmd+Z / Cmd+Shift+Z + גיבוי אוטומטי בדפדפן עם שחזור
💾 שמירה	Cmd+S מוריד את הקובץ הערוך - מחליפים את המקורי וזהו

התקנה (2 דקות, Claude עושה הכל)

הורידו את הריפו (Code → Download ZIP) או:
```
git clone https://github.com//deck-edit-mode.git
```

פתחו את Claude Code והדביקו:

התקן לי את הסקיל שנמצא בתיקייה deck-edit-mode:
העתק אותה אל ‎.claude/skills/deck-edit-mode בפרויקט שלי (או ~/.claude/skills),
ואז הוסף את מצב העריכה למצגת האחרונה שיצרת לי.

זהו. מעכשיו כל מצגת חדשה ש-Claude יוצר לכם תקבל את מצב העריכה אוטומטית, ותוכלו לבקש ממנו להוסיף אותו גם למצגות ישנות.

💡 אפשר גם בלי סקיל: `python3 scripts/inject_editor.py path/to/deck.html` על כל קובץ מצגת - וזה בפנים.

זה יעבוד על המצגת שלי?

כנראה שכן. העורך מותאם למבנה הנפוץ של מצגות שClaude מייצר (קונטיינר במידות קבועות + שקפים עם `class="slide"`). אם המצגת שלכם בנויה אחרת - זה בדיוק התפקיד של הסקיל: Claude קורא את המבנה של המצגת שלכם ומתאים את ההזרקה אליה (הכל מוסבר