autotiling-transitions — Claude Code skill: terrain transitions
A coding-agent skill that sets the rule for picking transition tiles where grass, water and sand meet. Useful when a map reads as a checkerboard of hard seams.
npx skills add 0xheycat/isometric-game-skills --skill autotiling-transitions -a claude-codeWhat autotiling-transitions does
The skill walks through blending two terrain types with automatic edge and corner tiles. You start by naming the base terrains and their priority order, say water below sand below grass. Then you author the transition set for each pair — 16 or 47 tiles — and compute a neighbor bitmask per cell across sides and corners. The bitmask maps to a tile index via bitmask = N*1 + E*2 + S*4 + W*8, and that tile renders on top of the lower-priority base.
A verification checklist ships with it: a full transition set per terrain pair, every bitmask case rendered on a test map, and a cache for the bitmask-to-tile lookup. Skip the cache and the per-cell lookup costs you at runtime; the skill calls that out as a red flag. Two more stop signs are checkerboard seams between terrains and missing corner tiles — corners need their own tiles or gaps show up.
The skill does not draw tiles for you. You author the transition set yourself; the skill supplies the rule your code follows to choose a tile. Hand-placing edges across a large map is not supported: hundreds of seams by hand is unmaintainable.
What it helps with
- remove hard seams where grass meets water
- author a transition tile set for a terrain pair
- compute a neighbor bitmask and pick the matching tile
- fill corners with transition tiles so no gaps appear
- cache the bitmask-to-tile lookup for speed
Example prompts for the agent
- Set up autotiling between grass and water, priority water < sand < grass
- Compute the neighbor bitmask for each cell and swap in the right transition tile
- Render all 16 bitmask cases on a test map and check them
How to install autotiling-transitions
1Skills CLI (Vercel)
npx skills add 0xheycat/isometric-game-skills --skill autotiling-transitions -a claude-code2Manually: put the files in place
~/.claude/skills/autotiling-transitions/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/autotiling-transitions/
1Skills CLI (Vercel)
npx skills add 0xheycat/isometric-game-skills --skill autotiling-transitions -a codex2Manually: put the files in place
.agents/skills/autotiling-transitions/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add 0xheycat/isometric-game-skills --skill autotiling-transitions -a cursor2Manually: put the files in place
.cursor/skills/autotiling-transitions/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install 0xheycat/isometric-game-skills autotiling-transitions2Manually: put the files in place
.github/skills/autotiling-transitions/SKILL.md1Skills CLI (Vercel)
npx skills add 0xheycat/isometric-game-skills --skill autotiling-transitions -a gemini-cli2Platform CLI
gemini skills install https://github.com/0xheycat/isometric-game-skills --path skills/autotiling-transitionsManually: put the files in place
.devin/skills/autotiling-transitions/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add 0xheycat/isometric-game-skills --skill autotiling-transitions -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 autotiling-transitions
How do I install autotiling-transitions in Claude Code?
Run npx skills add 0xheycat/isometric-game-skills --skill autotiling-transitions -a claude-code. The skill lands in ~/.claude/skills/autotiling-transitions/SKILL.md.
What does autotiling-transitions do?
It defines how your code picks a transition tile between two terrain types from a neighbor bitmask. It also carries a verification checklist for a test map.
How is it different from placing edge tiles by hand?
Placing edges by hand across a large map is unmaintainable — hundreds of seams. The skill gives one repeatable rule your code applies to choose each tile.
Source text
SKILL.md · MIT
--- name: autotiling-transitions description: Use when making different terrain types (grass, water, sand) blend with automatic edge and corner transition tiles instead of hard seams. license: MIT --- # Autotiling & Edge Transitions  ## Overview Hard edges between grass and water look like a checkerboard. Autotiling picks the correct edge/corner transition tile based on a bitmask of neighbors. This skill defines the transition set and the bitmask rule. ## When to Use - Two terrain types meet and the seam looks harsh. - You want maps to look hand-blended without hand-placing every edge. - You need a repeatable rule for which transition tile to use. ## Process 1. Define the base terrains and their priority order (e.g. water < sand < grass). 2. Author the 16-tile (or 47-tile) transition set for each terrain pair. 3. For each cell, compute a neighbor bitmask (N, E, S, W and corners). 4. Map the bitmask to the correct transition tile index. 5. Render the transition tile on top of the lower-priority base. 6. Verify all 16 bitmask cases visually with a test map. 7. Cache the bitmask->tile lookup for performance. ```text bitmask = N*1 + E*2 + S*4 + W*8 -> transitionTile[bitmask] ``` ## Rationalizations (Stop Lying to Yourself) | Excuse | Reality | |---|---| | "I will hand-place edge tiles" | Hundreds of edges by hand is unmaintainable. Use a bitmask rule. | | "One generic edge tile is enough" | Corners need their own tiles or you get gaps. Author the full set. | ## Red Flags - STOP if you catch yourself: - Hard checkerboard seams between terrains. - Missing corner transition tiles. - Bitmask computed but never cached (slow). ## Verification You are NOT done until every box is checked: - [ ] A complete transition set exists per terrain pair. - [ ] All bitmask cases render correctly on a test map. - [ ] The bitmask->tile lookup is cached.
© 0xheycat · MIT · 0xheycat/isometric-game-skills