Sylad

Avatar Pandora — Design skill for Claude Code

Design community

Eywa — Codex visuel de Pandora (univers Avatar de James Cameron) offert en cadeau à ma nièce.

How to install Avatar Pandora

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

What Avatar Pandora does

Eywa — Codex visuel de Pandora (univers Avatar de James Cameron) offert en cadeau à ma nièce. Astro 6 + R3F + GSAP + Tailwind 4. 100% codé en pair-programming avec Claude Code, contenu en français, déploiement Cloudflare Pages.

Alternatives in Design

CloudCLI — 8,400+ Free open-source web/mobile UI for Claude Code, Cursor CLI, and Codex 8.7k ★
Pair — Fuse two extracted designs into a single hybrid identity 3.6k ★
Companion — 2,200+ Web & mobile UI for Claude Code & Codex 2.2k ★

README

Eywa — Codex de Pandora

[![Built with Claude Code](https://img.shields.io/badge/Built%20with-Claude%20Code-D97757?logo=anthropic&logoColor=white)](https://claude.com/claude-code) [![Reviewed with Codex](https://img.shields.io/badge/Reviewed%20with-Codex-111827?logo=openai&logoColor=white)](https://openai.com/codex) [![Astro 6](https://img.shields.io/badge/Astro-6-FF5D01?logo=astro&logoColor=white)](https://astro.build) [![Three.js](https://img.shields.io/badge/Three.js-R3F-000000?logo=three.js&logoColor=white)](https://r3f.docs.pmnd.rs) [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](LICENSE)

*« Je te vois. »*

Un codex visuel de l'univers Avatar (Pandora, clans Na'vi, faune, flore, langue, films), construit comme cadeau pour ma nièce Eva, fan absolue de l'œuvre de James Cameron.

**Code et contenu construits en pair-programming avec [Claude Code](https://claude.com/claude-code), puis relus et ajustés avec Codex.** Direction artistique humaine, implémentation assistée, aucune IA au runtime. Voir [HOW-IT-WORKS.md](./HOW-IT-WORKS.md) pour le détail : site entièrement statique, fiches du codex pré-rédigées à build-time.

🌐 **Live** : [https://avatar-pandora-12q.pages.dev](https://avatar-pandora-12q.pages.dev) — accessible partout dans le monde via Cloudflare Pages.

![Landing — EYWA logo et Hometree en fond, particules bioluminescentes](docs/screenshots/01-landing-banshee.png)

Le site est aussi un labo perso : 4ᵉ projet où j'explore des stacks que je ne croise pas dans mon métier de dev Java côté serveur. Ici, c'est WebGL (R3F + Three.js), animations GSAP, et le paradigme islands d'Astro.

Aperçu

Page d'accueil — landing à viewport unique : logo Eywa (le V caché du W recompose le prénom Eva de la dédicataire) + définition d'Eywa cliquable + tagline + 2 CTAs. En fond, six images de Pandora se cross-fadent en boucle de 75 s (Pandora globe → Banshee → Hometree → Hallelujah → Metkayina → Fire & Ash), pendant qu'un champ de p