Community Plugin

web-graphics

Production-ready 3D web graphics toolkit. Four specialized skills for Three.js (WebGPU), React Three Fiber, asset pipeline optimization, and graphics troubleshooting. Includes decision frameworks, scenario patterns, and 2026 best practices.

2.0.0

Updated 2 months ago

AI Insight

Production-ready 3D web graphics toolkit with specialized skills for Three.js (WebGPU), React Three Fiber, asset pipeline optimization, and graphics troubleshooting.

Why this plugin

Provides expert guidance for modern 3D web development with decision frameworks, scenario patterns, and 2026 best practices. Solves complex graphics implementation challenges with optimized workflows.

Prerequisites

Three.js or React Three Fiber project, WebGL/WebGPU compatible browser, Node.js for build tools, potential API keys for cloud services.

3d graphics

web development

visualization

Install

Add the repository(one-time)

/plugin marketplace add anthemflynn/dwc

Install the plugin

/plugin install web-graphics@dwc

Components

Skills

asset-pipeline-3d

inherits

6 assets

Optimize and prepare 3D assets for web delivery. Use this skill when working with GLTF/GLB files, compressing 3D models, optimizing textures, setting up Blender exports, or preparing assets for Three.js/R3F. Covers GLTF workflows, Draco/meshopt compression, texture optimization, LOD generation, and performance profiling.

graphics-troubleshooting

inherits

3 assets

Debug and fix common issues in Three.js, React Three Fiber, and 3D asset pipelines. Use when encountering visual bugs, performance problems, loading failures, or unexpected behavior. Covers black screens, Z-fighting, memory leaks, shader errors, and physics glitches.

react-three-fiber

inherits

4 assets

Build 3D applications with React Three Fiber (R3F), the React renderer for Three.js. Use this skill when building 3D scenes with React, using declarative JSX for 3D objects, integrating Three.js with React state/lifecycle, or using Drei helpers. Covers Canvas setup, hooks, Drei utilities, performance patterns, and state management for 3D React apps.

threejs

inherits

6 assets

Create 3D graphics, visualizations, and interactive experiences using Three.js. Use this skill when the user asks to build 3D scenes, WebGL/WebGPU applications, 3D data visualizations, interactive 3D components, games, or any browser-based 3D content. Covers scene setup, geometries, materials, lighting, cameras, animations, controls, shaders (TSL), and performance optimization.

Stats

Stars3

Installs3

MaintenanceFair

Last Commit2 months ago

Community Promotion

Collections

Links

View on GitHub

View README

Plugin Marketplace JSON

Similar Plugins

prompts.chat

149.6k

214

Access thousands of AI prompts and skills directly in your AI coding assistant. Search prompts, discover skills, save your own, and improve prompts with AI.

v1.0.0

plugin-dev

73.8k

Comprehensive toolkit for developing Claude Code plugins. Includes 7 expert skills covering hooks, MCP integration, commands, agents, and best practices. AI-assisted plugin creation and validation.

3mo

v0.1.0

context7-plugin

47.0k

Upstash Context7 MCP server for up-to-date documentation lookup. Pull version-specific documentation and code examples directly from source repositories into your LLM context.

1mo

v@upstash/context7-mcp@2.1.2

payload

41.0k

Payload Development plugin - covers collections, fields, hooks, access control, plugins, and database adapters.

2mo

v0.0.1