The open source visual workspace for React / Three Fiber. Build the 2D and 3D web.

triplex

<img aria-label="Triplex" src="https://github.com/pmndrs/triplex/blob/main/logo-dark.svg#gh-light-mode-only" height="70" />

<img aria-label="Triplex" src="https://github.com/pmndrs/triplex/blob/main/logo-light.svg#gh-dark-mode-only" height="70" />

[![Twitter](https://img.shields.io/twitter/follow/pmndrs?label=%40pmndrs&style=flat&colorA=000000&colorB=000000&logo=twitter&logoColor=000000)](https://twitter.com/pmndrs) [![Discord](https://img.shields.io/discord/740090768164651008?style=flat&colorA=000000&colorB=000000&label=discord&logo=discord&logoColor=000000)](https://discord.gg/ZZjjNvJ)

Triplex is the open source visual workspace for building [React](https://react.dev/) / [Three Fiber](https://r3f.docs.pmnd.rs/) components. Build 2D and 3D components using its visual and input controls. Jump down to code when you need.

[<img alt="" height="300" src="https://github.com/pmndrs/triplex/blob/main/hero-preview.gif" />](https://www.youtube.com/watch?v=XEvvJ5Siff8)

## Get Started

1. Install [Triplex for VS Code](https://marketplace.visualstudio.com/items?itemName=trytriplex.triplex-vsce).
1. Create a project using a [starter template](https://triplex.dev/docs/get-started/starting-a-project/create-from-template) or [open your existing one](https://triplex.dev/docs/get-started/starting-a-project/pre-existing-project).
1. Open a component and build!

Visit https://triplex.dev/docs/building-your-scene to learn more.

## Contributions

Contributions are welcomed! Please see [CONTRIBUTING.md](./CONTRIBUTING.md) to get started. If you haven't already make sure to join the Poimandres [Discord community](https://discord.gg/SUHCwfEk).

<br />
<a href="https://vercel.com/oss">
  <img alt="Vercel OSS Program" src="https://vercel.com/oss/program-badge.svg" />
</a>


triplex

README

Get Started

Contributions