一覧に戻る
AI Agents Skills (Figma, UX, Mobile)
collectionクロスエージェントスキル集（Claude Code、Cursor、Copilot、Windsurf対応）。Figma API統合＆デザイントークン、UXデザインシステムのパターンライブラリ管理、モバイルレスポンシブ設計。オープンSKILL.md標準。
🧠 Agent Skills Repository
Created by Yuval Avidani · AI Builder, Speaker, 2× GitHub Star, AWS GenAI Superstar, AI commentator on Channel 12 News (Israel)
yuv.ai · all links · @yuvalav · @yuval_770 · YouTube · GitHub
⚡ Install the full creative stack in one command
curl -sSL https://raw.githubusercontent.com/hoodini/ai-agents-skills/master/install.sh | bash
Installs 15 skills as one package: yuv-pilot (top-of-pyramid orchestrator) · yuv-design-system (brand) · yuv-decks (cinematic presentations) · yuv-viral-video (short-form) · video-edit · video-to-landing-page · parallax-landing-page · hyperframes + 4 companions · nano-banana-pro (AI images) · mermaid-diagrams. Plus ffmpeg / Node / Python / faster-whisper / hyperframes CLI / Python venvs / cross-tool symlinks to ~/.copilot/skills + ~/.agents/skills. Works on macOS, Linux, Windows (Git Bash/WSL).
After install, restart your agent and just type what you want:
"make a deck about <topic> for <audience>"
"build a stunning parallax landing page from this video: <path>"
"edit this video into a viral short: <path>"
The right skill auto-fires. Projects save to ~/Documents/yuv-projects/{decks,landings,videos}/<slug>/ so they're always findable.
🌐 Live examples: yuv.ai · effects.yuv.ai (HyperFrames effects catalog) · examples/parasites/ (three parallax landings: GitHub Desktop, Marcus the lion, Hope the cheetah)
🪜 The YUV.AI skills pyramid
The YUV.AI creative stack is a three-tier pyramid. You don't have to remember which skill does what — say what you want, the orchestrator routes.
┌─────────────────────┐
│ yuv-pilot │ ← top: intent → route
│ (orchestrator) │
└──────────┬──────────┘
│
┌────────────────────┼────────────────────┐
▼ ▼ ▼
┌─────────┐ ┌─────────────┐ ┌──────────────┐
│yuv-decks│ │ yuv-design- │ │ yuv-viral- │
│ │ │ system │ │ video │
│ talks · │ │ │ │ │
│ slides ·│ │ palette · │ │ short MP4s · │
│ keynotes│ │ typography ·│ │ Reels · TikTok│
│ │ │ 3 modes · │ │ MrBeast-paced │
│ │ │ assets │ │ editorial │
└─────────┘ └─────────────┘ └──────────────┘
┌─────────────┐ ┌─────────────────┐ ┌──────────────────┐
│ video-edit │ │ parallax- │ │ video-to- │
│ │ │ landing-page │ │ landing-page │
│ captioned · │ │ │ │ │
│ Hebrew+EN · │ │ scroll-scrub · │ │ Apple-style · │
│ transcript- │ │ video frames · │ │ sticky hero · │
│ review flow │ │ github/lion/hope│ │ frames + sections│
└─────────────┘ └─────────────────┘ └──────────────────┘
│
▼ (the middle tier uses these)
open-slide · hyperframes · gsap · nano-banana-pro · video-use ·
slide-authoring · mermaid-diagrams · hyperframes-cli · website-to-hyperframes
Brand DNA — universal Fly High throughline:
flight metaphors · HUD + dials · phoenix mark ·
"Let's Fly High" watermark · Anton + JetBrains Mono
(palette is the chapter, motifs are the brand)
How to invoke
| Say | What fires |
|---|---|
"build me a deck about <topic> for <audience>" | yuv-decks (lead) + yuv-design-system in Decks mode + open-slide scaffolding |
"build a landing page for me / my brand" | yuv-design-system in Neon mode + gsap for motion |
"turn this video into a landing page" (5–15s clip) | parallax-landing-page — scroll-scrub cinematic landing |
"turn this video into a landing page" (longer, with sections) | video-to-landing-page — Apple-style sticky-hero |
"edit this video / add captions" | video-edit — transcript-review-before-render workflow |
"make it viral / YUV.AI short" | yuv-viral-video — opinionated MrBeast-paced pipeline |
"launch my new course / cross-channel campaign" | yuv-pilot — orchestrates a build order across multiple skills |
"what should I build for my brand" (strategic, no specific deliverable) | yuv-pilot — surfaces options |
"build me a snake game" (no YUV.AI signal) | Whole pyramid stays out — picks whatever palette fits |
"build me a YUV.AI snake game" (explicit brand signal) | yuv-design-system in Neon mode + Three.js or Canvas |
Three palette modes (only when applied)
| Mode | When | Palette |
|---|---|---|
| Neon (default for YUV.AI web/app/game/dashboard/social) | Anything that's not a slide deck | Hot pink #FF1464 + neon cyan #00E5FF + white or rich black |
| Decks (Fly High) | Presentations, slides, keynotes only | Purple #5E17EB + yellow #FFEC00 + grey #F1F2F2 |
| Warm Editorial | Hope, Marcus, bigcats.ai, practical.yuv.ai | Pink + yellow + bone |
The pyramid auto-applies only when YUV.AI brand context is signaled (my brand, for me, YUV.AI, etc.). Generic requests stay outside the system — Claude / Copilot / Cursor pick whatever fits the project.
🆕 NEW: cinematic-scrub-landing — golden landing page template
Drop in a hero video + logo + product photo. Get back a premium cinematic landing page with mouse-driven video scrubbing and a 5-beat narrative arc.
The hero video lives fixed across the whole page — moving the mouse left-right scrubs the timeline so the subject responds to the cursor. Below it, four fully-opaque sections each carry their own brand identity (bright primary-accent recipe / cream nostalgia album / dark contemplative pricing / red action finale) and walk the viewer through longing → joy → nostalgia → contemplation → action. Works for any language (RTL or LTR) and any subject — food, tech, animals, fashion, services, SaaS, wildlife, music, books, real estate.
What's baked in (every rule hard-won from a real production build):
- All-keyframes ffmpeg re-encode (
-g 1 -keyint_min 1) so mouse-scrub is buttery, not stuttery - The z-index trap documented as hard rule #1 (outer wrapper has NO bg class, or the video disappears)
- Per-section opaque identities — no monotone scrim through every section
- Language-aware typography trinity (Hebrew Rubik+Assistant+Suez One / English Anton+Inter+Caveat / Arabic Cairo+Tajawal+Reem Kufi / Japanese Noto Sans JP / etc.)
- RTL/LTR mirroring — hero panel side, cursor cue side, scroll-to-top position, arrow direction
- Six reusable visual primitives — polaroid, stamp, ribbon, highlight-circle, ghost-text, motif SVGs
- Real product photography wins over generated gradients — the skill always finds prominent placement for
PRODUCT_IMAGE - Clickable scroll-spy navbar + scroll-to-top button + favicon set from the logo
- 12-step verification gate before reporting done
Reference implementation: https://github.com/hoodini/bamba (Israeli RTL site for the snack "במבה" — the original build this skill was distilled from).
🔗 View cinematic-scrub-landing →
Pairs with parallax-landing-page (scroll-scrub frames, page never moves) and video-to-landing-page (Apple-style sticky hero with sections below) — pick cinematic-scrub-landing when the hero should respond to the cursor and the page below should tell a story.
🆕 NEW: yuv-design-system — single source of truth for visuals
Yuval Avidani's canonical design system, now public. Replaces the prior yuv-design skill (which only covered the Warm Editorial pink/yellow/bone family). Encodes:
- Two palette modes — Fly High (purple
#5E17EB+ yellow#FFEC00+ grey, the default for keynotes / dashboards / dev-facing UIs) and Warm Editorial (pink + yellow + bone, only for the Hope / bigcats / practical.yuv.ai brand family) - Mandatory typography — Anton + Inter for English, Rubik + Assistant for Hebrew, letter-spacing 0 by default
- Signature components —
PurpleBar,YellowUnderline,FlightHUD,CompassDial,CounterUp,HeroBg - Brand assets bundled — 4 phoenix logos + studio portrait, with a 4-step asset-retrieval fallback chain for any machine
- Canonical link set + bio — auto-included on any footer / about / credits block
- Lessons-learned reference — 15 hardened production patterns (bilingual toggle, mobile hamburger threshold, Anton letter-spacing rules, yellow-span
line-height ≥ 1.0, IntersectionObserver for GSAP catalogs, GH Pages cert nudge, …) - Pre-flight checklist — 14 mandatory checks before any visual ships
Pairs with yuv-decks (cinematic presentation builder), yuv-viral-video (short-form video), and hyperframes (capture web → MP4). Project brand wins when explicitly specified; otherwise this skill fills the vacuum.
🆕 NEW: yuv-decks — opinionated cinematic deck builder
Builds open-slide presentation decks in Yuval Avidani's signature style: 4-act narrative arc (Boarding → Ascent → Cruise → Descent), Yuval voice (plain-language, no jargon, ≤8–12 word bullets, define every name), the flight-themed JourneyBar unifying every slide, reusable UseCase / CaseStudy / LessonsGrid templates, and an automatic orchestration of nano-banana cinematic hero images + Hyperframes video moments + Mermaid technical diagrams.
Inherits all palette/typography/components from yuv-design-system and locks the Decks mode (Fly High purple/yellow/grey — the dedicated palette for slides). For talks whose central metaphor IS literal flight, opt into the cinematic-flight mode (sky-blue + hot pink) — same arc and JourneyBar, different palette. Never falls through to Neon (web/app palette).
Reference implementation: https://github.com/hoodini/build-agents-that-ship (the NICE pre-hackathon "Build Agents That Ship" deck, May 2026).
🆕 NEW: Parallax Landing Page Skill
Turn any short video (5–15s) into a cinematic scroll-driven landing page where the
user's scroll gesture scrubs the frames in place — the page itself never scrolls. A single
locked viewport with five dramatic text scenes that crossfade in/out as the frame index
advances, an Anton + Caveat typography contract, off-white #f5f1ea (never pure white), a
vignette + film-grain overlay, a loader that preloads every frame, and a final scene that
holds the CTAs (no separate end section). Built on the proven parasites/ reference repo
(GitHub Desktop / Marcus the white lion / Hope the cheetah landings).
🔗 View the Parallax Landing Page Skill →
What's inside:
scripts/extract_frames.py— ffprobe + ffmpeg-q:v 2extraction with auto-computedscrollBudget(≈26 px per frame, clamped to[2500, 8000])assets/parallax.js— virtual-scroll controller: wheel/touch/keyboard intercepted, document never moves, RAF-driven lerp (0.22) for buttery frame scrubbingassets/style.css— locked-body landing page CSS (body.scrub-page), 5-scene grid, vignette + grain, Anton/Caveat/Inter font stackassets/landing-page-template.html— full template with{{placeholders}}for slug, scenes, CTAsassets/hub-template.html— 3-up showcase grid template for multi-landing projectsreferences/copy-guide.md— the five-beat arc (Hook → Origin → Stakes → Moment → Resolution) with three real cinematic examplesreferences/showcase-integration.md— exact edits to grow an existing hub (card + nav + chain CTA)
One-shot: point the script at a video, capture the JSON, fill in the template, serve with python -m http.server.
python skills/parallax-landing-page/scripts/extract_frames.py demo.mp4 ./out/demo
🎬 See it live: the three landing pages built with this skill ship in
examples/parasites/ — GitHub Desktop, Marcus the white lion,
and Hope the cheetah. After cloning:
cd examples/parasites && python -m http.server 8000
# open http://localhost:8000/
Note: distinct from
video-to-landing-page(which uses an evenly-spaced scroll-listener approach). This skill is the "Apple AirPods Pro" variant — every frame, locked body, dramatic typography, narrative beats.
🆕 NEW: Video-Edit Skill (with Interactive Transcript Editor)
A complete captioned-video pipeline that pauses for human transcript approval before the
long final render — the support mechanism that makes captions perfect (especially Hebrew).
Transcribes any video with faster-whisper (defaults to large-v3), applies a configurable
corrections dictionary, opens an interactive browser editor with video preview, per-line
inline editing, dictionary apply, find/replace and optional in-browser LLM suggestions via
WebLLM (Qwen2.5-3B / Llama-3.2-3B over WebGPU — runs entirely offline once cached). On
approval, redistributes word timings and generates a HyperFrames composition with
liquid-glass caption pills, drifting blob background, liquid morph wipes, and optional
behind-subject text via background removal. Supports English, Hebrew and any
Whisper-supported language.
What's inside:
transcribe.py— faster-whisper CPU/CUDA with safe fallbackmake_review.py+apply_review.py— emit & ingest atranscript_review.txtround-triptranscript-editor/index.html— self-contained webapp (RTL-aware, autosaves to localStorage)gen_body.py— generator for editorial + matrix liquid-glass caption sub-compositionhost-template.html+liquid-blobs.html+ EN/HE parallax-outro templatescorrections-hebrew.md— curated dictionary of common Hebrew Whisper mishears
🆕 NEW: Video-to-Landing-Page Skill
Drop a video, get a cinematic scroll-driven landing page — Apple-style sticky hero where
scrolling progresses the visible frame through the video. Extracts evenly-spaced frames via
ffmpeg, builds a self-contained index.html with a requestAnimationFrame-driven scroll
listener, and includes headline / sections / CTA below. Respects the yuv-design-system typography
(Anton + Inter for English, Rubik + Assistant for Hebrew) and Fly High purple palette by default.
🔗 View the Video-to-Landing-Page Skill →
One command from video to deployable page:
python skills/video-to-landing-page/references/extract-frames.py demo.mp4 ./landing-demo --build-html
Then customise __HEADLINE__, __TAGLINE__, __CTA_TEXT__ in the generated index.html
and drop the folder on Vercel / Netlify / Cloudflare Pages.
🚀 NEW: Yuv-Viral-Video Skill
Just added! The complete signature-style video editor that turns raw selfie or screen-share footage into a viral short-form video the way YUV.AI ships them — Apple-style liquid-glass cards with real backdrop blur, dark-mode polish, MrBeast-paced cuts, video-title karaoke captions, content-relevant motion graphics, no fake content, never covering the speaker's face, always rendering BOTH 9:16 and 16:9, always saving with _V<N> backup suffix. Hebrew is rendered in Rubik Black (with proper RTL via python-bidi), English in Anton uppercase. Encodes every painful lesson from real edits as a hard rule the next render automatically respects.
🔗 View the Yuv-Viral-Video Skill →
What it does:
- Apple-style frosted glass cards: rounded corners +
gblur sigma=24backdrop +alphamergemasks so the blur stops cleanly at the rounded shape (no rectangular leak past the corners) - Auto-routes the layout per archetype: screen-share footage shows the screen content (top 2/3) with rounded speaker PIP at bottom 1/3; full-frame selfie shows the speaker prominently with cards in the safe top-banner zone (face never covered)
- Per-segment dynamic motion (push-in / pull-out / snap-in / dolly / shake) baked into the extract chain with subtle MrBeast-style amounts
- Real animated diagrams: bar chart (uses actual category names from transcript, never fake numbers), flow diagram with glowing brand-color nodes connected by animated dashed arrows
- Word-by-word video-title karaoke: scale-pop entrance with
\fscx150\fscy150\t(0,140,\fscx100\fscy100), accent words get yellow + rotation jitter, English brand tokens auto-route to Anton uppercase - Bottom key-moment glass strips that summarise the current beat in 1-4 words (Hebrew right + English left + yellow accent stripe)
- ElevenLabs SFX kit (impact, bass_drop, whoosh, riser, ding, glitch, typing) mixed at the right output times via
adelay - Two-pass loudnorm to -14 LUFS / -1 dBTP / LRA 11 (TikTok / Reels / YouTube standard)
- Versioning: every render writes a NEW
final_*_V<N>.mp4— previous versions are never overwritten - Truth contract: every word on every card is auditable against the actual transcript. No "$$$" placeholders, no "100% הבנה" if the speaker didn't say it, no "לינק בביו" if no link was promised
🆕 NEW: Meta Ads Skill
Just added! A battle-tested skill for pulling, analyzing, and managing Meta ad performance (Facebook, Instagram, Messenger, Click-to-WhatsApp, Threads) via the Marketing API. No guesswork, no generic dashboards — the scripts auto-discover your accounts, decode status codes and currency units, handle rate limits and async insights jobs, and guard write actions behind explicit confirmations.
What it does:
- Pulls ad-level, ad-set-level, campaign-level, and account-level insights with full breakdowns (platform, placement, age, gender, country, device)
- Auto-discovers every ad account your token can see, ranked by last-30-day spend — so you never paste the wrong
act_ID - Handles both auth paths out of the box: System User tokens (never expire, BM-owned accounts) and long-lived user tokens (60-day, sees personal Instagram-boost accounts)
- Ships a token-exchange script for the short→60-day swap — no more fumbling through Graph Explorer docs
- Creative fatigue detection, anomaly detection vs. prior period, CTWA-aware analysis playbooks
- Write actions (pause, budget update, duplicate) gated behind explicit confirmation with impact summaries and rollback patterns
- Baked-in troubleshooting for every failure mode we hit the hard way: sandbox proxy blocks, 37-month data wall, DELETED-status error 1815001, minor-unit currency bugs, IG boosts invisible to SU tokens, and more
🆕 NEW: Google Workspace CLI Skill
Just added! A comprehensive skill that teaches AI agents to use the gws CLI — one command-line tool for all of Google Workspace: Drive, Gmail, Calendar, Sheets, Docs, Slides, Chat, Tasks, Admin, Meet, Forms, Keep, and more. Your agent can now manage your entire Google Workspace without custom tooling.
🔗 View the Google Workspace CLI Skill →
What it does:
- Enables AI agents to interact with every Google Workspace API via
gwsCLI commands - Covers Drive, Gmail, Calendar, Sheets, Docs, Slides, Chat, Tasks, Meet, Forms, Admin, Keep, Apps Script, and more
- Includes 100+ ready-to-use command examples with real JSON payloads
- MCP server integration for Claude Desktop, VS Code, Gemini CLI, and other MCP clients
- Multiple auth workflows: interactive, headless/CI, service accounts, and multi-account support
- Built on Google's Discovery Service — automatically picks up new API endpoints
🧠 Honest Agent Skill
A universal skill that configures ALL your AI coding agents to be honest, objective, and non-sycophantic. Run it once, and every agent (Claude Code, GitHub Copilot, Cursor, Windsurf, etc.) will stop telling you what you want to hear and start giving you honest, direct feedback.
🔗 View the Honest Agent Skill →
What it does:
- Configures honest, objective communication across 7 verified AI coding agents
- One-time setup that updates all your agent instruction files
- Supports both project-level and global configuration
- Works with Claude Code, Copilot, Cursor, Windsurf, Cline, Aider, and Continue.dev
A curated collection of AI agent skills for enhanced coding assistance
Supercharge your AI coding agents with specialized knowledge and production-ready patterns
Skills • Quick Start • Usage • Contributing
👋 About Yuval Avidani
|
Yuval Avidani — AI Builder & Speaker · Founder of YUV.AI🏆 2× GitHub Star · 🌟 AWS Gen AI Superstar · 📺 AI commentator on Channel 12 News (Israel) · 🎤 Enterprise AI Trainer
Hebrew bio: יובל אבידני — מגיש פינת AI בחדשות 12, GitHub Star כפול, AWS Gen AI Superstar, מייסד YUV.AI. בונה, מלמד, ומשגר AI שעובד. |
🔗 Find me everywhere
💼 Work with me
- 🎓 Practical Claude Desktop course → https://practical.yuv.ai
- 🚀 Enterprise AI training & speaking → DM on LinkedIn or @yuvalav
- 🤝 Built something with this stack? Tag @yuvalav on X or DM @yuval_770 on Instagram — I'll feature the best work
- ⭐ Star this repo if it saves you time — helps other builders find it
✨ What Are Agent Skills?
Agent skills are specialized knowledge modules that enhance AI coding agents with domain-specific expertise. They provide:
- 🎯 Focused Knowledge — Only what the AI doesn't already know
- 📝 Production-Ready Code — Working examples, not abstract concepts
- ⚡ Quick Activation — Trigger keywords for instant context
- 🔄 Reusable Patterns — Copy once, use everywhere
�️ Understanding Agent Skills (Open Standard)
What is SKILL.md?
SKILL.md is a simple, open format for giving AI agents new capabilities and expertise. It's an open standard that works across multiple AI coding agents and platforms.
Agent Skills are folders of instructions, scripts, and resources that your AI agent can discover and use to perform tasks more accurately and efficiently.
Why Use Agent Skills?
For You (Developer):
- 📚 Learn Faster — Pre-built knowledge from experts in your domain
- 🎯 Better Results — Agents have context to work more accurately
- ♻️ Reuse Everywhere — Same skill works across Copilot, Claude Code, Cursor, Windsurf, and more
- 🔐 Version Control — Skills are part of your repository, tracked in git
For Your Team:
- 📖 Capture Knowledge — Document processes and best practices
- 🚀 Share Skills — Distribute expertise across projects
- 🏢 Enterprise Use — Centralize organizational knowledge
For AI Agents:
- 🧠 Domain Expertise — Perform specialized tasks reliably
- 🔧 New Capabilities — Enable new workflows and automations
- 🎓 Context — Access procedures, scripts, and examples on demand
What Can You Do With Agent Skills?
Agent skills enable AI agents to:
- Domain Expertise: Package specialized knowledge (legal review, data analysis, deployment procedures)
- New Capabilities: Create presentations, build MCP servers, analyze datasets, debug failures
- Repeatable Workflows: Turn multi-step tasks into consistent, auditable processes
- Interoperability: Reuse skills across different compatible agent products
📚 How Agent Skills Work (Step-by-Step for Beginners)
Step 1: Understanding the File Structure
Each skill is a simple folder with a SKILL.md file inside:
your-project/
├── .github/skills/ # GitHub Copilot project skills location
│ └── my-skill-name/
│ ├── SKILL.md # Main skill file (required)
│ ├── script.js # Optional: supporting scripts
│ └── examples.md # Optional: more examples
├── .claude/skills/ # Claude Code project skills location
│ └── my-skill-name/
│ └── SKILL.md
└── ~/.copilot/skills/ # Personal skills (available across all projects)
└── my-skill-name/
└── SKILL.md
Step 2: Understanding SKILL.md Format
Every SKILL.md file has two parts:
YAML Frontmatter (metadata):
---
name: my-skill-name # Unique identifier (lowercase, hyphens for spaces)
description: What this skill # When should the agent use this skill?
license: MIT # Optional: license information
---
Markdown Body (instructions): The rest of the file contains instructions and examples for the AI agent.
Step 3: A Real Example
Here's what a simple SKILL.md looks like:
---
name: github-actions-debugging
description: Guide for debugging failing GitHub Actions workflows. Use this when asked to debug CI/CD failures or workflow issues.
---
# Debugging GitHub Actions Workflows
When debugging a failing workflow:
1. **Check the job logs** - Look for error messages and stack traces
2. **Review recent changes** - What changed since the last successful run?
3. **Test locally** - Reproduce the issue in your local environment
4. **Fix and validate** - Make changes and verify they work
## Common Issues and Solutions
### Issue: Workflow fails with "Command not found"
**Solution**: Install the required tool in your workflow step
### Issue: Permission denied when running scripts
**Solution**: Add `chmod +x script.sh` before running the script
Step 4: Agent Discovers and Uses Your Skill
When you ask your AI agent to do something:
"Debug why our GitHub Actions workflow is failing"
The agent will:
- ✅ Recognize that you're asking about GitHub Actions
- ✅ Find the
github-actions-debuggingskill in your project - ✅ Load the
SKILL.mdfile into its context - ✅ Follow the instructions to help you debug
Step 5: Supported Locations
Project Skills (specific to one repository):
your-repo/.github/skills/— For GitHub Copilotyour-repo/.claude/skills/— For Claude Code
Personal Skills (available across all projects on your machine):
~/.copilot/skills/— For GitHub Copilot (Copilot CLI and VS Code)~/.claude/skills/— For Claude Code
Organization/Enterprise Skills (coming soon):
- Enterprise-level skills support is in development
🤝 Supported AI Agents
Agent Skills work with these AI coding agents:
| Agent | Support | Location |
|---|---|---|
| GitHub Copilot | ✅ Full Support | .github/skills/ or ~/.copilot/skills/ |
| Claude Code | ✅ Full Support | .claude/skills/ or ~/.claude/skills/ |
| Cursor | ✅ Full Support | .cursor/rules/ |
| Windsurf | ✅ Full Support | .windsurf/rules/ |
| VS Code Insiders | ✅ Full Support | Agent mode with skills |
| VS Code (Stable) | ⏳ Coming Soon | Support coming in future release |
📦 Available Skills
| Skill | Description | Keywords |
|---|---|---|
| yuv-design-system 🆕 | Yuv's canonical visual brand — Fly High purple (default) + Warm Editorial pink, Anton/Inter + Rubik/Assistant, signature components, brand assets, canonical bio/links, 15 hardened production patterns | design system, brand, Fly High, Warm Editorial, Anton, Rubik, PurpleBar, YellowUnderline, FlightHUD, yuv.ai |
| yuv-decks 🆕 | Open-slide cinematic deck builder — 4-act narrative arc, Yuval voice, JourneyBar, reusable templates, automatic nano-banana + Hyperframes orchestration | deck, presentation, slides, talk, keynote, open-slide, cinematic deck, מצגת, שקפים |
| yuv-viral-video | Short-form video editor — liquid-glass cards, dark-mode, MrBeast-paced cuts, karaoke captions, ALWAYS 9:16 + 16:9, never covers the speaker's face | viral video, reel, short, selfie edit, liquid glass, karaoke captions, ויראלי, ריל |
| parallax-landing-page 🆕 | Cinematic scroll-scrub landing page from a short video — locked body, virtual scroll, 5 crossfading scenes, Anton + Caveat typography | parallax landing, scroll-scrub, frame-by-frame, Anton, Caveat, locked hero, virtual scroll, video to landing page |
| video-edit 🆕 | Captioned-video pipeline with interactive transcript editor + WebLLM suggestions before render | video edit, captions, transcribe, Hebrew, WebLLM, liquid-glass captions, HyperFrames |
| video-to-landing-page 🆕 | Apple-style scroll-driven landing page from any video — frames scrub on scroll | landing page from video, scroll-frame, Apple scroll, scrub on scroll |
| meta-ads 🆕 | Meta Marketing API — Facebook, Instagram, CTWA ad insights, fatigue analysis, write actions | Meta ads, Facebook ads, Instagram ads, Marketing API, ROAS, CPA, CTR, CTWA, creative fatigue |
| google-workspace-cli 🆕 | Google Workspace CLI (gws) — Drive, Gmail, Calendar, Sheets, Docs, Chat & more | gws, Google Workspace, Google Drive, Gmail, Google Calendar, Google Sheets, MCP |
| copilot-sdk | GitHub Copilot SDK for building agentic applications | Copilot SDK, GitHub SDK, agentic app, embed Copilot |
| honest-agent 🆕 | Configure all AI agents for honest, objective feedback | honest agent, no sycophancy, objective, contradict me |
| aws-agentcore | AWS Bedrock AgentCore development patterns | AgentCore, Bedrock Agent, AWS agent |
| aws-strands | Model-agnostic agent framework with Strands SDK | Strands, ReAct agent, model-agnostic |
| aws-account-management | AWS Organizations, IAM, billing & multi-account | AWS Organizations, IAM, SCPs, Cost Explorer |
| langchain | LangChain/LangGraph pipelines and agent workflows | LangChain, LangGraph, RAG, LCEL |
| vercel | Vercel deployment, serverless, and edge functions | Vercel, serverless, edge function |
| railway | Railway platform deployment and configuration | Railway, deploy container |
| cloudflare | Cloudflare Workers, Pages, D1, R2, KV & AI | Cloudflare, Workers, D1, R2, edge computing |
| figma | Figma API, component code generation & design tokens | Figma API, design tokens, Figma to code |
| fal-ai | Serverless AI image/video generation with fal.ai | fal.ai, Flux, SDXL, AI image generation |
| mongodb | MongoDB & Mongoose queries, aggregation pipelines | MongoDB, Mongoose, aggregation, NoSQL |
| bun | Bun JavaScript runtime, bundler & test runner | Bun, bun.sh, JavaScript runtime |
| owasp-security | OWASP Top 10 security vulnerabilities & prevention | OWASP, security, XSS, SQL injection, CSRF |
| shabbat-times | Jewish calendar data and Shabbat times integration | Shabbat times, Hebcal, Zmanim |
| copilot-docs | GitHub Copilot custom instructions reference | copilot-instructions.md |
| nano-banana-pro | Google Gemini 3 Pro Image generation | Nano Banana Pro, Gemini 3 Pro Image |
| github-trending | GitHub trending repositories scraping | GitHub trending, trending repos |
| ux-design-systems | Design systems and component libraries | design system, design tokens, theming |
| web-accessibility | WCAG compliance and accessibility patterns | accessibility, a11y, WCAG, ARIA |
| mobile-responsiveness | Responsive design and mobile-first patterns | responsive, mobile-first, breakpoints |
| analytics-metrics | Data visualization and analytics dashboards | analytics, dashboard, charts, KPI |
| mermaid-diagrams | Mermaid diagram syntax for visualizations | Mermaid, flowchart, sequence diagram |
| local-llm-router | Route queries to local LLMs in air-gapped networks with Serena MCP | local LLM, Ollama, LM Studio, air-gapped, Serena, model routing |
| x-twitter-scraper | X/Twitter data extraction — tweet search, user lookup, followers, media, monitoring | Twitter, X, scraper, OSINT, tweets, followers |
🚀 Quick Start
1. Clone the Repository
git clone https://github.com/yuval-avidani/ai-agents-skills.git
2. Copy Skills to Your Project
Choose your AI coding agent and follow the instructions below.
💻 Setup Guide: Using Skills in Your Agent (For Beginners)
This guide walks you through setting up Agent Skills in your favorite coding agent, step by step.
🎯 Prerequisites
Before you start, you need:
- A coding agent installed (Copilot, Claude Code, Cursor, or Windsurf)
- A project folder on your computer
- Basic familiarity with command line or your agent's UI
📍 Step-by-Step Setup
Option 1: GitHub Copilot (Most Popular)
🟢 Setup GitHub Copilot with Skills
For Project Skills (specific to one repository):
-
In your project folder, create the skills directory:
mkdir -p .github/skills -
Copy the skills you want from this repository:
# Copy a single skill cp -r skills/vercel .github/skills/ # Or copy all skills cp -r skills/* .github/skills/ -
Or manually create a skill:
your-project/ └── .github/ └── skills/ └── my-custom-skill/ └── SKILL.md -
Open your project in VS Code and start using Copilot Agent
-
Ask Copilot a question related to your skill, and it will automatically load it!
For Personal Skills (available across all your projects):
-
Find your home directory (
~orC:\Users\YourUsername) -
Create personal skills folder:
mkdir -p ~/.copilot/skills -
Copy skills there:
cp -r skills/vercel ~/.copilot/skills/ -
Now all your projects can use these skills automatically!
Verify it's working:
- Open Copilot Agent
- Ask about something covered in your skill (e.g., "How do I deploy to Vercel?")
- Copilot will use the skill to help you
Option 2: Claude Code
🟣 Setup Claude Code with Skills
For Project Skills:
-
In your project folder, create the skills directory:
mkdir -p .claude/skills -
Copy the skills you want:
# Single skill cp -r skills/langchain .claude/skills/ # All skills cp -r skills/* .claude/skills/ -
Open your project in Claude Code
-
Chat with Claude about tasks covered in your skills - it will automatically use them!
For Personal Skills (available everywhere):
-
Create personal skills folder:
mkdir -p ~/.claude/skills -
Copy skills there:
cp -r skills/aws-agentcore ~/.claude/skills/
Verify it's working:
- Open Claude Code in your project
- Ask about something in your skill
- Claude will reference and use the skill
Option 3: Cursor
🔵 Setup Cursor with Skills
For Project Rules:
-
In your project folder:
mkdir -p .cursor/rules -
Copy SKILL.md files (rename them as rules):
# Copy a skill as a rule file cp skills/figma/SKILL.md .cursor/rules/figma.md # Or copy multiple cp skills/*/SKILL.md .cursor/rules/ -
In Cursor Settings, configure which rules to use:
- Settings → Rules → Add project rules
- Point to
.cursor/rules/folder
-
Start using Cursor - it will apply these rules to your context automatically
Option 4: Windsurf
🟡 Setup Windsurf with Skills
For Project Rules:
-
In your project folder:
mkdir -p .windsurf/rules -
Copy skills as rules:
# Copy specific skills cp skills/vercel/SKILL.md .windsurf/rules/vercel.md # Or copy all skills cp skills/*/SKILL.md .windsurf/rules/ -
Windsurf automatically discovers rules in
.windsurf/rules/ -
Start building - Windsurf will use these rules contextually
🎓 What Happens After Setup?
Once you've set up your skills:
- Agent Detects Skills: Your AI agent scans the skill directories
- Agent Reads SKILL.md: It reads the name and description from frontmatter
- Agent Activates on Relevance: When you ask a question matching the description, the agent loads the skill
- Agent Follows Instructions: Your agent now has the context to help you accurately
💡 Example: Using a Vercel Skill
You have this SKILL.md:
---
name: vercel-deployment
description: Deploying applications to Vercel. Use this when asked about deploying, hosting, or managing Vercel projects.
---
You ask your agent:
"Help me deploy my React app to Vercel"
Agent automatically:
- ✅ Finds
vercel-deploymentskill - ✅ Loads SKILL.md into context
- ✅ Follows the deployment instructions
- ✅ Helps you deploy successfully!
🐛 Troubleshooting
| Problem | Solution |
|---|---|
| Agent not using skill | Restart your agent, or make sure folder path is correct |
| Skill file not found | Verify SKILL.md is in the right folder and named exactly "SKILL.md" |
| Agent using wrong skill | Make sure skill descriptions are descriptive enough to match your request |
💻 Usage (Advanced)
📐 Skill Format
Each skill follows a consistent structure:
---
name: skill-name
description: Brief description with trigger keywords
---
# Skill Title
Quick start and core patterns...
🎯 Key Principles
| Principle | Description |
|---|---|
| Concise is key | Only include what the AI doesn't already know |
| Progressive disclosure | Start with quick start, then advanced patterns |
| Concrete examples | Working code over abstract descriptions |
| Trigger keywords | Include words that activate the skill |
📁 Repository Structure
ai-agents-skills/
├── 📄 README.md
├── 📁 skills/
│ ├── 📁 meta-ads/ # 🆕 NEW!
│ │ ├── 📄 SKILL.md
│ │ ├── 📄 requirements.txt
│ │ ├── 📁 assets/
│ │ │ └── 📄 env.template
│ │ ├── 📁 references/
│ │ │ ├── 📄 setup.md
│ │ │ ├── 📄 insights-fields.md
│ │ │ ├── 📄 analysis-playbooks.md
│ │ │ ├── 📄 write-actions.md
│ │ │ └── 📄 troubleshooting.md
│ │ └── 📁 scripts/
│ │ ├── 📄 meta_client.py
│ │ ├── 📄 auth_check.py
│ │ ├── 📄 exchange_token.py
│ │ ├── 📄 list_accounts.py
│ │ ├── 📄 list_campaigns.py
│ │ ├── 📄 fetch_insights.py
│ │ ├── 📄 creative_fatigue.py
│ │ ├── 📄 anomaly_detect.py
│ │ ├── 📄 pause_ad.py
│ │ ├── 📄 update_budget.py
│ │ └── 📄 duplicate_ad.py
│ ├── 📁 google-workspace-cli/ # 🆕 NEW!
│ │ └── 📄 SKILL.md
│ ├── 📁 copilot-sdk/
│ │ └── 📄 SKILL.md
│ ├── 📁 honest-agent/
│ │ └── 📄 SKILL.md
│ ├── 📁 aws-agentcore/
│ │ └── 📄 SKILL.md
│ ├── 📁 aws-strands/
│ │ └── 📄 SKILL.md
│ ├── 📁 aws-account-management/
│ │ └── 📄 SKILL.md
│ ├── 📁 langchain/
│ │ └── 📄 SKILL.md
│ ├── 📁 vercel/
│ │ └── 📄 SKILL.md
│ ├── 📁 railway/
│ │ └── 📄 SKILL.md
│ ├── 📁 cloudflare/
│ │ └── 📄 SKILL.md
│ ├── 📁 figma/
│ │ └── 📄 SKILL.md
│ ├── 📁 fal-ai/
│ │ └── 📄 SKILL.md
│ ├── 📁 mongodb/
│ │ └── 📄 SKILL.md
│ ├── 📁 bun/
│ │ └── 📄 SKILL.md
│ ├── 📁 owasp-security/
│ │ └── 📄 SKILL.md
│ ├── 📁 shabbat-times/
│ │ └── 📄 SKILL.md
│ ├── 📁 copilot-docs/
│ │ └── 📄 SKILL.md
│ ├── 📁 nano-banana-pro/
│ │ └── 📄 SKILL.md
│ ├── 📁 github-trending/
│ │ └── 📄 SKILL.md
│ ├── 📁 ux-design-systems/
│ │ └── 📄 SKILL.md
│ ├── 📁 web-accessibility/
│ │ └── 📄 SKILL.md
│ ├── 📁 mobile-responsiveness/
│ │ └── 📄 SKILL.md
│ ├── 📁 analytics-metrics/
│ │ └── 📄 SKILL.md
│ ├── 📁 mermaid-diagrams/
│ │ └── 📄 SKILL.md
│ ├── 📁 local-llm-router/
│ │ ├── 📄 SKILL.md
│ │ └── 📁 references/
│ │ └── 📄 model-matrix.md
│ └── 📁 x-twitter-scraper/
│ └── 📄 SKILL.md
└── 📁 templates/
└── 📁 skill-template/
└── 📄 SKILL.md
🤝 Contributing
We welcome contributions! Here's how to add a new skill:
- Fork this repository
- Create a new skill in
skills/your-skill-name/SKILL.md - Follow the skill template
- Submit a pull request
Contribution Guidelines
- ✅ Include practical, production-ready code examples
- ✅ Add trigger keywords in the description
- ✅ Test all code snippets before submitting
- ✅ Keep explanations concise but complete
- ❌ Don't include basic concepts the AI already knows
- ❌ Don't use placeholder code or TODOs
🌟 Star History
If you find this repository useful, please consider giving it a ⭐!
📄 License
MIT License — Feel free to use, modify, and distribute.
Made with ❤️ by Yuval Avidani · YUV.AI
Building AI agents that ship · Let's Fly High 🚀
