skills.rest
mudman1986
mudman1986COMMUNITY
Explore all skills by this author →
GitHub

game-setup-and-config

Configures Phaser 4 game instances with GameConfig options for renderer, scaling, and FPS.

Updated Jun 10, 2026
Search Tags:#game development#pixel art#renderer#phaser#gameconfig#html5 game#scale mode
One-click install
npx skills add https://github.com/mudman1986/quarterless --skill game-setup-and-config-mudman1986
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: game-setup-and-config
Source: https://github.com/mudman1986/quarterless/tree/main/.github/skills/game-setup-and-config
Command: npx skills add https://github.com/mudman1986/quarterless --skill game-setup-and-config-mudman1986

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Setting up a new Phaser 4 game requires navigating dozens of GameConfig options across renderer selection, canvas placement, scale modes, pixel art rendering, and FPS limits, with subtle interactions (like scale sub-objects overriding top-level values) that cause silent misconfiguration. ## Core Features & Use Cases - Renderer and Boot Configuration: Choose between AUTO, CANVAS, WEBGL, and HEADLESS renderers, understand the boot sequence, and hook preBoot/postBoot callbacks. - Scaling and Pixel Art Patterns: Apply ready-made config patterns for FIT, RESIZE, and EXPAND scale modes, centering, zoom, pixelArt, and smoothPixelArt rendering. - Complete Config Reference: Look up every top-level, scale, render, and fps property with types, defaults, and v3-to-v4 migration changes. - Use Case: You are building a retro pixel-art platformer and need a 320x240 canvas scaled 2x with crisp pixels. Use this Skill to generate the correct GameConfig with pixelArt, FIT mode, and CENTER_BOTH in one step. ## Quick Start Create a Phaser 4 game config for a pixel art game at 320x240 with FIT scaling and 2x zoom.

Frequently Asked Questions about game-setup-and-config

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a new Phaser 4 game instance?▼

Create a Phaser.Game instance by passing a GameConfig object with type, width, height, and a scene class. The constructor parses the config, creates the renderer, adds the canvas to the DOM, and starts the game loop after DOMContentLoaded.

How do I configure pixel art rendering in Phaser?▼

Set pixelArt: true in the config, which automatically sets antialias to false and roundPixels to true for crisp scaled sprites. For WebGL-only smooth edges between blocky pixels, use smoothPixelArt: true instead.

What is the difference between Phaser.AUTO and Phaser.WEBGL?▼

Phaser.AUTO tries WebGL first and falls back to Canvas if unsupported, while Phaser.WEBGL forces WebGL with no fallback and fails silently if unavailable. Use AUTO unless you specifically require WebGL features.

Does Phaser scale config override top-level width and height?▼

Yes, values inside the scale sub-object take priority over top-level width, height, zoom, and parent properties. Avoid setting the same property in both places to prevent confusion.

Why does my Phaser FPS limit not reach the target frame rate?▼

The fps.limit option only caps the frame rate downward and cannot exceed the browser's display refresh rate. Setting limit: 120 on a 60Hz display still results in 60 FPS, and fps.target is advisory only.

How do I pause and destroy a Phaser game instance?▼

Call game.pause() and game.resume() to control the game loop, checking game.isPaused for state. Call game.destroy(true) to remove the canvas; destruction is asynchronous and completes on the next frame, signaled by the DESTROY event.

Related Skills

Explore More Software Engineering Skills→
Yakoub-aiYakoub-ai
17

phaser-init

Scaffold a Phaser 4 project with TypeScript and Vite configuration.

Official
Intermediate
arnaudruffinarnaudruffin

loading-assets

Load and manage Phaser 4 assets with this.load methods and preload sequencing.

Community
Intermediate
KadajettKadajett

steamdeck-controls

Integrate Steam Deck gamepad inputs into Phaser 3 HTML5 games.

Community
Intermediate
TimelessPTimelessP
2

vanilla-js-game-dev

Implement game loops, input handling, and Canvas rendering in vanilla JavaScript.

Community
Advanced