threejs-geometry

Create and manipulate 3D geometries in Three.js with buffer geometry.

Updated Feb 21, 2026
One-click install
npx skills add https://github.com/mashharuki/Re-Autonomus-World-Game --skill threejs-geometry-mashharuki
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: threejs-geometry
Source: https://github.com/mashharuki/Re-Autonomus-World-Game/tree/main/.trae/skills/threejs-geometry
Command: npx skills add https://github.com/mashharuki/Re-Autonomus-World-Game --skill threejs-geometry-mashharuki

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill addresses the challenge of creating and manipulating 3D shapes using Three.js, offering a guide for developers to efficiently handle various geometry tasks.

Core Features & Use Cases

  • Built-in Geometries: Utilize predefined shapes like boxes, spheres, planes, and more.
  • Custom Geometries: Create and work with custom geometry, including buffer geometries.
  • Advanced Geometries: Implement advanced shapes such as capsules, toruses, and dodecahedrons.
  • Path-Based Geometries: Create shapes based on curves and extrusions.
  • Text Geometry: Embed text into 3D models.
  • Performance Optimization: Learn about instanced rendering and buffer geometry for better performance.
  • Use Case: A game developer looking to create a diverse landscape for their 3D game.

Quick Start

To create a simple cube, use the BoxGeometry with default parameters.

Frequently Asked Questions about threejs-geometry

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

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

To create custom 3D geometry in Three.js, you construct and manipulate a BufferGeometry object by defining custom vertices and attributes. This approach allows you to build specialized shapes beyond the built-in options.

What is the best way to optimize Three.js mesh creation for performance?

The best way to optimize mesh creation for performance is utilizing instanced rendering and buffer geometry. These techniques allow you to render multiple identical objects efficiently without duplicating geometric data.

Can I generate text geometry in Three.js?

Yes, you can embed text into 3D models using text geometry in Three.js. This feature enables developers to render 3D typographic elements directly within their 3D scenes.

Does Three.js support path-based geometries and extrusions?

Yes, Three.js supports creating shapes based on curves and extrusions. This allows developers to generate complex 3D objects by extruding 2D paths along defined trajectories.

What built-in 3D shapes does Three.js provide for mesh creation?

Three.js provides predefined built-in geometries for mesh creation including boxes, spheres, planes, capsules, toruses, and dodecahedrons. These shapes offer ready-to-use primitives for immediate rendering.

Do I need to install Three.js to use buffer geometry for 3D shapes?

Yes, you need the Three.js library installed as a dependency to use buffer geometry and handle geometric operations. It provides the core framework required to build and manipulate 3D shapes.