# Claudedesignskills

> 22-skill package across 5 bundles covering Three.js, GSAP ScrollTrigger, React Three Fiber, Framer Motion, Babylon.js, A-Frame, PixiJS, Locomotive Scroll, Barba.js, React Spring, Magic UI, AOS, Anime.js, Lottie, Rive, Spline, and Blender pipeline. The broadest motion/creative suite available.

- Skill: `podo/claudedesignskills` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds add podo/claudedesignskills`
- Raw SKILL.md: https://api.skillmd.com/api/skills/podo/claudedesignskills/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: podo (https://skillmd.com/u/podo)
- Updated: 2026-09-09
- Page: https://skillmd.com/skills/podo/claudedesignskills

---


# claudedesignskills

> Catalogue stub — full package: [freshtechbro/claudedesignskills](https://github.com/freshtechbro/claudedesignskills)

## Decision tree

1. **Is the package already installed?**
   Check: your agent's skills directory contains `claudedesignskills` with content beyond this stub.
   - Yes → invoke `claudedesignskills` and proceed
   - No → go to step 2

2. **Which agent are you on?**
   - Claude Code → `/plugin marketplace add freshtechbro/claudedesignskills`
   - Cursor → `/plugin marketplace add freshtechbro/claudedesignskills`
   - Other → `/plugin marketplace add freshtechbro/claudedesignskills` or see [GitHub README](https://github.com/freshtechbro/claudedesignskills)

## Install command

```bash
/plugin marketplace add freshtechbro/claudedesignskills
```

## Invoke after install

- Skill name: `claudedesignskills`
- Trigger phrases: "claudedesignskills", "Babylon.js", "A-Frame", "PixiJS", "React Spring", "Locomotive Scroll", "Rive"

## What it does

The broadest motion and creative coding skill suite available — 22 individual skills organised across 5 bundles. Covers: Three.js 3D scenes, GSAP ScrollTrigger, React Three Fiber, Framer Motion, Babylon.js game/XR rendering, A-Frame WebXR, PixiJS 2D WebGL, Locomotive Scroll smooth scrolling, Barba.js page transitions, React Spring physics-based animation, Magic UI component animations, AOS (Animate On Scroll), Anime.js, Lottie playback, Rive interactive animation, Spline 3D, and a Blender-to-web pipeline. Use this package when a project spans multiple animation frameworks or when you're unsure which toolchain will be needed.

## When NOT to use

- When you only need one framework — use its dedicated skill instead (`gsap-skills`, `framer-motion-skills`, etc.) for a lighter footprint
- Backend or non-visual work