Does it support mobile devices?

Yes, the skill enforces mobile-first design pillars, including minimum 44px touch targets and responsive breakpoints for various screen sizes.

How is game progress saved?

It utilizes Zustand's persist middleware to automatically sync game state to local storage, including patterns for versioning and data migration.

What tech stack is required for this skill?

The skill is optimized for React, TypeScript, Zustand, and Tailwind CSS, utilizing the Canvas API for high-performance sprite rendering.

Can I use this for games other than idle games?

While specifically designed for idle and incremental mechanics, the procedural sprite and pixel-perfect rendering patterns work for any 2D tile-based game.

How does the procedural sprite generation work?

It uses the Canvas API with imageSmoothingEnabled set to false and specific 16x16 grid constraints to generate crisp, retro-style assets on the fly.

Pixel Art Game Builder

Name: Pixel Art Game Builder
Author: CookSaw

byCookSaw

0•

게임 개발

Architects contemplative pixel art idle and incremental games using React, TypeScript, and procedural sprite generation.

This skill provides a comprehensive framework for building minimal, 'luminous' pixel art games that prioritize atmospheric depth over high-pressure mechanics. It enforces professional design constraints such as a strict 12-color palette and 16x16 pixel sprites to ensure aesthetic consistency, while offering production-ready code for 100ms game loops, state persistence using Zustand and Immer, and procedural Canvas API rendering. Whether you are building a collection-based RPG or a complex incremental economy, this skill streamlines the transition from concept to a polished, mobile-first web game.

주요 기능

01Robust state management using Zustand and Immer with built-in persistence

02Curated 12-color 'luminous' palette with rarity-based visual effects

030 GitHub stars

04Procedural 16x16 sprite generation with pixel-perfect Canvas rendering

05Pre-configured game loop architecture with delta-time resource updates

06Ready-to-use templates for upgrades, prestige loops, and scaling formulas

사용 사례

01Creating a collection-based game featuring procedurally generated items and rarities

02Prototyping incremental game economies with exponential cost scaling

03Developing a contemplative space-themed idle game with resource management

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add cooksaw/claude-skills pixel-art-game-builder

For use in Claude.ai and ChatGPT

Download Skill