Use this skill first for ANY PixiJS v8 task; it routes to the right specialized skill for the job. Covers the full PixiJS surface: Application setup, the scene graph (Container, Sprite, Graphics, Text, Mesh, ParticleContainer, DOMContainer, GifSprite), rendering (WebGL/WebGPU/Canvas, render loop, custom shaders, filters, blend modes), assets, events, color, math, ticker, accessibility, performance, environments, migration from v7, and project scaffolding. Triggers on: pixi, pixi.js, pixijs, PixiJS, v8, Application, app.init, Sprite, Container, Graphics, Text, Mesh, ParticleContainer, DOMContainer, GifSprite, Assets, Ticker, renderer, WebGL, WebGPU, scene graph, filter, shader, blend mode, texture, BitmapText, create-pixi, how do I draw, how do I render, how do I animate in pixi.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
실행 점수 미검증
설치 방법 보기설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.
Entry point for the PixiJS v8 skill collection. PixiJS is the fastest library available for the web, working across all devices and allowing you to create rich, interactive graphics and cross-platform applications using WebGL, WebGPU, and Canvas as a fallback.
SKILL.md and follow its guidance.https://pixijs.download/release/docs/llms.txt. That file is the auto-generated, always-current index of the full PixiJS API and guides. Each entry links to a .html.md page you can WebFetch for the detailed content.For the long-form description and trigger keywords of every skill, see references/index.md.
| Skill | Load when... |
|---|---|
| pixijs-application | Creating or configuring a PixiJS Application, calling app.init(), accessing app.stage/renderer/canvas/screen, resize/ticker plugins, app.destroy(). |
| pixijs-core-concepts | Understanding the renderer pipeline, choosing WebGL/WebGPU/Canvas, render loop internals, systems and pipes, renderer loader extensions, rendering into a RenderTexture/RenderTarget (flipY, mipLevel, bind/push/pop, depth), WebGL context loss and WebGPU device loss. |
| pixijs-create | Scaffolding a new project with the create-pixi CLI (bundler-vite, creation-web, framework-react templates), adding PixiJS to an existing project, or setting up tsconfig.json for TypeScript 5, 6, or 7 (moduleResolution, @webgpu/types, @types/web). |
| pixijs-environments | Running PixiJS in Web Workers, Node/SSR, or strict-CSP contexts (DOMAdapter, WebWorkerAdapter, pixi.js/unsafe-eval). |
| pixijs-migration-v8 | Upgrading from v7 to v8 or fixing v7 patterns (beginFill/endFill, @pixi/* packages, BaseTexture, DisplayObject). |
| pixijs-scene-core-concepts | Understanding the scene graph as a whole: containers vs leaves, transforms, render order, masking, RenderLayer. |
| Skill | Load when... |
|---|---|
| pixijs-scene-container | Working with Container: addChild/removeChild, transforms, zIndex, bounds, toGlobal/toLocal, destroy. |
| pixijs-scene-sprite | Drawing images: Sprite, AnimatedSprite, NineSliceSprite, TilingSprite. |
| pixijs-scene-graphics | Drawing vector shapes or paths: Graphics, GraphicsContext, fill/stroke, FillGradient, FillPattern, textureSpace, texture and pattern fills, SVG import (svg(), gradients). |
| pixijs-scene-text | Rendering text: Text, BitmapText, HTMLText, SplitText, TextStyle. |
| pixijs-scene-mesh | Custom geometry: Mesh, MeshSimple, MeshPlane, MeshRope, PerspectiveMesh. |
| pixijs-scene-particle-container | Rendering thousands of lightweight sprites: ParticleContainer, Particle, dynamicProperties. |
| pixijs-scene-dom-container | Overlaying HTML elements on the canvas: DOMContainer, pixi.js/dom. |
| pixijs-scene-gif | Displaying animated GIFs: GifSprite, GifSource, pixi.js/gif. |
| pixijs-html-source | Rendering live HTML/DOM elements or snapshots as textures (experimental, needs a browser that supports the HTML-in-Canvas spec): HTMLSource, ElementImageSource, pixi.js/html-source, requestPaint. |
| Skill | Load when... |
|---|---|
| pixijs-assets | Loading resources: Assets.init, Assets.load, bundles, manifests, spritesheets, caching. |
| pixijs-color | Creating or converting colors: Color class, hex/rgb/hsl, tint, premultiply. |
| pixijs-events | Handling pointer/mouse/touch/wheel input: eventMode, FederatedEvent, hitArea, cursor, drag. |
| pixijs-math | Points, vectors, matrices, shapes, hit testing: Point, Matrix, Rectangle, Polygon, Triangle, strokeContains, containsRect, Matrix.decompose (mirrored matrices), toGlobal/toLocal. |
| pixijs-ticker | Per-frame logic or controlling the render loop: Ticker, deltaTime, UPDATE_PRIORITY, maxFPS. |
| Skill | Load when... |
|---|---|
| pixijs-accessibility | Screen reader or keyboard navigation: AccessibilitySystem, accessibleTitle, tabIndex. |
| pixijs-blend-modes | Compositing with blend modes: add, multiply, screen, overlay, pixi.js/advanced-blend-modes. |
| pixijs-custom-rendering | Writing custom shaders, uniforms, or batchers: Shader.from, GlProgram/GpuProgram, UniformGroup, custom Filter, WGSL override constants, gpuLayout, TextureView, Buffer.update, TexturePool, render bundles, custom pipes. |
| pixijs-filters | Applying visual effects: BlurFilter, ColorMatrixFilter, DisplacementFilter, Filter.from, pixi-filters. |
| pixijs-performance | Profiling or optimizing FPS, draw calls, GPU memory: culling, GCSystem, cacheAsTexture, object pooling, transient MSAA render textures, render bundles, filter texture sizing. |
If the task references a class, function, option, or API surface not covered by any sub-skill above, WebFetch https://pixijs.download/release/docs/llms.txt. It's the auto-generated index of the full PixiJS API and guides, regenerated on every release. Each entry links to a .html.md page you can WebFetch for the detailed content. Use this fallback whenever the router table doesn't point at an obvious match.
아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.
로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.
아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.
Add a second game to the monorepo (apps/<game>) from the seed game, wired to the gate. Load when asked to create a new game / app / prototype in this repo.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
End-to-end tests of a game with Playwright (apps/*/e2e/*.e2e.ts) on a WebGL canvas, and taking screenshots of the running game. Load before writing or debugging an e2e test, or to look at the game in a browser.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
How a game of this seed is organized (apps/<game>/src) and how to add gameplay with PixiJS v8 without breaking the strict gate. Load before editing apps/*/src or apps/*/tests.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Use this skill when adding screen reader and keyboard navigation to PixiJS v8 apps. Covers AccessibilitySystem options (enabledByDefault, debug, activateOnTab, deactivateOnMouseMove), per-container accessibility properties, shadow DOM overlay, mobile touch-hook activation. Triggers on: accessibility, a11y, screen reader, ARIA, keyboard navigation, tab order, AccessibilitySystem, accessibleTitle, accessibleHint, tabIndex, accessibleChildren.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Use this skill when creating and configuring a PixiJS v8 Application. Covers new Application() + async app.init() options (width, height, background, antialias, resolution, autoDensity, preference, resizeTo, autoStart, sharedTicker, canvas, useBackBuffer, powerPreference, eventFeatures, accessibilityOptions, gcActive, bezierSmoothness, webgl/webgpu/canvasOptions per-renderer overrides), app.stage/renderer/canvas/screen/domContainerRoot access, ResizePlugin, TickerPlugin, CullerPlugin (cullable, cullArea), custom ApplicationPlugin via ExtensionType.Application, start/stop lifecycle, and app.destroy() with releaseGlobalResources. Triggers on: Application, app.init, app.stage, app.renderer, app.canvas, app.screen, app.domContainerRoot, ApplicationOptions, ApplicationPlugin, ExtensionType.Application, resizeTo, sharedTicker, skipExtensionImports, preferWebGLVersion, preserveDrawingBuffer, cullable, CullerPlugin, app.start, app.stop, app.destroy, releaseGlobalResources.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Use this skill when loading and managing resources in PixiJS v8. Covers Assets.init, Assets.load/add/unload, bundles, manifests, background loading, onProgress, caching, spritesheets, video textures, web fonts, bitmap fonts, animated GIFs, compressed textures, SVG as texture or Graphics, resolution detection, per-asset data options, and forcing a specific loader with the parser field (for extension-less URLs). Triggers on: Assets, Assets.load, Assets.init, loadBundle, manifest, backgroundLoad, Spritesheet, Cache, LoadOptions, unload, parser, loadParser, loadWebFont, loadBitmapFont, loadVideoTextures, GifSource, VideoSourceOptions.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.