threejs-geometry

Generate and customize 3D shapes using Three.js core functionality.

Updated May 31, 2026
One-click install
npx skills add https://github.com/fanguyun/SkillManager --skill threejs-geometry-fanguyun
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: threejs-geometry
Source: https://github.com/fanguyun/SkillManager/tree/main/threejs-geometry
Command: npx skills add https://github.com/fanguyun/SkillManager --skill threejs-geometry-fanguyun

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires three, and includes scripts (resource) components.

What problem does it solve?

This Skill provides an all-in-one solution for generating various 3D shapes in the Three.js framework, offering built-in geometries, advanced customization options, and path-based shapes, which significantly streamlines 3D modeling tasks.

Core Features & Use Cases

  • Built-In Geometries: Generate basic shapes like cubes, spheres, and cylinders directly with a single command.
  • Advanced Geometries: Customize geometries with options such as radial segments, height segments, and detail levels for intricate shapes.
  • Path-Based Geometries: Use mathematical curves to generate unique shapes.
  • BufferGeometry: Offers fine control for performance and custom data manipulation, perfect for high-fidelity and dynamic geometry requirements.
  • Quick Start: Learn to create a simple sphere in under five minutes.

Quick Start

Import the required module, create a geometry object using Three.js built-in functions, apply a material to the geometry, and add the result to the scene. Example: const geometry = new THREE.SphereGeometry(0.5, 32, 32);

Frequently Asked Questions about threejs-geometry

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create 3D shapes in Three.js?

You create 3D shapes in Three.js by importing the required module, instantiating a geometry object like SphereGeometry, applying a material, and adding the mesh to your scene. This Skill provides utilities to generate basic and advanced geometries with a single command.

What is BufferGeometry used for in Three.js?

BufferGeometry in Three.js offers fine control for performance and custom data manipulation. It is perfect for high-fidelity and dynamic geometry requirements, allowing efficient rendering and direct manipulation of vertex data.

Can I generate custom 3D geometry from mathematical curves in Three.js?

Yes, you can generate custom 3D geometry from mathematical curves using path-based geometries. This Skill supports using mathematical curves to generate unique shapes, suitable for both rapid prototyping and advanced 3D art.

Does Three.js support geometry instancing and morph targets?

Yes, Three.js supports geometry instancing and morph targets. This Skill offers features for BufferGeometry manipulation, geometry instancing, and support for morph targets and texture coordinates within the Three.js ecosystem.

How do I customize basic 3D shapes like spheres and cylinders in Three.js?

You customize basic 3D shapes in Three.js by adjusting advanced geometry options such as radial segments, height segments, and detail levels. This allows you to generate intricate shapes from basic primitives like cubes and cylinders.

Do I need the Three.js core library to use these geometry utilities?

Yes, you need the Three.js core library. This Skill depends on Three.js core functionality to render geometry efficiently and provides an all-in-one solution for generating, modifying, and visualizing 3D shapes.