{"id":13433468,"url":"https://github.com/pmndrs/drei","last_synced_at":"2026-01-18T17:05:09.818Z","repository":{"id":37184658,"uuid":"259117468","full_name":"pmndrs/drei","owner":"pmndrs","description":"🥉 useful helpers for react-three-fiber","archived":false,"fork":false,"pushed_at":"2025-09-02T13:46:31.000Z","size":36746,"stargazers_count":9158,"open_issues_count":184,"forks_count":765,"subscribers_count":50,"default_branch":"master","last_synced_at":"2025-09-05T18:39:30.702Z","etag":null,"topics":["helpers","hooks","react","react-three-fiber","threejs"],"latest_commit_sha":null,"homepage":"https://docs.pmnd.rs/drei","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/pmndrs.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2020-04-26T19:38:41.000Z","updated_at":"2025-09-05T16:34:31.000Z","dependencies_parsed_at":"2023-09-24T02:54:28.724Z","dependency_job_id":"b7179934-ac78-4599-9812-c08efd2341b6","html_url":"https://github.com/pmndrs/drei","commit_stats":{"total_commits":1941,"total_committers":252,"mean_commits":"7.7023809523809526","dds":0.5311695002575991,"last_synced_commit":"9d60eb473576dc751bb5543f7ab5bfac69119f2f"},"previous_names":["react-spring/drei","drcmda/drei"],"tags_count":1001,"template":false,"template_full_name":null,"purl":"pkg:github/pmndrs/drei","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pmndrs%2Fdrei","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pmndrs%2Fdrei/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pmndrs%2Fdrei/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pmndrs%2Fdrei/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pmndrs","download_url":"https://codeload.github.com/pmndrs/drei/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pmndrs%2Fdrei/sbom","scorecard":{"id":154979,"data":{"date":"2025-08-04","repo":{"name":"github.com/pmndrs/drei","commit":"2eca82bc75aaaaca08ec10db375e4e31bb4589e0"},"scorecard":{"version":"v5.2.1-28-gc1d103a9","commit":"c1d103a9bb9f635ec7260bf9aa0699466fa4be0e"},"score":3.5,"checks":[{"name":"Dangerous-Workflow","score":10,"reason":"no dangerous workflow patterns detected","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#dangerous-workflow"}},{"name":"Maintained","score":10,"reason":"25 commit(s) and 2 issue activity found in the last 90 days -- score normalized to 10","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#maintained"}},{"name":"Token-Permissions","score":0,"reason":"detected GitHub workflow tokens with excessive permissions","details":["Warn: no topLevel permission defined: .github/workflows/docs.yml:1","Warn: no topLevel permission defined: .github/workflows/release.yml:1","Info: no jobLevel write permissions found"],"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#token-permissions"}},{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#packaging"}},{"name":"Code-Review","score":2,"reason":"Found 7/29 approved changesets -- score normalized to 2","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#code-review"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#cii-best-practices"}},{"name":"Binary-Artifacts","score":9,"reason":"binaries present in source code","details":["Warn: binary detected: .storybook/public/draco-gltf/draco_decoder.wasm:1"],"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#binary-artifacts"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE:0","Info: FSF or OSI recognized license: MIT License: LICENSE:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#license"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#signed-releases"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#security-policy"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'master'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#branch-protection"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#fuzzing"}},{"name":"Pinned-Dependencies","score":0,"reason":"dependency not pinned by hash detected -- score normalized to 0","details":["Warn: third-party GitHubAction not pinned by hash: .github/workflows/docs.yml:14: update your workflow using https://app.stepsecurity.io/secureworkflow/pmndrs/drei/docs.yml/master?enable=pin","Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/docs.yml:41: update your workflow using https://app.stepsecurity.io/secureworkflow/pmndrs/drei/docs.yml/master?enable=pin","Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/release.yml:26: update your workflow using https://app.stepsecurity.io/secureworkflow/pmndrs/drei/release.yml/master?enable=pin","Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/release.yml:28: update your workflow using https://app.stepsecurity.io/secureworkflow/pmndrs/drei/release.yml/master?enable=pin","Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/release.yml:39: update your workflow using https://app.stepsecurity.io/secureworkflow/pmndrs/drei/release.yml/master?enable=pin","Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/release.yml:41: update your workflow using https://app.stepsecurity.io/secureworkflow/pmndrs/drei/release.yml/master?enable=pin","Warn: npmCommand not pinned by hash: test/e2e/e2e.sh:42","Warn: npmCommand not pinned by hash: test/e2e/e2e.sh:42","Warn: npmCommand not pinned by hash: test/e2e/e2e.sh:68","Warn: npmCommand not pinned by hash: test/e2e/e2e.sh:95","Info:   0 out of   5 GitHub-owned GitHubAction dependencies pinned","Info:   0 out of   1 third-party GitHubAction dependencies pinned","Info:   0 out of   4 npmCommand dependencies pinned"],"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#pinned-dependencies"}},{"name":"SAST","score":0,"reason":"SAST tool is not run on all commits -- score normalized to 0","details":["Warn: 0 commits out of 22 are checked with a SAST tool"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#sast"}},{"name":"Vulnerabilities","score":0,"reason":"19 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-968p-4wvh-cqc8","Warn: Project is vulnerable to: GHSA-xffm-g5w8-qvg7","Warn: Project is vulnerable to: GHSA-x4c5-c7rf-jjgv","Warn: Project is vulnerable to: GHSA-h5c3-5r3r-rr8q","Warn: Project is vulnerable to: GHSA-rmvr-2pp2-xj38","Warn: Project is vulnerable to: GHSA-xx4v-prfh-6cgc","Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw","Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275","Warn: Project is vulnerable to: GHSA-67mh-4wv8-2f99","Warn: Project is vulnerable to: GHSA-78xj-cgh5-2h22","Warn: Project is vulnerable to: GHSA-2p57-rm9w-gvfp","Warn: Project is vulnerable to: GHSA-mwcw-c2x4-8c55","Warn: Project is vulnerable to: GHSA-76c9-3jph-rj3q","Warn: Project is vulnerable to: GHSA-vg6x-rcgg-rjx6","Warn: Project is vulnerable to: GHSA-x574-m823-4x7w","Warn: Project is vulnerable to: GHSA-4r4m-qw57-chr8","Warn: Project is vulnerable to: GHSA-xcj6-pq6g-qj4x","Warn: Project is vulnerable to: GHSA-356w-63v5-8wf4","Warn: Project is vulnerable to: GHSA-859w-5945-r5v3"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-08-16T11:30:46.380Z","repository_id":37184658,"created_at":"2025-08-16T11:30:46.380Z","updated_at":"2025-08-16T11:30:46.380Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":273886660,"owners_count":25185512,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-09-06T02:00:13.247Z","response_time":2576,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["helpers","hooks","react","react-three-fiber","threejs"],"created_at":"2024-07-31T02:01:26.380Z","updated_at":"2026-01-18T17:05:09.809Z","avatar_url":"https://github.com/pmndrs.png","language":"JavaScript","funding_links":[],"categories":["JavaScript","1. 框架集成（按前端框架分）","Three.js","🎨 Design \u0026 Creative","React","Assets","Features","Related Frameworks","3D","Libraries"],"sub_categories":["React","SVG Animations","React Components","GLTF \u0026 KTX2","A typical use-case","JavaScript"],"readme":"[![Storybook](https://img.shields.io/static/v1?message=Storybook\u0026style=flat\u0026colorA=000000\u0026colorB=000000\u0026label=\u0026logo=storybook\u0026logoColor=ffffff)](https://drei.pmnd.rs/)\n[![](https://img.shields.io/badge/chromatic-171c23.svg?style=flat\u0026colorA=000000\u0026colorB=000000\u0026logo=chromatic\u0026logoColor=ffffff)](https://www.chromatic.com/library?appId=64a019f36ecd3751d0ada612\u0026branch=master)\n[![Version](https://img.shields.io/npm/v/@react-three/drei?style=flat\u0026colorA=000000\u0026colorB=000000)](https://www.npmjs.com/package/@react-three/drei)\n[![Downloads](https://img.shields.io/npm/dt/@react-three/drei.svg?style=flat\u0026colorA=000000\u0026colorB=000000)](https://www.npmjs.com/package/@react-three/drei)\n[![Discord Shield](https://img.shields.io/discord/740090768164651008?style=flat\u0026colorA=000000\u0026colorB=000000\u0026label=discord\u0026logo=discord\u0026logoColor=ffffff)](https://discord.com/channels/740090768164651008/741751532592038022)\n[![Open in GitHub Codespaces](https://img.shields.io/static/v1?\u0026message=Open%20in%20%20Codespaces\u0026style=flat\u0026colorA=000000\u0026colorB=000000\u0026label=GitHub\u0026logo=github\u0026logoColor=ffffff)](https://github.com/codespaces/new?template_repository=pmndrs%2Fdrei)\n\n[![logo](docs/logo.jpg)](https://codesandbox.io/s/bfplr)\n\nA growing collection of useful helpers and fully functional, ready-made abstractions for [@react-three/fiber](https://github.com/pmndrs/react-three-fiber).\n\nIf you make a component that is generic enough to be useful to others, think about [CONTRIBUTING](CONTRIBUTING.md)!\n\n```bash\nnpm install @react-three/drei\n```\n\n\u003e [!IMPORTANT]\n\u003e this package is using the stand-alone [`three-stdlib`](https://github.com/pmndrs/three-stdlib) instead of [`three/examples/jsm`](https://github.com/mrdoob/three.js/tree/master/examples/jsm).\n\n## Basic usage\n\n```jsx\nimport { PerspectiveCamera, PositionalAudio, ... } from '@react-three/drei'\n```\n\n## React-native\n\n```jsx\nimport { PerspectiveCamera, PositionalAudio, ... } from '@react-three/drei/native'\n```\n\nThe `native` route of the library **does not** export `Html` or `Loader`. The default export of the library is `web` which **does** export `Html` and `Loader`.\n\n## Documentation\n\nhttps://pmndrs.github.io/drei\n\n\u003cdetails\u003e\n  \u003csummary\u003eOld doc\u003c/summary\u003e\n\n\u003e [!WARNING]\n\u003e Below is an archive of the anchors links with their new respective locations to the documentation website.\n\u003e Do not update the links below, they are for reference only.\n\n\u003c!-- \u003ctable\u003e\n  \u003ctr\u003e\n    \u003ctd valign=\"top\"\u003e\n      \u003cul\u003e\n        \u003cli\u003e\u003ca href=\"#cameras\"\u003eCameras\u003c/a\u003e\u003c/li\u003e\n        \u003cul\u003e\n          \u003cli\u003e\u003ca href=\"#perspectivecamera\"\u003ePerspectiveCamera\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#orthographiccamera\"\u003eOrthographicCamera\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#cubecamera\"\u003eCubeCamera\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n        \u003cli\u003e\u003ca href=\"#controls\"\u003eControls\u003c/a\u003e\u003c/li\u003e\n        \u003cul\u003e\n          \u003cli\u003e\u003ca href=\"#cameracontrols\"\u003eCameraControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#controls\"\u003eFlyControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#controls\"\u003eMapControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#controls\"\u003eDeviceOrientationControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#controls\"\u003eTrackballControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#controls\"\u003eArcballControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#controls\"\u003ePointerLockControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#controls\"\u003eFirstPersonControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#scrollcontrols\"\u003eScrollControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#presentationcontrols\"\u003ePresentationControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#keyboardcontrols\"\u003eKeyboardControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#FaceControls\"\u003eFaceControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#motionpathcontrols\"\u003eMotionPathControls\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n        \u003cli\u003e\u003ca href=\"#gizmos\"\u003eGizmos\u003c/a\u003e\u003c/li\u003e\n        \u003cul\u003e\n          \u003cli\u003e\u003ca href=\"#gizmohelper\"\u003eGizmoHelper\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#pivotcontrols\"\u003ePivotControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#dragcontrols\"\u003eDragControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#transformcontrols\"\u003eTransformControls\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#grid\"\u003eGrid\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#helper--usehelper\"\u003eHelper / useHelper\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#helper\"\u003eHelper\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n        \u003cli\u003e\u003ca href=\"#abstractions\"\u003eAbstractions\u003c/a\u003e\u003c/li\u003e\n        \u003cul\u003e\n          \u003cli\u003e\u003ca href=\"#image\"\u003eImage\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#text\"\u003eText\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#text3d\"\u003eText3D\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#positionalaudio\"\u003ePositionalAudio\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#billboard\"\u003eBillboard\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#screenspace\"\u003eScreenSpace\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#screensizer\"\u003eScreenSizer\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#effects\"\u003eEffects\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#gradienttexture\"\u003eGradientTexture\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#edges\"\u003eEdges\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#outlines\"\u003eOutlines\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#trail\"\u003eTrail\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#sampler\"\u003eSampler\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#computedattribute\"\u003eComputedAttribute\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#clone\"\u003eClone\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#useanimations\"\u003euseAnimations\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#marchingcubes\"\u003eMarchingCubes\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#decal\"\u003eDecal\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#svg\"\u003eSvg\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#gltf\"\u003eGltf\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#asciirenderer\"\u003eAsciiRenderer\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#splat\"\u003eSplat\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n        \u003cli\u003e\u003ca href=\"#shaders\"\u003eShaders\u003c/a\u003e\u003c/li\u003e\n        \u003cul\u003e\n          \u003cli\u003e\u003ca href=\"#meshreflectormaterial\"\u003eMeshReflectorMaterial\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#meshwobblematerial\"\u003eMeshWobbleMaterial\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#meshdistortmaterial\"\u003eMeshDistortMaterial\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#meshrefractionmaterial\"\u003eMeshRefractionMaterial\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#meshtransmissionmaterial\"\u003eMeshTransmissionMaterial\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#meshdiscardmaterial\"\u003eMeshDiscardMaterial\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#pointmaterial\"\u003ePointMaterial\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#softshadows\"\u003eSoftShadows\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shadermaterial\"\u003eshaderMaterial\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n      \u003c/ul\u003e\n    \u003c/td\u003e\n    \u003ctd valign=\"top\"\u003e\n      \u003cul\u003e\n        \u003cli\u003e\u003ca href=\"#misc\"\u003eMisc\u003c/a\u003e\u003c/li\u003e\n        \u003cul\u003e\n          \u003cli\u003e\u003ca href=\"#example\"\u003eExample\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#html\"\u003eHtml\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#cycleraycast\"\u003eCycleRaycast\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#select\"\u003eSelect\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#sprite-animator\"\u003eSprite Animator\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#stats\"\u003eStats\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#stats-gl\"\u003eStatsGl\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#wireframe\"\u003eWireframe\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#usedepthbuffer\"\u003euseDepthBuffer\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#usecontextbridge\"\u003euseContextBridge\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#fbo--usefbo\"\u003eFbo / useFBO\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#usecamera\"\u003euseCamera\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#cubecamera--usecubecamera\"\u003eCubeCamera / useCubeCamera\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#detectgpu--usedetectgpu\"\u003eDetectGPU / useDetectGPU\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#useaspect\"\u003euseAspect\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#usecursor\"\u003euseCursor\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#useintersect\"\u003euseIntersect\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#useboxprojectedenv\"\u003euseBoxProjectedEnv\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#trail--useTrail\"\u003eTrail / useTrail\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#useSurfaceSampler\"\u003euseSurfaceSampler\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#facelandmarker\"\u003eFaceLandmarker\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n        \u003cli\u003e\u003ca href=\"#loading\"\u003eLoaders\u003c/a\u003e\u003c/li\u003e\n        \u003cul\u003e\n          \u003cli\u003e\u003ca href=\"#loader\"\u003eLoader\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#progress--useprogress\"\u003eProgress / useProgress\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#gltf--usegltf\"\u003eGltf / useGLTF\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#fbx--usefbx\"\u003eFBX / useFBX\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#texture--usetexture\"\u003eTexture / useTexture\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#ktx2--usektx2\"\u003eKtx2 / useKTX2\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#cubetexture--usecubetexture\"\u003eCubeTexture / useCubeTexture\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#videotexture--usevideotexture\"\u003eVideoTexture / useVideoTexture\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#trailtexture--usetrailtexture\"\u003eTrailTexture / useTrailTexture\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#usefont\"\u003euseFont\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#usespriteloader\"\u003euseSpriteLoader\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n        \u003cli\u003e\u003ca href=\"#performance\"\u003ePerformance\u003c/a\u003e\u003c/li\u003e\n        \u003cul\u003e\n          \u003cli\u003e\u003ca href=\"#instances\"\u003eInstances\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#merged\"\u003eMerged\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#points\"\u003ePoints\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#segments\"\u003eSegments\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#detailed\"\u003eDetailed\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#preload\"\u003ePreload\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#bakeshadows\"\u003eBakeShadows\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#meshbounds\"\u003emeshBounds\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#adaptivedpr\"\u003eAdaptiveDpr\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#adaptiveevents\"\u003eAdaptiveEvents\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#bvh\"\u003eBvh\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#performancemonitor\"\u003ePerformanceMonitor\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n        \u003cli\u003e\u003ca href=\"#portals\"\u003ePortals\u003c/a\u003e\u003c/li\u003e\n        \u003cul\u003e\n          \u003cli\u003e\u003ca href=\"#hud\"\u003eHud\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#view\"\u003eView\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#rendertexture\"\u003eRenderTexture\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#rendercubetexture\"\u003eRenderCubeTexture\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#fisheye\"\u003eFisheye\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#mask\"\u003eMask\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#meshportalmaterial\"\u003eMeshPortalMaterial\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n        \u003cli\u003e\u003ca href=\"#modifiers\"\u003eModifiers\u003c/a\u003e\u003c/li\u003e\n        \u003cul\u003e\n          \u003cli\u003e\u003ca href=\"#curvemodifier\"\u003eCurveModifier\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n      \u003c/ul\u003e\n    \u003c/td\u003e\n    \u003ctd valign=\"top\"\u003e\n      \u003cul\u003e\n        \u003cli\u003e\u003ca href=\"#shapes\"\u003eShapes\u003c/a\u003e\u003c/li\u003e\n        \u003cul\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003ePlane\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eBox\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eSphere\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eCircle\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eCone\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eCylinder\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eTube\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eTorus\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eTorusKnot\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eRing\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eTetrahedron\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003ePolyhedron\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eIcosahedron\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eOctahedron\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eDodecahedron\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eExtrude\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eLathe\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shapes\"\u003eShape\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#roundedbox\"\u003eRoundedBox\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#screenquad\"\u003eScreenquad\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#line\"\u003eLine\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#quadraticbezierline\"\u003eQuadraticBezierLine\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#cubicbezierline\"\u003eCubicBezierLine\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#catmullromline\"\u003eCatmullRomLine\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#facemesh\"\u003eFacemesh\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n        \u003cli\u003e\u003ca href=\"#staging\"\u003eStaging\u003c/a\u003e\u003c/li\u003e\n        \u003cul\u003e\n          \u003cli\u003e\u003ca href=\"#center\"\u003eCenter\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#resize\"\u003eResize\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#BBAnchor\"\u003eBBAnchor\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#bounds\"\u003eBounds\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#camerashake\"\u003eCameraShake\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#float\"\u003eFloat\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#stage\"\u003eStage\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#backdrop\"\u003eBackdrop\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#environment\"\u003eEnvironment\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#lightformer\"\u003eLightformer\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#spotlight\"\u003eSpotLight\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#spotlightshadow\"\u003eSpotLightShadow\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shadow\"\u003eShadow\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#caustics\"\u003eCaustics\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#contactshadows\"\u003eContactShadows\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#randomizedlight\"\u003eRandomizedLight\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#accumulativeshadows\"\u003eAccumulativeShadows\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#sky\"\u003eSky\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#stars\"\u003eStars\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#sparkles\"\u003eSparkles\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#cloud\"\u003eCloud\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#useenvironment\"\u003euseEnvironment\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#matcaptexture--usematcaptexture\"\u003eMatcapTexture / useMatcapTexture\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#normaltexture--usenormaltexture\"\u003eNormalTexture / useNormalTexture\u003c/a\u003e\u003c/li\u003e\n          \u003cli\u003e\u003ca href=\"#shadowalpha\"\u003eShadowAlpha\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n      \u003c/ul\u003e\n    \u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e --\u003e\n\n### Cameras\n\n#### PerspectiveCamera\n\n[Documentation has moved here](https://pmndrs.github.io/drei/cameras/perspective-camera)\n\n#### OrthographicCamera\n\n[Documentation has moved here](https://pmndrs.github.io/drei/cameras/orthographic-camera)\n\n#### CubeCamera\n\n[Documentation has moved here](https://pmndrs.github.io/drei/cameras/cube-camera)\n\n### Controls\n\n#### CameraControls\n\n[Documentation has moved here](https://pmndrs.github.io/drei/controls/camera-controls)\n\n#### ScrollControls\n\n[Documentation has moved here](https://pmndrs.github.io/drei/controls/scroll-controls)\n\n#### PresentationControls\n\n[Documentation has moved here](https://pmndrs.github.io/drei/controls/presentation-controls)\n\n#### KeyboardControls\n\n[Documentation has moved here](https://pmndrs.github.io/drei/controls/keyboard-controls)\n\n#### FaceControls\n\n[Documentation has moved here](https://pmndrs.github.io/drei/controls/face-controls)\n\n#### MotionPathControls\n\n[Documentation has moved here](https://pmndrs.github.io/drei/controls/motion-path-controls)\n\n### Gizmos\n\n#### GizmoHelper\n\n[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/gizmo-helper)\n\n#### PivotControls\n\n[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/pivot-controls)\n\n#### DragControls\n\n[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/drag-controls)\n\n#### TransformControls\n\n[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/transform-controls)\n\n#### Grid\n\n[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/grid)\n\n#### Helper / useHelper\n\n[Documentation has moved here](https://pmndrs.github.io/drei/gizmos/helper-use-helper)\n\n### Shapes\n\n#### Plane, Box, Sphere, Circle, Cone, Cylinder, Tube, Torus, TorusKnot, Ring, Tetrahedron, Polyhedron, Icosahedron, Octahedron, Dodecahedron, Extrude, Lathe, Shape\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shapes/mesh)\n\n#### RoundedBox\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shapes/rounded-box)\n\n#### ScreenQuad\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shapes/screen-quad)\n\n#### Line\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shapes/line)\n\n#### QuadraticBezierLine\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shapes/quadratic-bezier-line)\n\n#### CubicBezierLine\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shapes/cubic-bezier-line)\n\n#### CatmullRomLine\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shapes/catmull-rom-line)\n\n#### Facemesh\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shapes/facemesh)\n\n### Abstractions\n\n#### Image\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/image)\n\n#### Text\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/text)\n\n#### Text3D\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/text3d)\n\n#### Effects\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/effects)\n\n#### PositionalAudio\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/positional-audio)\n\n#### Billboard\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/billboard)\n\n#### ScreenSpace\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/screen-space)\n\n#### ScreenSizer\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/screen-sizer)\n\n#### GradientTexture\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/gradient-texture)\n\n#### Edges\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/edges)\n\n#### Outlines\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/outlines)\n\n#### Trail\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/trail)\n\n#### Sampler\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/sampler)\n\n#### ComputedAttribute\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/computed-attribute)\n\n#### Clone\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/clone)\n\n#### useAnimations\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/use-animations)\n\n#### MarchingCubes\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/marching-cubes)\n\n#### Decal\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/decal)\n\n#### Svg\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/svg)\n\n#### AsciiRenderer\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/ascii-renderer)\n\n#### Splat\n\n[Documentation has moved here](https://pmndrs.github.io/drei/abstractions/splat)\n\n### Shaders\n\n#### MeshReflectorMaterial\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-reflector-material)\n\n#### MeshWobbleMaterial\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-wobble-material)\n\n#### MeshDistortMaterial\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-distort-material)\n\n#### MeshRefractionMaterial\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-refraction-material)\n\n#### MeshTransmissionMaterial\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-transmission-material)\n\n#### MeshDiscardMaterial\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shaders/mesh-discard-material)\n\n#### PointMaterial\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shaders/point-material)\n\n#### SoftShadows\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shaders/soft-shadows)\n\n#### shaderMaterial\n\n[Documentation has moved here](https://pmndrs.github.io/drei/shaders/shader-material)\n\n### Modifiers\n\n#### CurveModifier\n\n[Documentation has moved here](https://pmndrs.github.io/drei/modifiers/curve-modifier)\n\n### Misc\n\n#### useContextBridge\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-context-bridge)\n\n#### Example\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/example)\n\n#### Html\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/html)\n\n#### CycleRaycast\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/cycle-raycast)\n\n#### Select\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/select)\n\n#### Sprite Animator\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/sprite-animator)\n\n#### Stats\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/stats)\n\n#### StatsGl\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/stats-gl)\n\n#### Wireframe\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/wireframe)\n\n#### useDepthBuffer\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-depth-buffer)\n\n#### Fbo / useFBO\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/fbo-use-fbo)\n\n#### useCamera\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-camera)\n\n#### CubeCamera / useCubeCamera\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/cube-camera-use-cube-camera)\n\n#### DetectGPU / useDetectGPU\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/detect-gpu-use-detect-gpu)\n\n#### useAspect\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-aspect)\n\n#### useCursor\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-cursor)\n\n#### useIntersect\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-intersect)\n\n#### useBoxProjectedEnv\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-box-projected-env)\n\n#### Trail / useTrail\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/trail-use-trail)\n\n#### useSurfaceSampler\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/use-surface-sampler)\n\n#### FaceLandmarker\n\n[Documentation has moved here](https://pmndrs.github.io/drei/misc/face-landmarker)\n\n### Loading\n\n#### Loader\n\n[Documentation has moved here](https://pmndrs.github.io/drei/loaders/loader)\n\n#### Progress / useProgress\n\n[Documentation has moved here](https://pmndrs.github.io/drei/loaders/progress-use-progress)\n\n#### Gltf / useGLTF\n\n[Documentation has moved here](https://pmndrs.github.io/drei/loaders/gltf-use-gltf)\n\n#### Fbx / useFBX\n\n[Documentation has moved here](https://pmndrs.github.io/drei/loaders/fbx-use-fbx)\n\n#### Texture / useTexture\n\n[Documentation has moved here](https://pmndrs.github.io/drei/loaders/texture-use-texture)\n\n#### Ktx2 / useKTX2\n\n[Documentation has moved here](https://pmndrs.github.io/drei/loaders/ktx2-use-ktx2)\n\n#### CubeTexture / useCubeTexture\n\n[Documentation has moved here](https://pmndrs.github.io/drei/loaders/cube-texture-use-cube-texture)\n\n#### VideoTexture / useVideoTexture\n\n[Documentation has moved here](https://pmndrs.github.io/drei/loaders/video-texture-use-video-texture)\n\n#### TrailTexture / useTrailTexture\n\n[Documentation has moved here](https://pmndrs.github.io/drei/loaders/trail-texture-use-trail-texture)\n\n#### useFont\n\n[Documentation has moved here](https://pmndrs.github.io/drei/loaders/use-font)\n\n#### useSpriteLoader\n\n[Documentation has moved here](https://pmndrs.github.io/drei/loaders/use-sprite-loader)\n\n### Performance\n\n#### Instances\n\n[Documentation has moved here](https://pmndrs.github.io/drei/performances/instances)\n\n#### Merged\n\n[Documentation has moved here](https://pmndrs.github.io/drei/performances/merged)\n\n#### Points\n\n[Documentation has moved here](https://pmndrs.github.io/drei/performances/points)\n\n#### Segments\n\n[Documentation has moved here](https://pmndrs.github.io/drei/performances/segments)\n\n#### Detailed\n\n[Documentation has moved here](https://pmndrs.github.io/drei/performances/detailed)\n\n#### Preload\n\n[Documentation has moved here](https://pmndrs.github.io/drei/performances/preload)\n\n#### BakeShadows\n\n[Documentation has moved here](https://pmndrs.github.io/drei/performances/bake-shadows)\n\n#### meshBounds\n\n[Documentation has moved here](https://pmndrs.github.io/drei/performances/mesh-bounds)\n\n#### AdaptiveDpr\n\n[Documentation has moved here](https://pmndrs.github.io/drei/performances/adaptive-dpr)\n\n#### AdaptiveEvents\n\n[Documentation has moved here](https://pmndrs.github.io/drei/performances/adaptive-events)\n\n#### Bvh\n\n[Documentation has moved here](https://pmndrs.github.io/drei/performances/bvh)\n\n#### PerformanceMonitor\n\n[Documentation has moved here](https://pmndrs.github.io/drei/performances/performance-monitor)\n\n### Portals\n\n#### Hud\n\n[Documentation has moved here](https://pmndrs.github.io/drei/portals/hud)\n\n#### View\n\n[Documentation has moved here](https://pmndrs.github.io/drei/portals/view)\n\n#### RenderTexture\n\n[Documentation has moved here](https://pmndrs.github.io/drei/portals/render-texture)\n\n#### RenderCubeTexture\n\n[Documentation has moved here](https://pmndrs.github.io/drei/portals/render-cube-texture)\n\n#### Fisheye\n\n[Documentation has moved here](https://pmndrs.github.io/drei/portals/fisheye)\n\n#### Mask\n\n[Documentation has moved here](https://pmndrs.github.io/drei/portals/mask)\n\n#### MeshPortalMaterial\n\n[Documentation has moved here](https://pmndrs.github.io/drei/portals/mesh-portal-material)\n\n### Staging\n\n#### Center\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/center)\n\n#### Resize\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/resize)\n\n#### BBAnchor\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/bb-anchor)\n\n#### Bounds\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/bounds)\n\n#### CameraShake\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/camera-shake)\n\n#### Float\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/float)\n\n#### Stage\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/stage)\n\n#### Backdrop\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/backdrop)\n\n#### Shadow\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/shadow)\n\n#### Caustics\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/caustics)\n\n#### ContactShadows\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/contact-shadows)\n\n#### RandomizedLight\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/randomized-light)\n\n#### AccumulativeShadows\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/accumulative-shadows)\n\n#### SpotLight\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/spot-light)\n\n#### SpotLightShadow\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/spot-light-shadow)\n\n#### Environment\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/environment)\n\n#### Lightformer\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/lightformer)\n\n#### Sky\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/sky)\n\n#### Stars\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/stars)\n\n#### Sparkles\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/sparkles)\n\n#### Cloud\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/cloud)\n\n#### useEnvironment\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/use-environment)\n\n#### MatcapTexture / useMatcapTexture\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/matcap-texture-use-matcap-texture)\n\n#### NormalTexture / useNormalTexture\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/normal-texture-use-normal-texture)\n\n#### ShadowAlpha\n\n[Documentation has moved here](https://pmndrs.github.io/drei/staging/shadow-alpha)\n\n\u003c/details\u003e\n\n## Dev\n\n### INSTALL\n\nPre-requisites:\n\n- Install [nvm](https://github.com/nvm-sh/nvm), then:\n  ```sh\n  $ nvm install\n  $ nvm use\n  $ node -v # make sure your version satisfies package.json#engines.node\n  ```\n  nb: if you want this node version to be your default nvm's one: `nvm alias default node`\n- Install yarn, with:\n  ```sh\n  $ corepack enable\n  $ corepack prepare --activate # it reads \"packageManager\"\n  $ yarn -v # make sure your version satisfies package.json#engines.yarn\n  ```\n\n```sh\n$ yarn install\n```\n\n### Test\n\n#### Local\n\nPre-requisites:\n\n- ```sh\n  $ npx playwright install\n  ```\n\nTo run visual tests locally:\n\n```sh\n$ yarn build\n$ yarn test\n```\n\nTo update a snapshot:\n\n```sh\n$ PLAYWRIGHT_UPDATE_SNAPSHOTS=1 yarn test\n```\n\n#### Docker\n\n\u003e [!IMPORTANT]\n\u003e Snapshots are system-dependent, so to run playwright in the same environment as the CI:\n\n```sh\n$ docker run --init --rm \\\n    -v $(pwd):/app -w /app \\\n    ghcr.io/pmndrs/playwright:drei \\\n      sh -c \"corepack enable \u0026\u0026 yarn install \u0026\u0026 yarn build \u0026\u0026 yarn test\"\n```\n\nTo update a snapshot:\n\n```sh\n$ docker run --init --rm \\\n    -v $(pwd):/app -w /app \\\n    -e PLAYWRIGHT_UPDATE_SNAPSHOTS=1 \\\n    ghcr.io/pmndrs/playwright:drei \\\n      sh -c \"corepack enable \u0026\u0026 yarn install \u0026\u0026 yarn build \u0026\u0026 yarn test\"\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpmndrs%2Fdrei","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpmndrs%2Fdrei","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpmndrs%2Fdrei/lists"}