skills.rest
linegel
linegelCOMMUNITY
Explore all skills by this author →
Website𝕏@linege1GitHub

threejs-procedural-buildings-and-cities

Generate Three.js WebGPU building geometries with grammatical massing and TSL NodeMaterials.

5|1|Updated Jul 4, 2026
Search Tags:#architectural design#three.js#WebGPU#procedural generation#material optimization
One-click install
npx skills add https://github.com/linegel/threejs-complete-set-of-skill --skill threejs-procedural-buildings-and-cities
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: threejs-procedural-buildings-and-cities
Source: https://github.com/linegel/threejs-complete-set-of-skill/tree/main/threejs-procedural-buildings-and-cities
Command: npx skills add https://github.com/linegel/threejs-complete-set-of-skill --skill threejs-procedural-buildings-and-cities

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires threejs, three/tsl, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill solves the challenge of building realistic and procedural Three.js WebGPU buildings with precise facade placement and optimized materials. It provides the automation required to create and integrate diverse structures with efficiency.

Core Features & Use Cases

  • Grammatical Massing: Use a language-defined grammatical framework for creating 3D buildings procedurally.
  • Facade Assembly: Generate and assemble detailed building facades and roof designs based on predefined patterns and configurations.
  • Material Compilation: Optimize building geometry into compact slot geometries and use TSL NodeMaterial for realistic textures.
  • Use Case: Build complex buildings, including financial towers and ruins, from their fundamental geometric blocks while applying material-specific NodeMaterial.

Quick Start

To build a tower from scratch using a grammar definition and materials from your own 'material-slots/' folder, use:

create_building_with_materials my_building.json 'my_material_slot_set' hero qualityTier

Frequently Asked Questions about threejs-procedural-buildings-and-cities

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

FAQPage Schema
How do I procedurally generate 3D buildings in Three.js using WebGPU?▼

To procedurally generate 3D buildings in Three.js, this Skill applies grammatical massing frameworks and facade assembly alongside TSL NodeMaterials. It compiles diverse structures like financial towers from fundamental geometric blocks using WebGPU-based rendering.

What is grammatical massing for procedural architectural design?▼

Grammatical massing is a language-defined framework for creating 3D buildings procedurally. It allows you to architecturally design complex structures from fundamental geometric blocks while applying material-specific TSL NodeMaterials for optimized facade placement.

Do I need to know Three.js TSL to use procedural facade assembly?▼

Yes, procedural facade assembly requires knowledge of architectural grammatical frameworks and Three.js TSL. You must use TSL NodeMaterials to compile optimized building geometries into compact slot geometries for realistic textures.

Can I use my own custom materials for procedural building generation?▼

Yes, you can use custom materials for procedural building generation by supplying your own 'material-slots/' folder. The system compiles building geometry into compact slot geometries and applies your material-specific TSL NodeMaterials for realistic textures.

How do I build a complex 3D tower from scratch using grammar definitions?▼

To build a 3D tower from scratch, execute the create_building_with_materials command with your JSON grammar definition and material slot set. This automates massing, facade assembly, and material compilation to output the final structure.

Related Skills

Explore More Software Engineering Skills→
linegellinegel
5

threejs-procedural-creatures

Generates and animates procedural creatures in Three.js using WebGPU and TSL with a JSON spec file.

Community
Advanced
mmdonohuemmdonohue
1

threejs-geometry

Create and optimize Three.js geometries with BufferGeometry and InstancedMesh.

Community
Intermediate
linegellinegel
5

threejs-procedural-materials

Design procedural Three.js materials for terrain using WebGPU and TSL.

Community
Advanced
pedropaulovcpedropaulovc
6

developing-kcl

Write, modify, and debug KCL code for parametric 3D CAD modeling.

Community
Advanced