スキル threejs-materials
📦

threejs-materials

コンテンツリビジョン r1 安全 ⚙️ 外部コマンド📁 ファイルシステムへのアクセス

Choose and Configure Three.js Materials

Incorrect material settings can cause dark surfaces, washed-out textures, and transparency artifacts. This skill provides material selection guidance and examples for three.js r186.

対応: Claude Codex Code(CC)
Maintain this Skill? Claim it 📊 73 十分

自分のエージェントでインストール

このリクエストをエージェントにコピーしてください。正規の Skill ページとマニフェストが含まれています。

エージェントリクエスト
Review the Skillstore skill "threejs-materials" from https://skillstore.io/skills/cloudai-x-threejs-materials.md and its manifest at https://skillstore.io/api/skills/cloudai-x-threejs-materials/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

エージェントは引き続き計画を提示し、セキュリティポリシーで必要な確認を求める必要があります。

エージェントが読めるリソース

AI エージェント、クローラー、スクリプトがページ全体ではなく整理されたコンテキストを必要とする場合は、これらのリンクを使ってください。

テストする

「threejs-materials」を使用しています。 My textured PBR model looks washed out. Which settings should I check?

期待される結果:

  • Mark color textures as sRGB, including base color and emissive maps.
  • Keep roughness, metalness, normal, and ambient occlusion maps in their default non-color space.
  • Check lighting and environment settings after correcting texture color spaces.

「threejs-materials」を使用しています。 How should I make a glass object in a product viewer?

期待される結果:

  • Use MeshPhysicalMaterial with transmission enabled, low roughness, and zero metalness.
  • Set thickness and an appropriate index of refraction.
  • Place opaque objects or a background behind the glass for refraction, and use environment lighting for reflections.

「threejs-materials」を使用しています。 My custom GLSL material does not work after switching to WebGPURenderer.

期待される結果:

  • ShaderMaterial and RawShaderMaterial do not have a direct WebGPURenderer path in this reference.
  • Use a node-material class from three/webgpu and TSL functions from three/tsl.
  • Choose an unlit node material for color-only effects, or provide lighting for a lit node material.

セキュリティ監査

安全

All 96 static findings are false positives from Markdown backticks, graphics terminology, shader functions, and the ormMap texture variable. The reviewed file provides three.js material guidance and browser rendering examples. No evidence found of prompt injection, credential access, exfiltration, shell execution, or reconnaissance.

1
スキャンされたファイル
501
解析済み行数
0
レビュー項目
0
誤検知を無視
最新の完了済み静的・セマンティック監査では、確認済みのセキュリティ検出事項は見つかりませんでした。これは、スキルに副作用がないことを証明するものではありません。
監査者: codex
このレポートを共有・引用

バージョン付き評価レポート、中立的なバッジ、埋め込みカード、引用を共有できます。Skillstore は証拠を報告しますが、この Skill が安全かどうかは判断しません。

バージョン別レポートを開く
セキュリティ評価

レポートリンクをコピー

https://skillstore.io/skills/cloudai-x-threejs-materials/audits/1?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdownバッジ

[![Skillstore security assessment](https://skillstore.io/badges/skills/cloudai-x-threejs-materials/security.svg)](https://skillstore.io/skills/cloudai-x-threejs-materials?utm_source=security_passport_badge)

HTMLバッジ

<a href="https://skillstore.io/skills/cloudai-x-threejs-materials?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/cloudai-x-threejs-materials/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

埋め込みカード

<iframe src="https://skillstore.io/embed/skills/cloudai-x-threejs-materials.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>
学術引用 (APA · BibTeX · CFF)

APA形式の引用

cloudai-x. (2026). threejs-materials security audit report (audit version 1) [Author version unspecified]. Skillstore. https://skillstore.io/skills/cloudai-x-threejs-materials/audits/1

BibTeX形式の引用

@techreport{cloudai-x-cloudai-x-threejs-materials-2026, author = {cloudai-x}, title = {threejs-materials security audit report (audit version 1)}, institution = {Skillstore}, year = {2026}, number = {1}, url = {https://skillstore.io/skills/cloudai-x-threejs-materials/audits/1}, note = {Author version unspecified} }

CITATION.cff

cff-version: 1.2.0 message: "If you use this Skill, cite its author and this versioned security audit report." title: "threejs-materials security audit report (audit version 1)" version: "unspecified" type: report authors: - name: "cloudai-x" date-released: "2026-11-07" url: "https://skillstore.io/skills/cloudai-x-threejs-materials/audits/1" identifiers: - type: other value: "skillstore:cloudai-x-threejs-materials:audit:1" description: "Skillstore immutable audit report identifier"

Skillstore スコア

このスコアの理由 証拠の信頼度: 中
55
アーキテクチャ
65
保守性
87
コンテンツ
65
コミュニティ
70
仕様準拠

作成できるもの

Configure Product Surfaces

Choose PBR materials for metal, lacquer, fabric, and glass in an interactive product viewer.

Debug Material Appearance

Review lighting, texture color spaces, UV channels, and transparency settings when a scene renders incorrectly.

Plan WebGPU Material Migration

Identify renderer compatibility limits and translate custom shading concepts into TSL node materials.

これらのプロンプトを試す

Select a Basic Material
I am using three.js r186. Recommend a material for [surface] with [lighting conditions]. Explain the choice and show a minimal example.
Configure PBR Textures
Configure MeshStandardMaterial for [model] using [available textures]. Explain color spaces, packed ORM channels, and UV selection. Assume three.js r186.
Diagnose Rendering Artifacts
Review [material and renderer setup] for [visible artifact]. Check transparency, depth writing, blending, lighting, and recompilation requirements. Propose focused fixes.
Migrate Custom Shading
Adapt [WebGL ShaderMaterial effect] to three.js r186 WebGPURenderer using TSL. Identify node slots, imports, initialization requirements, and renderer limitations.

ベストプラクティス

  • Check the project renderer and three.js version before applying examples.
  • Assign texture color spaces and UV channels according to each map's role.
  • Share materials where appropriate, prefer opaque rendering when possible, and dispose unused materials and textures separately.

回避

  • Using lit materials without lights or a suitable environment.
  • Treating scalar texture maps as sRGB color data.
  • Assuming WebGL shader materials and line-width settings transfer unchanged to WebGPU.

よくある質問

Which three.js version does this skill target?
The reference targets three.js r186. Check API compatibility before using its examples with another release.
Which material should I start with for realistic surfaces?
Start with MeshStandardMaterial. Use MeshPhysicalMaterial when you need features such as transmission, clearcoat, or sheen.
Does the skill include textures or a complete application?
No. It provides Markdown guidance and JavaScript examples. You must supply project setup, models, textures, and environment assets.
Does it cover WebGPU materials?
Yes. It includes WebGPURenderer initialization, TSL node-material examples, and compatibility notes for materials and point rendering.
Why do some surfaces render black?
Lit materials need lights or a suitable environment. Use an unlit material when the effect should not depend on lighting.
Can I use this reference with Claude, Codex, and Claude Code?
The skill lists support for all three tools. It supplies material guidance rather than installing dependencies or running rendering checks.

開発者情報

作成者

cloudai-x

ライセンス

不明

Skillstore リビジョン

r1

バージョンに関する注意

作者はバージョンを宣言していません。

参照

c993c6abcbffafea2683d7748b53b3dfaf438415

メンテナンスの新しさ

2026/11/9

利用状況

0 ダウンロード · 0 閲覧

ファイル構成

📄 SKILL.md

cloudai-x のその他のスキル

すべて表示
すべて表示