1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[4487],{366:function(e,t,o){(window.__NEXT_P=window.__NEXT_P||[]).push(["/download",function(){return o(1754)}])},1754:function(e,t,o){"use strict";o.r(t),o.d(t,{__toc:function(){return m},default:function(){return x}});var r=o(813),n=o(9824),i=o(2115),a=o(3755),s=o(3524),d=o.n(s),l=o(5568),c=o(382);let p={apple:(0,r.jsx)("object",{"aria-label":"macOS",className:"pointer-events-none h-10 w-10",data:"/logos/mac.svg",role:"img",type:"image/svg+xml"}),linux:(0,r.jsx)(d(),{alt:"Linux",height:40,src:"/logos/linux.png",width:40}),vscode:(0,r.jsx)(d(),{alt:"Visual Studio Code",height:40,priority:!0,src:"/logos/vscode.svg",width:40}),windows:(0,r.jsx)(d(),{alt:"Windows",height:40,src:"/logos/windows.svg",width:40})};function u(e){let{action:t,logo:o,subtitle:n,title:i,variant:a="default"}=e;return(0,r.jsxs)("div",{className:(0,l.cn)(["flex flex-col items-start gap-4 rounded-md p-4 md:flex-row md:items-center","highlight"===a?"border-brand border-2":"border-neutral border"]),children:[(0,r.jsx)("div",{className:"text-subtlest w-9 flex-shrink-0",children:o}),(0,r.jsxs)("div",{className:"mr-auto flex flex-col",children:[(0,r.jsx)("span",{className:"text-default text-base font-medium",children:i}),(0,r.jsx)("span",{className:"text-subtlest text-base",children:n})]}),t]})}function g(){let e=(0,c.x)();return(0,r.jsx)("div",{className:"mx-auto mt-16 flex w-full max-w-xl flex-col gap-6 pb-20",children:(0,r.jsx)(u,{action:(0,r.jsx)("a",{className:"text-inverse bg-brand flex-shrink-0 rounded px-4 py-1 text-base font-medium",href:"https://marketplace.visualstudio.com/items?itemName=trytriplex.triplex-vsce",onClick:t=>{e(t,"/docs/get-started?dl=vsce")},rel:"noreferrer",target:"_blank",children:"Visit marketplace"}),logo:p.vscode,subtitle:"Find on the Visual Studio marketplace.",title:"Install for Visual Studio Code"})})}let m=[];function h(e){return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("h1",{className:"text-default font-brand mt-20 text-center text-5xl font-medium",children:(0,r.jsx)("span",{children:"Start building with Triplex."})}),"\n",(0,r.jsx)(g,{})]})}let f={MDXContent:function(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},{wrapper:t}=Object.assign({},(0,a.a)(),e.components);return t?(0,r.jsx)(t,{...e,children:(0,r.jsx)(h,{...e})}):h(e)},pageOpts:{filePath:"pages/download.mdx",route:"/download",frontMatter:{title:"Download for macOS, Windows, and Linux",ogTitle:"Download Triplex for macOS, Windows, and Linux.",description:"Install for Triplex for VS Code or download the desktop app for macOS, Windows, and Linux."},timestamp:1769081921e3,pageMap:[{kind:"Meta",data:{"*":{type:"page",theme:{pagination:!1,breadcrumb:!1}},index:{display:"hidden",title:"Home",theme:{layout:"raw"}},download:{title:"Download",display:"hidden",theme:{layout:"raw"}},docs:{title:"Docs"},blog:{title:"Blog",href:"/blog"},resources:{title:"Resources",href:"/resources"},github:{title:"Visit GitHub",href:"https://github.com/pmndrs/triplex",type:"hidden",newWindow:!0},bugs:{title:"Raise an issue",href:"https://github.com/pmndrs/triplex/issues/new",type:"hidden"},discord:{title:"Visit Discord",href:"https://discord.gg/mfJJPZ4deK",type:"hidden"},youtube:{title:"Visit Youtube",href:"https://youtube.com/@trytriplex",type:"hidden"},twitter:{title:"Visit X (formerly Twitter)",href:"https://twitter.com/trytriplex",type:"hidden"},legal:{type:"hidden"},product:{type:"hidden"}}},{kind:"Folder",name:"blog",route:"/blog",children:[{kind:"MdxPage",name:"2025-june-update",route:"/blog/2025-june-update",frontMatter:{author:"Michael Dougall",title:"June 2025 Update",date:"2025-06-04T00:00:00.000Z",image:"/blogs/2025-june-update/webxr.png",description:"Here's what's been happening since Triplex for VS Code was released."}},{kind:"Meta",data:{"*":{theme:{layout:"full",pagination:!1,feedback:!0}},"triplex-moves-to-pmndrs":"Triplex Goes Open Source and Moves to Poimandres","2025-june-update":"June 2025 Update","triplex-for-vscode":'Supercharging the "Visual" in Visual Studio Code',"v0.64.0-shared-buffer-array-canvas-frame":"Triplex 0.64: SharedArrayBuffer, Canvas Frames, and Bugfixes","v0.63.0-new-year-new-features":"Triplex 0.63: New Year, New Release!","v0.62.0-the-one-with-linux":"Triplex 0.62: The One With Linux","v0.61.0-drag-n-drop-file-tabs":"Triplex 0.61: Element Drag & Drop, File Tabs","v0.60.0-element-actions":"Triplex 0.60: Element Actions","v0.59.0-backend-stability":"Triplex 0.59: Backend Stability Improvements","threejs-halloween-challenge":"Triplex joins the Three.js Halloween Challenge","v0.58.0-provider-component-ui":"Triplex 0.58: Provider Component UI","v0.57.0-edit-children-elements":"Triplex 0.57: Edit Children Elements","v0.56.0-live-editing-props":"Triplex 0.56: Live Editing Props",index:"Blog"}},{kind:"MdxPage",name:"index",route:"/blog",frontMatter:{title:"Blog",description:"Announcements, updates, and technical write ups are posted here for Triplex and the wider React Three Fiber ecosystem."}},{kind:"MdxPage",name:"threejs-halloween-challenge",route:"/blog/threejs-halloween-challenge",frontMatter:{title:"Triplex joins the Three.js Halloween Challenge",date:"2023-10-12T00:00:00.000Z",description:"Triplex is joining the Three.js halloween challenge! For the remainder of October when creating a new Triplex project you'll receive a spooky surprise!",author:"Michael Dougall"}},{kind:"MdxPage",name:"triplex-for-vscode",route:"/blog/triplex-for-vscode",frontMatter:{author:"Michael Dougall",title:'Supercharging the "Visual" in Visual Studio Code',date:"2025-03-25T00:00:00.000Z",description:"After almost a year of development Triplex for VS Code is now available in public beta with exciting features coming later this year.",image:"/ui/vsce-release.png",imageLayout:"cover"}},{kind:"MdxPage",name:"triplex-moves-to-pmndrs",route:"/blog/triplex-moves-to-pmndrs",frontMatter:{author:"Michael Dougall",title:"Triplex Goe
1s Open Source and Moves to Poimandres",date:"2025-10-08T00:00:00.000Z",description:"Triplex has moved into the Poimandres Collective and is now completely open source!",image:"/logos/pmndrs.svg"}},{kind:"MdxPage",name:"v0.56.0-live-editing-props",route:"/blog/v0.56.0-live-editing-props",frontMatter:{title:"Triplex 0.56: Live Editing Props",ogTitle:"Triplex 0.56",date:"2023-08-27T00:00:00.000Z",description:"This release introduces developer experience improvements such as live editing props, number input improvements, and input constraints set by jsdoc tags.",author:"Michael Dougall"}},{kind:"MdxPage",name:"v0.57.0-edit-children-elements",route:"/blog/v0.57.0-edit-children-elements",frontMatter:{title:"Triplex 0.57: Edit Children Elements",ogTitle:"Triplex 0.57",date:"2023-09-19T00:00:00.000Z",description:"This release brings much needed quality of life improvements such as editing any child element in the scene panel and filtering components, elements, and props.",author:"Michael Dougall"}},{kind:"MdxPage",name:"v0.58.0-provider-component-ui",route:"/blog/v0.58.0-provider-component-ui",frontMatter:{title:"Triplex 0.58: Provider Component UI",ogTitle:"Triplex 0.58",date:"2023-10-01T00:00:00.000Z",description:"This release improves on the provider component, improves the refresh scene command, and fixes some bugs. Thank you to Matt Black for sponsoring Triplex!",author:"Michael Dougall"}},{kind:"MdxPage",name:"v0.59.0-backend-stability",route:"/blog/v0.59.0-backend-stability",frontMatter:{title:"Triplex 0.59: Backend Stability Improvements",ogTitle:"Triplex 0.59",date:"2023-10-27T00:00:00.000Z",description:"This release completes a large refactor of the backend to improve scene stability.",author:"Michael Dougall"}},{kind:"MdxPage",name:"v0.60.0-element-actions",route:"/blog/v0.60.0-element-actions",frontMatter:{title:"Triplex 0.60: Element Actions",ogTitle:"Triplex 0.60",date:"2023-10-30T00:00:00.000Z",description:"This release introduces a new duplicate element action, improves element actions overall user experience, and fixes some bugs.",author:"Michael Dougall"}},{kind:"MdxPage",name:"v0.61.0-drag-n-drop-file-tabs",route:"/blog/v0.61.0-drag-n-drop-file-tabs",frontMatter:{title:"Triplex 0.61: Element Drag & Drop, File Tabs",ogTitle:"Triplex 0.61",date:"2023-11-22T00:00:00.000Z",description:"This release introduces element drag and drop, file tabs, and a whole load of bug fixes.",author:"Michael Dougall"}},{kind:"MdxPage",name:"v0.62.0-the-one-with-linux",route:"/blog/v0.62.0-the-one-with-linux",frontMatter:{title:"Triplex 0.62: The One With Linux",ogTitle:"Triplex 0.62",date:"2023-12-27T00:00:00.000Z",description:"This release introduces experimental Linux support, component thumbnails, and a whole load more.",author:"Michael Dougall"}},{kind:"MdxPage",name:"v0.63.0-new-year-new-features",route:"/blog/v0.63.0-new-year-new-features",frontMatter:{title:"Triplex 0.63: New Year, New Release!",ogTitle:"Triplex 0.63",date:"2024-01-02T00:00:00.000Z",description:"This release introduces canvas resizing, moves the provider controls to the right panel, and improves some UI/UX flows in the editor.",author:"Michael Dougall"}},{kind:"MdxPage",name:"v0.64.0-shared-buffer-array-canvas-frame",route:"/blog/v0.64.0-shared-buffer-array-canvas-frame",frontMatter:{title:"Triplex 0.64: SharedArrayBuffer, Canvas Frames, and Bugfixes",ogTitle:"Triplex 0.64",date:"2024-01-13T00:00:00.000Z",description:"This release adds support for SharedArrayBuffer, sizing your scene over different viewports, and new renderer configuration.",author:"Michael Dougall"}}]},{kind:"Folder",name:"docs",route:"/docs",children:[{kind:"Meta",data:{"*":{theme:{feedback:!0,pagination:!0,breadcrumb:!0,childLinks:!0}},"get-started":{title:"Get Started",theme:{childLinks:!1}},supporting:{type:"page",title:"Supporting",display:"hidden",theme:{pagination:!1}},"building-your-scene":"Building Your Scene","api-reference":"API Reference",community:"Community"}},{kind:"Folder",name:"api-reference",route:"/docs/api-reference",children:[{kind:"Meta",data:{props:"Props","prop-tags":"Prop Tags","config-options":"config.json Options",cli:"CLI"}},{kind:"Folder",name:"cli",route:"/docs/api-reference/cli",children:[{kind:"MdxPage",name:"create-triplex-project",route:"/docs/api-reference/cli/create-triplex-project",frontMatter:{title:"create-triplex-project",description:"The create-triplex-project CLI is the fastest way to start building your next app."}},{kind:"Meta",data:{"create-triplex-project":"create-triplex-project"}}]},{kind:"MdxPage",name:"cli",route:"/docs/api-reference/cli",frontMatter:{description:"Command-line interface tools for working with Triplex."}},{kind:"Folder",name:"config-options",route:"/docs/api-reference/config-options",children:[{kind:"Meta",data:{files:"files",provider:"provider",components:"components","public-dir":"publicDir","assets-dir":"",define:"define","unsafe-vite-config":"UNSAFE_viteConfig"}}
1,{kind:"MdxPage",name:"components",route:"/docs/api-reference/config-options/components",frontMatter:{title:"components",description:"Paths to component files that can be dragged into the scene."}},{kind:"MdxPage",name:"define",route:"/docs/api-reference/config-options/define",frontMatter:{title:"define",description:"Declare strings that are replaced at runtime."}},{kind:"MdxPage",name:"files",route:"/docs/api-reference/config-options/files",frontMatter:{title:"files",description:'Paths to component files that can be opened with "Open in Triplex".'}},{kind:"MdxPage",name:"provider",route:"/docs/api-reference/config-options/provider",frontMatter:{title:"provider",description:"Path to your provider component for global & environment configuration."}},{kind:"MdxPage",name:"public-dir",route:"/docs/api-reference/config-options/public-dir",frontMatter:{title:"publicDir",description:"Path to the directory where static assets are stored."}},{kind:"MdxPage",name:"unsafe-vite-config",route:"/docs/api-reference/config-options/unsafe-vite-config",frontMatter:{title:"UNSAFE_viteConfig",description:"Define custom bundler configuration that otherwise can't be handled by default behavior."}}]},{kind:"MdxPage",name:"config-options",route:"/docs/api-reference/config-options",frontMatter:{title:"config.json Options",description:"Options change the behavior of Triplex."}},{kind:"MdxPage",name:"prop-tags",route:"/docs/api-reference/prop-tags",frontMatter:{description:"Prop tags change the behavior of input controls."}},{kind:"MdxPage",name:"props",route:"/docs/api-reference/props",frontMatter:{description:"Props are declared on components and are shown as controls in the context area."}}]},{kind:"MdxPage",name:"api-reference",route:"/docs/api-reference",frontMatter:{description:"Reference of all public APIs available in Triplex."}},{kind:"Folder",name:"building-your-scene",route:"/docs/building-your-scene",children:[{kind:"Meta",data:{scene:"Scene",providers:"Providers",webxr:"WebXR","console-logs":"Console & Logs","ui-glossary":"Learn the UI"}},{kind:"Folder",name:"console-logs",route:"/docs/building-your-scene/console-logs",children:[{kind:"MdxPage",name:"debug-panel",route:"/docs/building-your-scene/console-logs/debug-panel",frontMatter:{app:"Triplex for VS Code",description:"Log data from anywhere in your components to the debug panel."}},{kind:"MdxPage",name:"dev-tools",route:"/docs/building-your-scene/console-logs/dev-tools",frontMatter:{title:"Chrome DevTools",description:"Use the dev tools you're already familiar with."}},{kind:"MdxPage",name:"logs",route:"/docs/building-your-scene/console-logs/logs",frontMatter:{description:"Logs are used to investigate issues with your scene and Triplex."}},{kind:"Meta",data:{"dev-tools":"Chrome DevTools","debug-panel":"Debug Panel",logs:"Logs"}}]},{kind:"MdxPage",name:"console-logs",route:"/docs/building-your-scene/console-logs",frontMatter:{title:"Console & Logs",description:"The developer console and logs help you debug your components."}},{kind:"MdxPage",name:"providers",route:"/docs/building-your-scene/providers",frontMatter:{description:"Provider components let you set up the environment of your project."}},{kind:"Folder",name:"scene",route:"/docs/building-your-scene/scene",children:[{kind:"Meta",data:{"scene-panel":"Scene Panel","visual-controls":"Visual Controls","input-controls":"Input Controls","play-controls":"Play Controls","scene-helpers":"Scene Helpers","component-controls":"Component Controls"}},{kind:"MdxPage",name:"component-controls",route:"/docs/building-your-scene/scene/component-controls",frontMatter:{description:"Component controls let you change the props that are given to your component."}},{kind:"MdxPage",name:"input-controls",route:"/docs/building-your-scene/scene/input-controls",frontMatter:{description:"Input controls let you update props through the UI."}},{kind:"MdxPage",name:"play-controls",route:"/docs/building-your-scene/scene/play-controls",frontMatter:{description:"Play controls let you interact with your scene."}},{kind:"Folder",name:"scene-helpers",route:"/docs/building-your-scene/scene/scene-helpers",children:[{kind:"MdxPage",name:"cameras",route:"/docs/building-your-scene/scene/scene-helpers/cameras",frontMatter:{description:"Learn about the built-in behavior for custom cameras."}},{kind:"MdxPage",name:"lights",route:"/docs/building-your-scene/scene/scene-helpers/lights",frontMatter:{description:"Learn about the built-in behavior of lights."}},{kind:"Meta",data:{cameras:"Cameras",lights:"Lights"}}]},{kind:"MdxPage",name:"scene-helpers",route:"/docs/building-your-scene/scene/scene-helpers",frontMatter:{description:"Scene Helpers let you inspect and debug your scene."}},{kind:"MdxPage",name:"scene-panel",route:"/docs/building-your-scene/scene/scene-panel",frontMatter:{description:"The scene panel lets you inspect your component, its elements, and props."}}
1,{kind:"MdxPage",name:"visual-controls",route:"/docs/building-your-scene/scene/visual-controls",frontMatter:{description:"Visual controls let you update props using controls in the scene rather than in code or input controls."}}]},{kind:"MdxPage",name:"scene",route:"/docs/building-your-scene/scene",frontMatter:{description:"The scene is where you build and interact with your components."}},{kind:"MdxPage",name:"ui-glossary",route:"/docs/building-your-scene/ui-glossary",frontMatter:{title:"Learn the User Interface",description:"A glossary of all available features across the UI."}},{kind:"MdxPage",name:"webxr",route:"/docs/building-your-scene/webxr",frontMatter:{app:"Triplex for VS Code",title:"Triplex WebXR",description:"View and edit your 3D components in WebXR."}}]},{kind:"MdxPage",name:"building-your-scene",route:"/docs/building-your-scene",frontMatter:{description:"Learn the different ways you build with Triplex."}},{kind:"Folder",name:"community",route:"/docs/community",children:[{kind:"Meta",data:{faq:{title:"FAQ",theme:{pagination:!1}}}},{kind:"MdxPage",name:"faq",route:"/docs/community/faq",frontMatter:{title:"Frequently Asked Questions",description:"Questions commonly asked by the community."}}]},{kind:"MdxPage",name:"community",route:"/docs/community",frontMatter:{title:"Community",description:"Join others building with Triplex, React, and the web."}},{kind:"Folder",name:"get-started",route:"/docs/get-started",children:[{kind:"Meta",data:{"*":{theme:{childLinks:!0}},vscode:"Visual Studio Code","starting-a-project":"Starting a Project"}},{kind:"Folder",name:"starting-a-project",route:"/docs/get-started/starting-a-project",children:[{kind:"Meta",data:{"create-from-template":"Create From Template","pre-existing-project":"Pre-Existing Project","starting-from-scratch":"Starting From Scratch","your-first-3d-component":"Your First 3D Component"}},{kind:"Folder",name:"create-from-template",route:"/docs/get-started/starting-a-project/create-from-template",children:[{kind:"MdxPage",name:"point-and-click",route:"/docs/get-started/starting-a-project/create-from-template/point-and-click",frontMatter:{title:"Point & Click Starter",description:"A simple point & click starter template for your next 3D component, built with Koota, Vite, and React Three Fiber.",image:"/templates/point-and-click.png"}},{kind:"Meta",data:{"point-and-click":"Point & Click Starter"}}]},{kind:"MdxPage",name:"create-from-template",route:"/docs/get-started/starting-a-project/create-from-template",frontMatter:{title:"Create From Template",description:"Start building your next app using an official starter template."}},{kind:"MdxPage",name:"pre-existing-project",route:"/docs/get-started/starting-a-project/pre-existing-project",frontMatter:{title:"Pre-Existing Project",description:"Keep building your existing project with Triplex."}},{kind:"MdxPage",name:"starting-from-scratch",route:"/docs/get-started/starting-a-project/starting-from-scratch",frontMatter:{title:"Starting From Scratch",description:"With nothing but an empty folder learn how to start building with Triplex."}},{kind:"Folder",name:"your-first-3d-component",route:"/docs/get-started/starting-a-project/your-first-3d-component",children:[{kind:"Meta",data:{"*":{theme:{pagination:!1}},vscode:"Visual Studio Code"}},{kind:"MdxPage",name:"vscode",route:"/docs/get-started/starting-a-project/your-first-3d-component/vscode",frontMatter:{title:"Using Triplex for VS Code"}}]},{kind:"MdxPage",name:"your-first-3d-component",route:"/docs/get-started/starting-a-project/your-first-3d-component",frontMatter:{title:"Your First 3D Component",description:"Learn how to create your first 3D component with Triplex.",category:"Tutorial"}}]},{kind:"MdxPage",name:"starting-a-project",route:"/docs/get-started/starting-a-project",frontMatter:{description:"Get started from a template, your existing project, or from scratch."}},{kind:"MdxPage",name:"vscode",route:"/docs/get-started/vscode",frontMatter:{title:"Triplex for VS Code",description:"Turn Visual Studio Code, Cursor, Windsurf, and forks into your visual workspace.",image:"/ui/vsce-app-dark.png"}}]},{kind:"MdxPage",name:"get-started",route:"/docs/get-started",frontMatter:{title:"Introduction",description:"Triplex is your visual workspace for building React / Three Fiber components.",image:"/ui/vsce-app-dark.png",imageLayout:"cover"}},{kind:"Folder",name:"supporting",route:"/docs/supporting",children:[{kind:"Meta",data:{"*":{display:"hidden",theme:{breadcrumb:!1}}
1,"component-outside-of-project-files":"Component Outside of Project Files","resolve-type-error-assets":"How To Resolve Type Errors With Static Assets","saving-outside-cwd":"Saving Outside Of The Project Folder","installing-dependencies":"Troubleshoot Installing Dependencies"}},{kind:"MdxPage",name:"component-outside-of-project-files",route:"/docs/supporting/component-outside-of-project-files",frontMatter:{title:"Component Outside of Project Files"}},{kind:"MdxPage",name:"installing-dependencies",route:"/docs/supporting/installing-dependencies",frontMatter:{title:"Troubleshoot Installing Dependencies"}},{kind:"MdxPage",name:"resolve-type-error-assets",route:"/docs/supporting/resolve-type-error-assets",frontMatter:{title:"How To Resolve Type Errors With Static Assets"}},{kind:"MdxPage",name:"saving-outside-cwd",route:"/docs/supporting/saving-outside-cwd",frontMatter:{title:"Saving Outside Of The Project Folder"}}]}]},{kind:"MdxPage",name:"download",route:"/download",frontMatter:{title:"Download for macOS, Windows, and Linux",ogTitle:"Download Triplex for macOS, Windows, and Linux.",description:"Install for Triplex for VS Code or download the desktop app for macOS, Windows, and Linux."}},{kind:"MdxPage",name:"index",route:"/",frontMatter:{title:"Build the 2D and 3D Web Without Coding"}},{kind:"Folder",name:"legal",route:"/legal",children:[{kind:"Meta",data:{"*":{type:"hidden",theme:{pagination:!1}},"privacy-policy":"Privacy Policy"}},{kind:"MdxPage",name:"privacy-policy",route:"/legal/privacy-policy",frontMatter:{title:"Privacy Policy"}}]},{kind:"Folder",name:"product",route:"/product",children:[{kind:"Meta",data:{"*":{theme:{layout:"full",pagination:!1}},"storybook-alternative":"Storybook Alternative"}},{kind:"MdxPage",name:"storybook-alternative",route:"/product/storybook-alternative",frontMatter:{name:"Storybook Alternative",description:"Developing components in isolation has proven to be a productive scalable way to build UIs. Here's how Storybook compares with Triplex.",image:"/ui/vsce-app-dark.png",imageLayout:"cover"}}]},{kind:"Folder",name:"resources",route:"/resources",children:[{kind:"Meta",data:{"*":{theme:{layout:"full",pagination:!1,feedback:!0}},"fix-shadows-vertex-shader-threejs":"How to Fix Broken Shadows After Using a Vertex Shader","check-element-types":"How to Fix Missing Element Props","tailwind-css":"How to Set Up Tailwind CSS","replacing-leva-with-props":"Replacing Leva With Component Props",index:"Resources","using-glsl-with-triplex":"Using GLSL Shaders With Triplex","virtual-three-components":"Using Transform Controls With Virtual Scene Components"}},{kind:"MdxPage",name:"check-element-types",route:"/resources/check-element-types",frontMatter:{title:"How to Fix Missing Element Props",description:"Elements can be given props to change their appearance and behavior. This guide explains what to do if they're missing.",category:"Shaders"}},{kind:"MdxPage",name:"fix-shadows-vertex-shader-threejs",route:"/resources/fix-shadows-vertex-shader-threejs",frontMatter:{title:"How to Fix Broken Shadows After Using a Vertex Shader",description:"Displacing vertices with a GLSL vertex shader can make for fantastic results but it's very easy to leave out a crucial step to ensure shadows remain correct.",category:"Shaders"}},{kind:"MdxPage",name:"index",route:"/resources",frontMatter:{title:"Resources",description:"Articles that provide step-by-step instructions for common use cases and tasks when using Triplex and React Three Fiber."}},{kind:"MdxPage",name:"replacing-leva-with-props",route:"/resources/replacing-leva-with-props",frontMatter:{title:"Replacing Leva With Component Props",description:"Leva is a popular library to wire up controls to your components. With Triplex you can remove your glue code and instead use component props.",category:"Components"}},{kind:"MdxPage",name:"tailwind-css",route:"/resources/tailwind-css",frontMatter:{title:"How to Set Up Tailwind CSS",category:"Styling",description:"Your components might expect global styles to be available to render correctly. Here's how to set up Tailwind CSS in your Triplex project."}},{kind:"MdxPage",name:"using-glsl-with-triplex",route:"/resources/using-glsl-with-triplex",frontMatter:{title:"Using GLSL Shaders With Triplex",description:"GLSL shaders are small programs that run on the GPU. When imported they have their include statements resolved and are then available as a string for you to forward on to Three.js.",category:"Shaders"}},{kind:"MdxPage",name:"virtual-three-components",route:"/resources/virtual-three-components",frontMatter:{title:"Using Transform Controls With Virtual Scene Components",description:"For use cases where transform controls would be a huge time saver but your 3D component doesn't render anything to the scene â you're still in luck.",category:"Components"}}]}],flexsearch:{codeblocks:!0},title:"Download for macOS, Windows, and Linux",headings:m},pageNextRoute:"/download",nextraLayout:i.Z};var x=(0,n.j)(f)},382:function(e,t,o){"use strict";o.d(t,{x:function(){return n}});var r=o(6701);function n(){let e=(0,r.useRouter)();return(t,o)=>{t.preventDefault(),e.push(o);let r=t.currentTarget.href;setTimeout(()=>window.open(r,"_blank"),1e3)}}}},function(e){e.O(0,[2723,5126,2115,2888,9774,179],function(){return e(e.s=366)}),_N_E=e.O()}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.