isometric-character-sprites — Claude Code skill: 8-direction sprites
A skill that walks the agent through generating one isometric character in eight facing directions with a shared feet-anchor, so walking frames do not slide or sort wrong.
npx skills add 0xheycat/isometric-game-skills --skill isometric-character-sprites -a claude-codeWhat isometric-character-sprites does
The skill lays out a fixed sequence. Art direction and character height in pixels get locked first, then the same character is produced in eight directions (S, SW, W, NW, N, NE, E, SE) on a plain backdrop. Height line and feet baseline stay the same in every frame. Any direction that drifts in size or style is regenerated at the same seed and settings.
Alpha gets cleaned with transparent-cutout-cleanup, and the feet-anchor is defined the same way for all directions: bottom-center. To test, cycle the directions in place — the feet must not jump between frames.
Four directions will not cut it for isometric art: diagonal movement with only four reads as broken, which is why the skill insists on eight. Even a 3px height drift looks like bobbing, so the baseline has to be aligned tightly.
What it helps with
- generate one character in eight directions without height jumps
- align the feet-anchor so the sprite stops sliding while walking
- clean the transparent cutout after generation with
transparent-cutout-cleanup - spot style drift between angles and regenerate the offending frame
Example prompts for the agent
- Generate an isometric character in 8 directions with the same height and feet-anchor
- The sprite slides when walking — check that the feet-anchor matches across all directions
- Regenerate the NW direction, it is off in size compared to the others
How to install isometric-character-sprites
1Skills CLI (Vercel)
npx skills add 0xheycat/isometric-game-skills --skill isometric-character-sprites -a claude-code2Manually: put the files in place
~/.claude/skills/isometric-character-sprites/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/isometric-character-sprites/
1Skills CLI (Vercel)
npx skills add 0xheycat/isometric-game-skills --skill isometric-character-sprites -a codex2Manually: put the files in place
.agents/skills/isometric-character-sprites/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add 0xheycat/isometric-game-skills --skill isometric-character-sprites -a cursor2Manually: put the files in place
.cursor/skills/isometric-character-sprites/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install 0xheycat/isometric-game-skills isometric-character-sprites2Manually: put the files in place
.github/skills/isometric-character-sprites/SKILL.md1Skills CLI (Vercel)
npx skills add 0xheycat/isometric-game-skills --skill isometric-character-sprites -a gemini-cli2Platform CLI
gemini skills install https://github.com/0xheycat/isometric-game-skills --path skills/isometric-character-spritesManually: put the files in place
.devin/skills/isometric-character-sprites/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add 0xheycat/isometric-game-skills --skill isometric-character-sprites -a opencodeClaude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
Step by step, with commands for each platform: How to install skills in Claude Code: five ways
Questions about isometric-character-sprites
How do I install isometric-character-sprites in Claude Code?
Run npx skills add 0xheycat/isometric-game-skills --skill isometric-character-sprites -a claude-code. The skill file lands at ~/.claude/skills/isometric-character-sprites/SKILL.md.
What does isometric-character-sprites do?
It gives the agent a step-by-step process for producing an isometric character in eight directions with a fixed feet-anchor, keeping movement and depth sorting correct.
Why eight directions instead of four?
By the skill's reasoning, diagonal movement in isometric view looks broken with four directions, so it asks for the full set of eight.
Source text
SKILL.md · MIT
--- name: isometric-character-sprites description: Use when generating isometric characters in consistent 8 directions with a fixed feet-anchor for movement and depth sorting. license: MIT --- # Isometric Character Sprites  ## Overview Characters move, so they need consistent proportions across 8 facing directions and a fixed feet-anchor (where the character touches the ground). Without this, characters appear to slide, jitter, or sort incorrectly when walking. ## When to Use - You need a player or NPC that faces multiple directions. - Characters change size or proportion between directions. - Movement looks like the sprite is sliding or floating. ## Process 1. Lock art direction and character height in pixels. 2. Generate the same character in 8 directions (S, SW, W, NW, N, NE, E, SE) on a plain background. 3. Keep proportions identical - same height line and feet baseline across all 8. 4. Fix seed/settings; regenerate any direction that drifts in size or style. 5. Clean alpha with `transparent-cutout-cleanup`. 6. Define the feet-anchor (bottom-center) identically for every direction. 7. Test by cycling directions in place - the feet must not jump between frames. ## Rationalizations (Stop Lying to Yourself) | Excuse | Reality | |---|---| | "4 directions is enough" | Diagonal movement looks broken with 4 directions in iso. Do 8. | | "Slight height differences are fine" | A 3px height drift reads as bobbing. Align the baseline. | ## Red Flags - STOP if you catch yourself: - Inconsistent character height across directions. - Feet-anchor differs per direction so the sprite slides. - Only front-facing direction exists. ## Verification You are NOT done until every box is checked: - [ ] 8 consistent directions exist for the character. - [ ] Feet-anchor is identical across all directions. - [ ] Cycling directions in place shows no jump or slide.
© 0xheycat · MIT · 0xheycat/isometric-game-skills