angular-3d-scene-crafter git:20261025.e12e11bA

Immutable. This exact content never changes and is served at /api/v1/blob/f616105bd3e87159.

---
name: angular-3d-scene-crafter
description: 'Designs Angular 3D scenes with @hive-academy/angular-3d, including in-scene motion and animation tuning. Use for 3D hero sections, particle effects, lighting and materials, or a scene from a reference. Also load angular-gsap-animation-crafter for scroll-timeline page motion when the task has both, and angular-frontend-patterns for component structure. Non-Angular 3D work is outside this skill.'
---

# Angular 3D Scene Crafter

## Rules

- Before generating scene code, check the project's `package.json` for `@hive-academy/angular-3d`; install it or confirm the intended version if absent.
- For a reference image, map observed color, lighting, material, geometry, depth, and effects to components before building the scene.
- For a written brief, choose a scene composition and build camera, objects, materials, lights, motion, and effects incrementally before presenting the complete Angular component.
- Use existing scene assets as opt-in starting drafts; adapt their documented values to the user's design.

## Load on demand

- [Image workflow](references/image-workflow.md): load when recreating a reference image or screenshot.
- [Text workflow](references/text-workflow.md): load when the user describes a scene without a reference image.
- [Scene templates](references/templates.md): load when a ready-to-use scene asset matches the requested aesthetic.
- [Component catalog](references/components.md): load when selecting primitives, directives, services, or exact inputs.
- [Composition patterns](references/patterns.md): load when choosing or combining scene layouts.
- [Best practices](references/best-practices.md): load when tuning colors, materials, lights, animation, or effects.