{"repo":"splinetool/react-spline","free":true,"listed":false,"github":"https://github.com/splinetool/react-spline","clone":"git clone https://github.com/splinetool/react-spline.git","description":"React component for Spline scenes.","language":"TypeScript","stars":1415,"topics":["react"],"license":"MIT","category":"ui-components","readme_excerpt":"react-spline react-spline allows you to export and use Spline scenes directly in your React websites. 🌈 Spline is a friendly 3d collaborative design tool for the web. Website &mdash; Twitter &mdash; Community &mdash; Documentation Table of Contents - Install - Usage - Next.js - Read and modify Spline objects - Listen to events - Trigger Spline events from outside - Lazy loading - API - Spline Component Props - Spline App Methods - Spline Events - Contributing Install or Usage To use react-spline, first you have to go to the Spline editor, click on the Export button, select \" Code \" and then \" React \". You should see this: You can copy the URL and pass it to the component in react: You should be able to see the scene you exported in your React app. NOTE : If you are experiencing CORS issues, you can download the .splinecode file and self-host it; this will fix any CORS issue. To download, go to Spline's code export panel and click on the download icon visible in the prod.spline textarea. Next.js You can use this library in Next.js as well to take advantage of Server Side Rendering. By default the library will render on the client only, but if you use the import @splinetool/react/next the server will render an autogenerated blurred placeholder. Here is an example. Export as Next.js from the Spline editor to autogenerate the placeholder. Read and modify Spline objects You can query any Spline object via findObjectByName or findObjectById . (You can get the ID of the object by r","default_branch":null,"files":null,"tree":[],"storefront":"/r/splinetool","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/splinetool/react-spline/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}