pixijs

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.

Safety Notice

This listing is imported from skills.sh public index metadata. Review upstream SKILL.md and repository scripts before running.

Copy this and send it to your AI assistant to learn

Install skill "pixijs" with this command: npx skills add pixijs/pixijs-skills/pixijs-pixijs-skills-pixijs

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.

How to use this skill

  1. Find the specialized skill in the router below that best matches the task.
  2. Load that skill's SKILL.md and follow its guidance.
  3. If no sub-skill fits (the task references a specific class, function, option, or API surface not listed below), WebFetch 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 router

Foundations

SkillLoad when...
pixijs-applicationCreating or configuring a PixiJS Application, calling app.init(), accessing app.stage/renderer/canvas/screen, resize/ticker plugins, app.destroy().
pixijs-core-conceptsUnderstanding the renderer pipeline, choosing WebGL/WebGPU/Canvas, render loop internals, systems and pipes.
pixijs-createScaffolding a new project with the create-pixi CLI (bundler-vite, creation-web, framework-react templates).
pixijs-environmentsRunning PixiJS in Web Workers, Node/SSR, or strict-CSP contexts (DOMAdapter, WebWorkerAdapter, pixi.js/unsafe-eval).
pixijs-migration-v8Upgrading from v7 to v8 or fixing v7 patterns (beginFill/endFill, @pixi/* packages, BaseTexture, DisplayObject).
pixijs-scene-core-conceptsUnderstanding the scene graph as a whole: containers vs leaves, transforms, render order, masking, RenderLayer.

Scene Objects

SkillLoad when...
pixijs-scene-containerWorking with Container: addChild/removeChild, transforms, zIndex, bounds, toGlobal/toLocal, destroy.
pixijs-scene-spriteDrawing images: Sprite, AnimatedSprite, NineSliceSprite, TilingSprite.
pixijs-scene-graphicsDrawing vector shapes or paths: Graphics, GraphicsContext, fill/stroke, FillGradient, SVG.
pixijs-scene-textRendering text: Text, BitmapText, HTMLText, SplitText, TextStyle.
pixijs-scene-meshCustom geometry: Mesh, MeshSimple, MeshPlane, MeshRope, PerspectiveMesh.
pixijs-scene-particle-containerRendering thousands of lightweight sprites: ParticleContainer, Particle, dynamicProperties.
pixijs-scene-dom-containerOverlaying HTML elements on the canvas: DOMContainer, pixi.js/dom.
pixijs-scene-gifDisplaying animated GIFs: GifSprite, GifSource, pixi.js/gif.

Utilities

SkillLoad when...
pixijs-assetsLoading resources: Assets.init, Assets.load, bundles, manifests, spritesheets, caching.
pixijs-colorCreating or converting colors: Color class, hex/rgb/hsl, tint, premultiply.
pixijs-eventsHandling pointer/mouse/touch/wheel input: eventMode, FederatedEvent, hitArea, cursor, drag.
pixijs-mathPoints, vectors, matrices, shapes, hit testing: Point, Matrix, Rectangle, toGlobal/toLocal.
pixijs-tickerPer-frame logic or controlling the render loop: Ticker, deltaTime, UPDATE_PRIORITY, maxFPS.

Advanced

SkillLoad when...
pixijs-accessibilityScreen reader or keyboard navigation: AccessibilitySystem, accessibleTitle, tabIndex.
pixijs-blend-modesCompositing with blend modes: add, multiply, screen, overlay, pixi.js/advanced-blend-modes.
pixijs-custom-renderingWriting custom shaders, uniforms, or batchers: Shader.from, GlProgram/GpuProgram, UniformGroup, custom Filter.
pixijs-filtersApplying visual effects: BlurFilter, ColorMatrixFilter, DisplacementFilter, Filter.from, pixi-filters.
pixijs-performanceProfiling or optimizing FPS, draw calls, GPU memory: culling, GCSystem, cacheAsTexture, object pooling.

Fallback: canonical PixiJS docs

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.

Source Transparency

This detail page is rendered from real SKILL.md content. Trust labels are metadata-based hints, not a safety guarantee.

Related Skills

Related by shared tags or category signals.

General

newton-quotation-pdf-extraction

从PDF报价单中提取产品信息(型号、数量、价格、币种、图片)。当用户需要从PDF报价单或产品目录中提取结构化产品数据时使用,特别适用于电商产品列表或价格表。

Archived SourceRecently Updated
General

kami-package-detection

A free skill by Kami SmartHome. Get notified the moment a package arrives at your door. Detects packages, parcels, and bags from RTSP camera streams using AI vision.

Archived SourceRecently Updated
General

amoeba-management-analysis

阿米巴经营分析技能。基于稻盛和夫阿米巴经营理念,提供单位时间核算、经营会计报表分析、阿米巴组织划分评估、业绩改善诊断等能力。 当用户需要做阿米巴经营分析、单位时间核算、经营会计、阿米巴组织划分、利润中心分析、内部交易定价、业绩评价时触发。 触发词:阿米巴、阿米巴经营、单位时间核算、经营会计、利润中心、内部交易、阿米巴划分、巴长、稻盛和夫、京瓷会计学

Archived SourceRecently Updated
General

bigmodel-image-video

使用 BigModel (CogView/CogVideoX) API 生成高质量图片和视频。当用户需要"生成图片"、"制作视频"、"AI 绘画"、"创建封面"、"设计海报"、"视觉内容生成"、或任何需要创建图像/视频内容的场景时使用此技能。即使没有明确提到"生成",只要用户需要创建、设计或制作视觉内容(如小说封面、产品图片、宣传图、短视频等),都应该主动使用此技能。

Archived SourceRecently Updated