WebGPU : Claude Skill Package

35 deterministic Claude AI skills for native WebGPU and WGSL: adapter/device/queue, pipelines, buffers, bind groups, the WGSL shader language, compute and render workflows, error handling. Framework-agnostic, no Three.js, TSL, or Babylon.js.

Built on the Agent Skills open standard. Discoverable via npm-agentskills manifest and OpenAI Codex skill discovery.

Why This Exists

Without skills, Claude lacks deterministic guidance for WebGPU patterns:

// Wrong: bytesPerRow must be a multiple of 256
encoder.copyTextureToBuffer(
  { texture },
  { buffer, bytesPerRow: width * 4 },   // fails validation when width*4 % 256 != 0
  [width, height]
);

With this skill package, Claude produces correct patterns:

// Correct: pad bytesPerRow up to the next 256-byte multiple
const bytesPerRow = Math.ceil((width * 4) / 256) * 256;
encoder.copyTextureToBuffer(
  { texture },
  { buffer, bytesPerRow },
  [width, height]
);
// then strip the per-row padding on the CPU after mapAsync

What's Inside

Category	Count	Purpose
core/	6	Architecture, runtime model, cross-cutting concerns
syntax/	7	Host-side JS/TS API objects and descriptors
wgsl/	8	WGSL shader language and the three shader stages
impl/	9	End-to-end rendering and compute workflows
errors/	3	Error handling, validation, debugging, recovery
agents/	2	Orchestration and code-quality validation
Total	35

See INDEX.md for the complete skill catalog with descriptions and dependency graph.

Installation

Claude Code (recommended)

# Clone the full package
git clone https://github.com/Impertio-Studio/WebGPU-Claude-Skill-Package.git
cp -r WebGPU-Claude-Skill-Package/skills/source/ ~/.claude/skills/webgpu/

As git submodule

git submodule add https://github.com/Impertio-Studio/WebGPU-Claude-Skill-Package.git .claude/skills/webgpu

Via npm-agentskills standard

npx skills add @openaec/webgpu-claude-skill-package

Claude.ai (web)

Upload individual SKILL.md files as project knowledge.

Skill Structure

Every skill follows 3-level progressive disclosure:

webgpu-{category}-{topic}/
├── SKILL.md              # Main guidance (< 500 lines)
└── references/
    ├── methods.md        # Complete API signatures
    ├── examples.md       # Working code examples
    └── anti-patterns.md  # What NOT to do (with explanations)

YAML frontmatter uses folded scalar >, "Use when..." opener, and a Keywords: line with technical + symptom-based + plain-language terms for maximum discoverability.

Quality Guarantees

• Deterministic language : ALWAYS / NEVER, no "you might consider"
• Version-explicit code : every example annotated with applicable versions
• WebFetch-verified : all code-snippets validated against official docs
• CI/CD validated : frontmatter, line count, structure, language, em-dash checks on every push
• Compliance audit : score >= 90% required for releases

Companion Skills : Cross-Technology Integration

For projects combining WebGPU with other AEC technologies, see Cross-Tech-AEC-Claude-Skill-Package.

Related Skill Packages (OpenAEC Foundation)

Package	Skills	Repo
Blender-Bonsai-ifcOpenshell-Sverchok	73	Link
Frappe	61	Link
Speckle	25	Link

See full list at OpenAEC-Foundation.

License

MIT : OpenAEC Foundation

Contributing

See CONTRIBUTING.md. Built with the Skill Package Workflow Template methodology.