Threejs Architecture Effects

Build or refine real Three.js architectural construction animations, especially Chinese pavilions, pagodas and clock towers with brick-by-brick growth, timber framing, layered eaves, procedural PBR materials and interactive detail cameras. Use for 3D建筑生长、古建搭建特效、楼台逐层建造、建筑动态组装 or similar architectural miniatures; not for flat image reveals or generic website styling.

670 stars 71 forksSoftware Development

Install

skills CLI (Claude Code, Cursor, Codex and more)

npx skills add lhlGitHub/threejs-architecture-effects --skill threejs-architecture-effects

Manual install

git clone --depth 1 https://github.com/lhlGitHub/threejs-architecture-effects.git /tmp/threejs-architecture-effects
mkdir -p ~/.claude/skills
cp -r /tmp/threejs-architecture-effects/. ~/.claude/skills/threejs-architecture-effects

Personal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.

From the SKILL.md

# Three.js Architecture Effects

Create an actual, orbitable 3D building assembled from solid components. The included clock-tower miniature is a working reference, not a mandatory design or a historical reconstruction.

Resolve `<this-skill-dir>` from the loaded `SKILL.md`. Do not mix files from a different install of this skill.

## References

| File | Read it when |
| --- | --- |
| [references/template-guide.md](references/template-guide.md) | scaffolding a new project or mapping starter files |
| [references/construction-principles.md](references/construction-principles.md) | geometry, assembly timing, materials, or lighting |
| [references/verification.md](references/verification.md) | stutter, quality checks, metrics, or handoff |

## Choose the starting point

- **Existing project:** inspect its scene owner, geometry factories, timing, materials, controls, and renderer diagnostics before editing. Preserve its recognizable design, cameras, and interactions unless the user asks to change them. Do not scaffold over it.
- **New project:** read the template guide, then run `node <this-skill-dir>/scripts/scaffold.mjs <new-project-directory>`. The script refuses an existing destination. It copies a self-contained Vite/React/Three.js starter; it does not install packages or start services.

Read the full skill on GitHub

Details

Skill name: threejs-architecture-effects
Repository: lhlGitHub/threejs-architecture-effects
License: MIT
Repo updated: 22 September 2026

FAQ

What does the Threejs Architecture Effects skill do?

How do I install the Threejs Architecture Effects skill?

skills CLI (Claude Code, Cursor, Codex and more): npx skills add lhlGitHub/threejs-architecture-effects --skill threejs-architecture-effects. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.

Is Threejs Architecture Effects popular?

It lives in lhlGitHub/threejs-architecture-effects, which has 670 GitHub stars and 71 forks.

Related skills

Rust Skills

660

leonardomso/rust-skills

Comprehensive Rust coding guidelines with 265 rules across 26 categories. Use when writing, reviewing, or refactoring Rust code. Covers ownership, error handling, async patterns, concurrency, unsafe code, API design, memory optimization, performance, numeric safety, conversions, serde, pattern matching, macros, closures, observability, testing, and common anti-patterns. Invoke with /rust-skills.

Software Development71

Jules

448

sanjay3290/ai-skills

Delegate coding tasks to Google Jules AI agent for asynchronous execution. Use when user says: 'have Jules fix', 'delegate to Jules', 'send to Jules', 'ask Jules to', 'check Jules sessions', 'pull Jules results', 'jules add tests', 'jules add docs', 'jules review pr'. Handles: bug fixes, documentation, features, tests, refactoring, code reviews. Works with GitHub repos, creates PRs.

Software DevelopmentIn 4 lists49

Codex Fable5

439

baskduf/FableCodex

Apply a Claude Fable 5 inspired operating style inside Codex. Use when the user asks to make Codex act like Fable, Fable5, fablize, or Value-for-Fable/VFF; convert Anthropic or Claude system-prompt/tool instructions to Codex; set up a Fable-style tool-first workflow with goal gates, investigation, verification grounding, cost-aware routing, or 2-pass review; create Codex AGENTS.md guidance from Fable-like behavior; or connect Codex to an authorized Fable-compatible provider through an OpenAI-compatible gateway.

Software DevelopmentIn 1 list59

Beautiful Feishu Whiteboard

780

zarazhangrui/beautiful-feishu-whiteboard

A library of 35 curated colour palette styles for building beautiful, editable Feishu / Lark (飞书) whiteboards from SVG. Use this whenever the user wants to create or draw a Feishu whiteboard, infographic, diagram, poster, or visual explainer and wants it to look polished, on brand, or in a particular aesthetic, or when they name a style. The agent figures out what board the user wants, asks about the visual vibe, picks a fitting style from the catalogue, generates an editable Feishu whiteboard, returns the doc link and the rendered image, and offers to switch styles. Requires lark-cli (npm @la

Software Development52

Library

432

disler/the-library

Private skill distribution system. Use when the user wants to install, use, add, push, remove, sync, list, or search for skills, agents, or prompts from their private library catalog. Triggers on /library commands or mentions of library, skill distribution, or agentic management.

Software Development236

Hue

855

dominikmartn/hue

Meta-skill that generates new design language skills. Works on Claude Code and Codex. Use when the user says 'create a design skill', 'generate design language', 'new design system skill', 'design skill inspired by X', 'design skill from this screenshot', '/hue', or 'use hue'. Also triggers for 'remix my design skill' or 'make my skill more X'.

Software Development68

Browse the most popular Claude skills, all software development skills, or write your own with the skills generator.