CINXE.COM
Poimandres documentation
<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" href="/_next/static/media/a34f9d1faa5f3315-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/a6f8c6b7131e657a-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="stylesheet" href="/_next/static/css/947026db73999779.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/webpack-421aac6925721ba7.js"/><script src="/_next/static/chunks/fd9d1056-d73371d550d788d5.js" async=""></script><script src="/_next/static/chunks/23-49594bc5760b86ab.js" async=""></script><script src="/_next/static/chunks/main-app-a8e9a1c85cffbf2b.js" async=""></script><script src="/_next/static/chunks/363642f4-c0a027637bd7adac.js" async=""></script><script src="/_next/static/chunks/e58a7f8f-58bdeb89062b4fde.js" async=""></script><script src="/_next/static/chunks/f8025e75-b5af8c5925ff7c97.js" async=""></script><script src="/_next/static/chunks/5e22fd23-b96c4aea2337b100.js" async=""></script><script src="/_next/static/chunks/215-1ed08e2790ba4be4.js" async=""></script><script src="/_next/static/chunks/173-a17583831fb54b1d.js" async=""></script><script src="/_next/static/chunks/534-7cbd79cc09c93eab.js" async=""></script><script src="/_next/static/chunks/231-149f4d92f1bfc8fe.js" async=""></script><script src="/_next/static/chunks/372-8d79df494d2400b3.js" async=""></script><script src="/_next/static/chunks/app/%5B...slug%5D/layout-bc58ed176ae0f0c6.js" async=""></script><script src="/_next/static/chunks/app/layout-3b44517e5b372809.js" async=""></script><title>Poimandres documentation</title><meta name="description" content="Index of documentation for pmndrs/* libraries"/><meta property="og:title" content="Poimandres documentation"/><meta property="og:description" content="Index of documentation for pmndrs/* libraries"/><meta property="og:image" content="http://localhost:3000/logo.png"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:title" content="Poimandres documentation"/><meta name="twitter:description" content="Index of documentation for pmndrs/* libraries"/><meta name="twitter:image" content="http://localhost:3000/logo.png"/><meta name="next-size-adjust"/><script src="/_next/static/chunks/polyfills-78c92fac7aa8fdd8.js" noModule=""></script><style id="sandpack">--sxs{--sxs:1 sp-k-eyOShd sp-k-iOHdLQ}@media{@keyframes sp-k-eyOShd{0%{opacity:0}100%{opacity:1}}@keyframes sp-k-iOHdLQ{0%{transform:rotateX(-25.5deg) rotateY(45deg)}100%{transform:rotateX(-25.5deg) rotateY(405deg)}}}--sxs{--sxs:2 sp-c-gMfcns sp-c-bxeRRt sp-c-jKPvnt sp-c-fWymNx sp-c-euXojQ sp-c-bpmgvy sp-c-PJLV}@media{.sp-c-gMfcns svg{margin:auto}.sp-c-bxeRRt{-webkit-appearance:none;appearance:none;outline:none;display:flex;align-items:center;font-size:inherit;font-family:inherit;background-color:transparent;transition:color var(--sp-transitions-default), background var(--sp-transitions-default);cursor:pointer;color:var(--sp-colors-clickable);border:0;text-decoration:none}.sp-c-bxeRRt:disabled{color:var(--sp-colors-disabled)}.sp-c-bxeRRt:hover:not(:disabled,[data-active='true']){color:var(--sp-colors-hover)}.sp-c-bxeRRt[data-active="true"]{color:var(--sp-colors-accent)}.sp-c-bxeRRt svg{min-width:var(--sp-space-4);width:var(--sp-space-4);height:var(--sp-space-4)}.sp-c-bxeRRt.sp-c-gMfcns{padding:var(--sp-space-1);height:var(--sp-space-7);display:flex}.sp-c-bxeRRt.sp-c-gMfcns.sp-c-bxeRRt:not(:has(span)){width:var(--sp-space-7)}.sp-c-bxeRRt.sp-c-gMfcns.sp-c-bxeRRt:has(svg + span){padding-right:var(--sp-space-3);padding-left:var(--sp-space-2);gap:var(--sp-space-1)}.sp-c-jKPvnt{padding:0 var(--sp-space-1) 0 var(--sp-space-1);border-radius:var(--sp-border-radius);margin-left:var(--sp-space-1);width:var(--sp-space-5);visibility:hidden;cursor:pointer;position:absolute;right:0px}.sp-c-jKPvnt svg{width:var(--sp-space-3);height:var(--sp-space-3);display:block;position:relative;top:1px}.sp-c-fWymNx{margin:0;display:block;font-family:var(--sp-font-mono);font-size:var(--sp-font-size);color:var(--sp-syntax-color-plain);line-height:var(--sp-font-lineHeight)}.sp-c-euXojQ{display:flex;flex-direction:column;width:100%;position:relative;background-color:var(--sp-colors-surface1);gap:1px}.sp-c-euXojQ:has(.sp-stack){background-color:var(--sp-colors-surface2)}.sp-c-bpmgvy{transform:translate(-4px, 9px) scale(0.13, 0.13)}.sp-c-bpmgvy *{position:absolute;width:96px;height:96px}}--sxs{--sxs:3 sp-c-PJLV-kCOVwI-status-pass sp-c-PJLV-kEzYsr-status-fail sp-c-PJLV-gHAhSA-status-skip sp-c-PJLV-jgnHyR-status-title sp-c-PJLV-iCgxLS-status-run sp-c-PJLV-bnDZSy-status-pass sp-c-PJLV-eYuGwt-status-fail}@media{.sp-c-PJLV-kCOVwI-status-pass{color:var(--test-pass)}.sp-c-PJLV-kEzYsr-status-fail{color:var(--test-fail)}.sp-c-PJLV-gHAhSA-status-skip{color:var(--test-skip)}.sp-c-PJLV-jgnHyR-status-title{color:var(--test-title)}.sp-c-PJLV-iCgxLS-status-run{background:var(--test-run);color:var(--sp-colors-surface1)}.sp-c-PJLV-bnDZSy-status-pass{background:var(--test-pass);color:var(--sp-colors-surface1)}.sp-c-PJLV-eYuGwt-status-fail{background:var(--test-fail);color:var(--sp-colors-surface1)}}</style></head><body class="__className_d65c78 bg-surface break-words"><script>!function(){try{var d=document.documentElement,c=d.classList;c.remove('light','dark');var e=localStorage.getItem('theme');if('system'===e||(!e&&true)){var t='(prefers-color-scheme: dark)',m=window.matchMedia(t);if(m.media!==t||m.matches){d.style.colorScheme = 'dark';c.add('dark')}else{d.style.colorScheme = 'light';c.add('light')}}else if(e){c.add(e|| '')}if(e==='light'||e==='dark')d.style.colorScheme=e}catch(e){}}()</script><div class="min-h-screen"><div class="px-4 py-8 pb-12 lg:px-28 lg:py-12 lg:pb-20"><header class="text-center text-3xl lg:text-left"><a aria-label="Poimandres Docs" class="font-bold" href="/"><span class="sm:hidden">docs</span><span class="hidden sm:inline">documentation</span></a>.<a href="https://pmnd.rs">pmnd.rs</a></header><main class="max-w-8xl mt-8 grid w-full grid-cols-1 gap-8 lg:mt-10 lg:grid-cols-2 lg:gap-12 2xl:grid-cols-3"><div class="group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal"><div class="relative z-10 flex h-full flex-col justify-between"><div class="flex items-center justify-between gap-6 px-6 py-6"><div class="max-w-md"><div class="text-lg font-bold">React Three Fiber</div><div class="flex-grow text-sm !leading-relaxed text-on-surface-variant/50">React-three-fiber is a React renderer for three.js</div></div><a href="https://github.com/pmndrs/react-three-fiber" target="_blank" rel="noopener" class="relative block h-20 w-20 flex-shrink-0"><img alt="React Three Fiber" aria-hidden="true" loading="lazy" width="500" height="500" decoding="async" data-nimg="1" class="absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0" style="color:transparent" src="/_next/static/media/r3f-icon.202966d3.svg"/></a></div><div class="flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm"><a class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors" href="/react-three-fiber"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z"></path></svg><span class="sm:hidden">Docs</span><span class="hidden sm:inline">Documentation</span></a><a href="https://github.com/pmndrs/react-three-fiber" target="_blank" rel="noopener noreferrer" class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z"></path></svg><span>GitHub</span></a></div></div></div><div class="group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal"><div class="relative z-10 flex h-full flex-col justify-between"><div class="flex items-center justify-between gap-6 px-6 py-6"><div class="max-w-md"><div class="text-lg font-bold">React Spring</div><div class="flex-grow text-sm !leading-relaxed text-on-surface-variant/50">Bring your components to life with simple spring animation primitives for React</div></div><a href="https://github.com/pmndrs/react-spring" target="_blank" rel="noopener" class="relative block h-20 w-20 flex-shrink-0"><img alt="React Spring" aria-hidden="true" loading="lazy" width="800" height="800" decoding="async" data-nimg="1" class="absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0" style="color:transparent" src="/_next/static/media/react-spring-icon.b7fe2db3.svg"/></a></div><div class="flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm"><a class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors" href="https://react-spring.io"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z"></path></svg><span class="sm:hidden">Docs</span><span class="hidden sm:inline">Documentation</span></a><a href="https://github.com/pmndrs/react-spring" target="_blank" rel="noopener noreferrer" class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z"></path></svg><span>GitHub</span></a></div></div></div><div class="group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal"><div class="relative z-10 flex h-full flex-col justify-between"><div class="flex items-center justify-between gap-6 px-6 py-6"><div class="max-w-md"><div class="text-lg font-bold">Drei</div><div class="flex-grow text-sm !leading-relaxed text-on-surface-variant/50">Drei is a growing collection of useful helpers and abstractions for react-three-fiber</div></div><a href="https://github.com/pmndrs/drei" target="_blank" rel="noopener" class="relative block h-20 w-20 flex-shrink-0"><img alt="Drei" aria-hidden="true" loading="lazy" width="500" height="500" decoding="async" data-nimg="1" class="absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0" style="color:transparent" src="/_next/static/media/drei-icon.cbe3cdab.svg"/></a></div><div class="flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm"><a class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors" href="/drei"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z"></path></svg><span class="sm:hidden">Docs</span><span class="hidden sm:inline">Documentation</span></a><a href="https://github.com/pmndrs/drei" target="_blank" rel="noopener noreferrer" class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z"></path></svg><span>GitHub</span></a></div></div></div><div class="group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal"><div class="relative z-10 flex h-full flex-col justify-between"><div class="flex items-center justify-between gap-6 px-6 py-6"><div class="max-w-md"><div class="text-lg font-bold">Zustand</div><div class="flex-grow text-sm !leading-relaxed text-on-surface-variant/50">Zustand is a small, fast and scalable bearbones state-management solution, it has a comfy api based on hooks</div></div><a href="https://github.com/pmndrs/zustand" target="_blank" rel="noopener" class="relative block h-20 w-20 flex-shrink-0"><img alt="Zustand" aria-hidden="true" loading="lazy" width="512" height="512" decoding="async" data-nimg="1" class="absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0" style="color:transparent" src="/_next/static/media/zustand-icon.3261dd51.svg"/></a></div><div class="flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm"><a class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors" href="/zustand"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z"></path></svg><span class="sm:hidden">Docs</span><span class="hidden sm:inline">Documentation</span></a><a href="https://github.com/pmndrs/zustand" target="_blank" rel="noopener noreferrer" class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z"></path></svg><span>GitHub</span></a></div></div></div><div class="group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal"><div class="relative z-10 flex h-full flex-col justify-between"><div class="flex items-center justify-between gap-6 px-6 py-6"><div class="max-w-md"><div class="text-lg font-bold">Jotai</div><div class="flex-grow text-sm !leading-relaxed text-on-surface-variant/50">Jotai is a primitive and flexible state management library for React</div></div><a href="https://github.com/pmndrs/jotai" target="_blank" rel="noopener" class="relative block h-20 w-20 flex-shrink-0"><img alt="Jotai" aria-hidden="true" loading="lazy" width="128" height="116" decoding="async" data-nimg="1" class="absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0" style="color:transparent" src="/_next/static/media/jotai-icon.c4c64662.png"/></a></div><div class="flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm"><a class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors" href="https://jotai.org/docs/introduction"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z"></path></svg><span class="sm:hidden">Docs</span><span class="hidden sm:inline">Documentation</span></a><a href="https://github.com/pmndrs/jotai" target="_blank" rel="noopener noreferrer" class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z"></path></svg><span>GitHub</span></a></div></div></div><div class="group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal"><div class="relative z-10 flex h-full flex-col justify-between"><div class="flex items-center justify-between gap-6 px-6 py-6"><div class="max-w-md"><div class="text-lg font-bold">Valtio</div><div class="flex-grow text-sm !leading-relaxed text-on-surface-variant/50">Valtio makes proxy-state simple for React and Vanilla</div></div></div><div class="flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm"><a class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors" href="https://valtio.pmnd.rs"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z"></path></svg><span class="sm:hidden">Docs</span><span class="hidden sm:inline">Documentation</span></a><a href="https://github.com/pmndrs/valtio" target="_blank" rel="noopener noreferrer" class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z"></path></svg><span>GitHub</span></a></div></div></div><div class="group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal"><div class="relative z-10 flex h-full flex-col justify-between"><div class="flex items-center justify-between gap-6 px-6 py-6"><div class="max-w-md"><div class="text-lg font-bold">A11y</div><div class="flex-grow text-sm !leading-relaxed text-on-surface-variant/50">@react-three/a11y brings accessibility to webGL with easy-to-use react-three-fiber components</div></div></div><div class="flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm"><a class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors" href="/a11y"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z"></path></svg><span class="sm:hidden">Docs</span><span class="hidden sm:inline">Documentation</span></a><a href="https://github.com/pmndrs/react-three-a11y" target="_blank" rel="noopener noreferrer" class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z"></path></svg><span>GitHub</span></a></div></div></div><div class="group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal"><div class="relative z-10 flex h-full flex-col justify-between"><div class="flex items-center justify-between gap-6 px-6 py-6"><div class="max-w-md"><div class="text-lg font-bold">React Postprocessing</div><div class="flex-grow text-sm !leading-relaxed text-on-surface-variant/50">React Postprocessing is a postprocessing wrapper for @react-three/fiber</div></div><a href="https://github.com/pmndrs/react-postprocessing" target="_blank" rel="noopener" class="relative block h-20 w-20 flex-shrink-0"><img alt="React Postprocessing" aria-hidden="true" loading="lazy" width="956" height="956" decoding="async" data-nimg="1" class="absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0" style="color:transparent" src="/_next/static/media/pp-icon.4846b21f.svg"/></a></div><div class="flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm"><a class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors" href="/react-postprocessing"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z"></path></svg><span class="sm:hidden">Docs</span><span class="hidden sm:inline">Documentation</span></a><a href="https://github.com/pmndrs/react-postprocessing" target="_blank" rel="noopener noreferrer" class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z"></path></svg><span>GitHub</span></a></div></div></div><div class="group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal"><div class="relative z-10 flex h-full flex-col justify-between"><div class="flex items-center justify-between gap-6 px-6 py-6"><div class="max-w-md"><div class="text-lg font-bold">uikit</div><div class="flex-grow text-sm !leading-relaxed text-on-surface-variant/50">uikit brings user interfaces to @react-three/fiber</div></div><a href="https://github.com/pmndrs/uikit" target="_blank" rel="noopener" class="relative block h-20 w-20 flex-shrink-0"><img alt="uikit" aria-hidden="true" loading="lazy" width="142" height="124" decoding="async" data-nimg="1" class="absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0" style="color:transparent" src="/_next/static/media/uikit-icon.232326fa.svg"/></a></div><div class="flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm"><a class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors" href="/uikit"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z"></path></svg><span class="sm:hidden">Docs</span><span class="hidden sm:inline">Documentation</span></a><a href="https://github.com/pmndrs/uikit" target="_blank" rel="noopener noreferrer" class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z"></path></svg><span>GitHub</span></a></div></div></div><div class="group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal"><div class="relative z-10 flex h-full flex-col justify-between"><div class="flex items-center justify-between gap-6 px-6 py-6"><div class="max-w-md"><div class="text-lg font-bold">xr</div><div class="flex-grow text-sm !leading-relaxed text-on-surface-variant/50">VR/AR for @react-three/fiber</div></div></div><div class="flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm"><a class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors" href="/xr"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z"></path></svg><span class="sm:hidden">Docs</span><span class="hidden sm:inline">Documentation</span></a><a href="https://github.com/pmndrs/xr" target="_blank" rel="noopener noreferrer" class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z"></path></svg><span>GitHub</span></a></div></div></div><div class="group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal"><div class="relative z-10 flex h-full flex-col justify-between"><div class="flex items-center justify-between gap-6 px-6 py-6"><div class="max-w-md"><div class="text-lg font-bold">Docs</div><div class="flex-grow text-sm !leading-relaxed text-on-surface-variant/50">Documentation generator for `pmndrs/*`</div></div><a href="https://github.com/pmndrs/docs" target="_blank" rel="noopener" class="relative block h-20 w-20 flex-shrink-0"><img alt="Docs" aria-hidden="true" loading="lazy" width="157" height="188" decoding="async" data-nimg="1" class="absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0" style="color:transparent" src="/_next/static/media/docs-icon.76842f92.png"/></a></div><div class="flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm"><a class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors" href="/getting-started/introduction"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z"></path></svg><span class="sm:hidden">Docs</span><span class="hidden sm:inline">Documentation</span></a><a href="https://github.com/pmndrs/docs" target="_blank" rel="noopener noreferrer" class="interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors"><svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="h-5 w-5 flex-none"><path d="M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z"></path></svg><span>GitHub</span></a></div></div></div></main></div></div><script src="/_next/static/chunks/webpack-421aac6925721ba7.js" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0]);self.__next_f.push([2,null])</script><script>self.__next_f.push([1,"1:HL[\"/_next/static/media/a34f9d1faa5f3315-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n2:HL[\"/_next/static/media/a6f8c6b7131e657a-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n3:HL[\"/_next/static/css/947026db73999779.css\",\"style\"]\n"])</script><script>self.__next_f.push([1,"4:I[5751,[],\"\"]\n6:I[231,[\"401\",\"static/chunks/363642f4-c0a027637bd7adac.js\",\"344\",\"static/chunks/e58a7f8f-58bdeb89062b4fde.js\",\"950\",\"static/chunks/f8025e75-b5af8c5925ff7c97.js\",\"452\",\"static/chunks/5e22fd23-b96c4aea2337b100.js\",\"215\",\"static/chunks/215-1ed08e2790ba4be4.js\",\"173\",\"static/chunks/173-a17583831fb54b1d.js\",\"534\",\"static/chunks/534-7cbd79cc09c93eab.js\",\"231\",\"static/chunks/231-149f4d92f1bfc8fe.js\",\"372\",\"static/chunks/372-8d79df494d2400b3.js\",\"55\",\"static/chunks/app/%5B...slug%5D/layout-bc58ed176ae0f0c6.js\"],\"\"]\n7:I[8173,[\"401\",\"static/chunks/363642f4-c0a027637bd7adac.js\",\"344\",\"static/chunks/e58a7f8f-58bdeb89062b4fde.js\",\"950\",\"static/chunks/f8025e75-b5af8c5925ff7c97.js\",\"452\",\"static/chunks/5e22fd23-b96c4aea2337b100.js\",\"215\",\"static/chunks/215-1ed08e2790ba4be4.js\",\"173\",\"static/chunks/173-a17583831fb54b1d.js\",\"534\",\"static/chunks/534-7cbd79cc09c93eab.js\",\"231\",\"static/chunks/231-149f4d92f1bfc8fe.js\",\"372\",\"static/chunks/372-8d79df494d2400b3.js\",\"55\",\"static/chunks/app/%5B...slug%5D/layout-bc58ed176ae0f0c6.js\"],\"Image\"]\n13:I[1395,[\"401\",\"static/chunks/363642f4-c0a027637bd7adac.js\",\"344\",\"static/chunks/e58a7f8f-58bdeb89062b4fde.js\",\"215\",\"static/chunks/215-1ed08e2790ba4be4.js\",\"185\",\"static/chunks/app/layout-3b44517e5b372809.js\"],\"SandpackCSS\"]\n14:I[9512,[\"401\",\"static/chunks/363642f4-c0a027637bd7adac.js\",\"344\",\"static/chunks/e58a7f8f-58bdeb89062b4fde.js\",\"215\",\"static/chunks/215-1ed08e2790ba4be4.js\",\"185\",\"static/chunks/app/layout-3b44517e5b372809.js\"],\"ThemeProvider\"]\n15:I[9275,[],\"\"]\n16:I[1343,[],\"\"]\n18:I[6130,[],\"\"]\n8:T44f,M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207"])</script><script>self.__next_f.push([1,"031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z9:T44f,M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Za:T44f,M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 1"])</script><script>self.__next_f.push([1,"0.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Zb:T44f,M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Zc:T44f,M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 "])</script><script>self.__next_f.push([1,"6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Zd:T44f,M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14"])</script><script>self.__next_f.push([1," 3.90625 11.089844 1 7.5 1Ze:T44f,M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Zf:T44f,M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 "])</script><script>self.__next_f.push([1,"10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z10:T44f,M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z11:T44f,M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105"])</script><script>self.__next_f.push([1,"469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z12:T44f,M7.5 1C3.910156 1 1 3.90625 1 7.488281C1 10.355469 2.863281 12.789063 5.445313 13.648438C5.769531 13.707031 6 13.375 6 13.125C6 12.972656 6.003906 12.789063 6 12.25C4.191406 12.640625 3.625 11.375 3.625 11.375C3.328125 10.625 2.96875 10.410156 2.96875 10.410156C2.378906 10.007813 3.011719 10.019531 3.011719 10.019531C3.664063 10.0625 4 10.625 4 10.625C4.5 11.5 5.628906 11.414063 6 11.25C6 10.851563 6.042969 10.5625 6.152344 10.378906C4.109375 10.019531 2.996094 8.839844 3 7.207031C3.003906 6.242188 3.335938 5.492188 3.875 4.9375C3.640625 4.640625 3.480469 3.625 3.960938 3C5.167969 3 5.886719 3.871094 5.886719 3.871094C5.886719 3.871094 6.453125 3.625 7.496094 3.625C8.542969 3.625 9.105469 3.859375 9.105469 3.859375C9.105469 3.859375 9.828125 3 11.035156 3C11.515625 3.625 11.355469 4.640625 11.167969 4.917969C11.683594 5.460938 12 6.210938 12 7.207031C12 8.839844 10.890625 10.019531 8.851563 10.375C8.980469 10.570313 9 10.84375 9 11.25C9 12.117188 9 12.910156 9 13.125C9 13.375 9.226563 13.710938 9.558594 13.648438C12.140625 12.785156 14 10.355469 14 7.488281C14 3.90625 11.089844 1 7.5 1Z19:[]\n"])</script><script>self.__next_f.push([1,"0:[\"$\",\"$L4\",null,{\"buildId\":\"kqLxiLAiizUOA9wXETGww\",\"assetPrefix\":\"\",\"urlParts\":[\"\",\"\"],\"initialTree\":[\"\",{\"children\":[\"__PAGE__\",{}]},\"$undefined\",\"$undefined\",true],\"initialSeedData\":[\"\",{\"children\":[\"__PAGE__\",{},[[\"$L5\",[\"$\",\"div\",null,{\"className\":\"min-h-screen\",\"children\":[\"$\",\"div\",null,{\"className\":\"px-4 py-8 pb-12 lg:px-28 lg:py-12 lg:pb-20\",\"children\":[[\"$\",\"header\",null,{\"className\":\"text-center text-3xl lg:text-left\",\"children\":[[\"$\",\"$L6\",null,{\"href\":\"/\",\"aria-label\":\"Poimandres Docs\",\"className\":\"font-bold\",\"children\":[[\"$\",\"span\",null,{\"className\":\"sm:hidden\",\"children\":\"docs\"}],[\"$\",\"span\",null,{\"className\":\"hidden sm:inline\",\"children\":\"documentation\"}]]}],\".\",[\"$\",\"$L6\",null,{\"href\":\"https://pmnd.rs\",\"children\":\"pmnd.rs\"}]]}],[\"$\",\"main\",null,{\"className\":\"max-w-8xl mt-8 grid w-full grid-cols-1 gap-8 lg:mt-10 lg:grid-cols-2 lg:gap-12 2xl:grid-cols-3\",\"children\":[[\"$\",\"div\",\"react-three-fiber\",{\"className\":\"group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative z-10 flex h-full flex-col justify-between\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-6 px-6 py-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"max-w-md\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-lg font-bold\",\"children\":\"React Three Fiber\"}],[\"$\",\"div\",null,{\"className\":\"flex-grow text-sm !leading-relaxed text-on-surface-variant/50\",\"children\":\"React-three-fiber is a React renderer for three.js\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/react-three-fiber\",\"target\":\"_blank\",\"rel\":\"noopener\",\"className\":\"relative block h-20 w-20 flex-shrink-0\",\"children\":[\"$\",\"$L7\",null,{\"src\":\"/_next/static/media/r3f-icon.202966d3.svg\",\"className\":\"absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0\",\"alt\":\"React Three Fiber\",\"aria-hidden\":true,\"width\":500,\"height\":500}]}]]}],[\"$\",\"div\",null,{\"className\":\"flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm\",\"children\":[[\"$\",\"$L6\",null,{\"href\":\"/react-three-fiber\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z\"}]}],[\"$\",\"span\",null,{\"className\":\"sm:hidden\",\"children\":\"Docs\"}],[\"$\",\"span\",null,{\"className\":\"hidden sm:inline\",\"children\":\"Documentation\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/react-three-fiber\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"$8\"}]}],[\"$\",\"span\",null,{\"children\":\"GitHub\"}]]}]]}]]}]}],[\"$\",\"div\",\"react-spring\",{\"className\":\"group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative z-10 flex h-full flex-col justify-between\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-6 px-6 py-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"max-w-md\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-lg font-bold\",\"children\":\"React Spring\"}],[\"$\",\"div\",null,{\"className\":\"flex-grow text-sm !leading-relaxed text-on-surface-variant/50\",\"children\":\"Bring your components to life with simple spring animation primitives for React\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/react-spring\",\"target\":\"_blank\",\"rel\":\"noopener\",\"className\":\"relative block h-20 w-20 flex-shrink-0\",\"children\":[\"$\",\"$L7\",null,{\"src\":\"/_next/static/media/react-spring-icon.b7fe2db3.svg\",\"className\":\"absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0\",\"alt\":\"React Spring\",\"aria-hidden\":true,\"width\":800,\"height\":800}]}]]}],[\"$\",\"div\",null,{\"className\":\"flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm\",\"children\":[[\"$\",\"$L6\",null,{\"href\":\"https://react-spring.io\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z\"}]}],[\"$\",\"span\",null,{\"className\":\"sm:hidden\",\"children\":\"Docs\"}],[\"$\",\"span\",null,{\"className\":\"hidden sm:inline\",\"children\":\"Documentation\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/react-spring\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"$9\"}]}],[\"$\",\"span\",null,{\"children\":\"GitHub\"}]]}]]}]]}]}],[\"$\",\"div\",\"drei\",{\"className\":\"group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative z-10 flex h-full flex-col justify-between\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-6 px-6 py-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"max-w-md\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-lg font-bold\",\"children\":\"Drei\"}],[\"$\",\"div\",null,{\"className\":\"flex-grow text-sm !leading-relaxed text-on-surface-variant/50\",\"children\":\"Drei is a growing collection of useful helpers and abstractions for react-three-fiber\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/drei\",\"target\":\"_blank\",\"rel\":\"noopener\",\"className\":\"relative block h-20 w-20 flex-shrink-0\",\"children\":[\"$\",\"$L7\",null,{\"src\":\"/_next/static/media/drei-icon.cbe3cdab.svg\",\"className\":\"absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0\",\"alt\":\"Drei\",\"aria-hidden\":true,\"width\":500,\"height\":500}]}]]}],[\"$\",\"div\",null,{\"className\":\"flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm\",\"children\":[[\"$\",\"$L6\",null,{\"href\":\"/drei\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z\"}]}],[\"$\",\"span\",null,{\"className\":\"sm:hidden\",\"children\":\"Docs\"}],[\"$\",\"span\",null,{\"className\":\"hidden sm:inline\",\"children\":\"Documentation\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/drei\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"$a\"}]}],[\"$\",\"span\",null,{\"children\":\"GitHub\"}]]}]]}]]}]}],[\"$\",\"div\",\"zustand\",{\"className\":\"group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative z-10 flex h-full flex-col justify-between\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-6 px-6 py-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"max-w-md\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-lg font-bold\",\"children\":\"Zustand\"}],[\"$\",\"div\",null,{\"className\":\"flex-grow text-sm !leading-relaxed text-on-surface-variant/50\",\"children\":\"Zustand is a small, fast and scalable bearbones state-management solution, it has a comfy api based on hooks\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/zustand\",\"target\":\"_blank\",\"rel\":\"noopener\",\"className\":\"relative block h-20 w-20 flex-shrink-0\",\"children\":[\"$\",\"$L7\",null,{\"src\":\"/_next/static/media/zustand-icon.3261dd51.svg\",\"className\":\"absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0\",\"alt\":\"Zustand\",\"aria-hidden\":true,\"width\":512,\"height\":512}]}]]}],[\"$\",\"div\",null,{\"className\":\"flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm\",\"children\":[[\"$\",\"$L6\",null,{\"href\":\"/zustand\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z\"}]}],[\"$\",\"span\",null,{\"className\":\"sm:hidden\",\"children\":\"Docs\"}],[\"$\",\"span\",null,{\"className\":\"hidden sm:inline\",\"children\":\"Documentation\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/zustand\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"$b\"}]}],[\"$\",\"span\",null,{\"children\":\"GitHub\"}]]}]]}]]}]}],[\"$\",\"div\",\"jotai\",{\"className\":\"group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative z-10 flex h-full flex-col justify-between\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-6 px-6 py-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"max-w-md\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-lg font-bold\",\"children\":\"Jotai\"}],[\"$\",\"div\",null,{\"className\":\"flex-grow text-sm !leading-relaxed text-on-surface-variant/50\",\"children\":\"Jotai is a primitive and flexible state management library for React\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/jotai\",\"target\":\"_blank\",\"rel\":\"noopener\",\"className\":\"relative block h-20 w-20 flex-shrink-0\",\"children\":[\"$\",\"$L7\",null,{\"src\":\"/_next/static/media/jotai-icon.c4c64662.png\",\"className\":\"absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0\",\"alt\":\"Jotai\",\"aria-hidden\":true,\"width\":128,\"height\":116}]}]]}],[\"$\",\"div\",null,{\"className\":\"flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm\",\"children\":[[\"$\",\"$L6\",null,{\"href\":\"https://jotai.org/docs/introduction\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z\"}]}],[\"$\",\"span\",null,{\"className\":\"sm:hidden\",\"children\":\"Docs\"}],[\"$\",\"span\",null,{\"className\":\"hidden sm:inline\",\"children\":\"Documentation\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/jotai\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"$c\"}]}],[\"$\",\"span\",null,{\"children\":\"GitHub\"}]]}]]}]]}]}],[\"$\",\"div\",\"valtio\",{\"className\":\"group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative z-10 flex h-full flex-col justify-between\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-6 px-6 py-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"max-w-md\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-lg font-bold\",\"children\":\"Valtio\"}],[\"$\",\"div\",null,{\"className\":\"flex-grow text-sm !leading-relaxed text-on-surface-variant/50\",\"children\":\"Valtio makes proxy-state simple for React and Vanilla\"}]]}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm\",\"children\":[[\"$\",\"$L6\",null,{\"href\":\"https://valtio.pmnd.rs\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z\"}]}],[\"$\",\"span\",null,{\"className\":\"sm:hidden\",\"children\":\"Docs\"}],[\"$\",\"span\",null,{\"className\":\"hidden sm:inline\",\"children\":\"Documentation\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/valtio\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"$d\"}]}],[\"$\",\"span\",null,{\"children\":\"GitHub\"}]]}]]}]]}]}],[\"$\",\"div\",\"a11y\",{\"className\":\"group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative z-10 flex h-full flex-col justify-between\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-6 px-6 py-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"max-w-md\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-lg font-bold\",\"children\":\"A11y\"}],[\"$\",\"div\",null,{\"className\":\"flex-grow text-sm !leading-relaxed text-on-surface-variant/50\",\"children\":\"@react-three/a11y brings accessibility to webGL with easy-to-use react-three-fiber components\"}]]}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm\",\"children\":[[\"$\",\"$L6\",null,{\"href\":\"/a11y\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z\"}]}],[\"$\",\"span\",null,{\"className\":\"sm:hidden\",\"children\":\"Docs\"}],[\"$\",\"span\",null,{\"className\":\"hidden sm:inline\",\"children\":\"Documentation\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/react-three-a11y\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"$e\"}]}],[\"$\",\"span\",null,{\"children\":\"GitHub\"}]]}]]}]]}]}],[\"$\",\"div\",\"react-postprocessing\",{\"className\":\"group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative z-10 flex h-full flex-col justify-between\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-6 px-6 py-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"max-w-md\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-lg font-bold\",\"children\":\"React Postprocessing\"}],[\"$\",\"div\",null,{\"className\":\"flex-grow text-sm !leading-relaxed text-on-surface-variant/50\",\"children\":\"React Postprocessing is a postprocessing wrapper for @react-three/fiber\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/react-postprocessing\",\"target\":\"_blank\",\"rel\":\"noopener\",\"className\":\"relative block h-20 w-20 flex-shrink-0\",\"children\":[\"$\",\"$L7\",null,{\"src\":\"/_next/static/media/pp-icon.4846b21f.svg\",\"className\":\"absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0\",\"alt\":\"React Postprocessing\",\"aria-hidden\":true,\"width\":956,\"height\":956}]}]]}],[\"$\",\"div\",null,{\"className\":\"flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm\",\"children\":[[\"$\",\"$L6\",null,{\"href\":\"/react-postprocessing\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z\"}]}],[\"$\",\"span\",null,{\"className\":\"sm:hidden\",\"children\":\"Docs\"}],[\"$\",\"span\",null,{\"className\":\"hidden sm:inline\",\"children\":\"Documentation\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/react-postprocessing\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"$f\"}]}],[\"$\",\"span\",null,{\"children\":\"GitHub\"}]]}]]}]]}]}],[\"$\",\"div\",\"uikit\",{\"className\":\"group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative z-10 flex h-full flex-col justify-between\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-6 px-6 py-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"max-w-md\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-lg font-bold\",\"children\":\"uikit\"}],[\"$\",\"div\",null,{\"className\":\"flex-grow text-sm !leading-relaxed text-on-surface-variant/50\",\"children\":\"uikit brings user interfaces to @react-three/fiber\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/uikit\",\"target\":\"_blank\",\"rel\":\"noopener\",\"className\":\"relative block h-20 w-20 flex-shrink-0\",\"children\":[\"$\",\"$L7\",null,{\"src\":\"/_next/static/media/uikit-icon.232326fa.svg\",\"className\":\"absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0\",\"alt\":\"uikit\",\"aria-hidden\":true,\"width\":142,\"height\":124}]}]]}],[\"$\",\"div\",null,{\"className\":\"flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm\",\"children\":[[\"$\",\"$L6\",null,{\"href\":\"/uikit\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z\"}]}],[\"$\",\"span\",null,{\"className\":\"sm:hidden\",\"children\":\"Docs\"}],[\"$\",\"span\",null,{\"className\":\"hidden sm:inline\",\"children\":\"Documentation\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/uikit\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"$10\"}]}],[\"$\",\"span\",null,{\"children\":\"GitHub\"}]]}]]}]]}]}],[\"$\",\"div\",\"xr\",{\"className\":\"group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative z-10 flex h-full flex-col justify-between\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-6 px-6 py-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"max-w-md\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-lg font-bold\",\"children\":\"xr\"}],[\"$\",\"div\",null,{\"className\":\"flex-grow text-sm !leading-relaxed text-on-surface-variant/50\",\"children\":\"VR/AR for @react-three/fiber\"}]]}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm\",\"children\":[[\"$\",\"$L6\",null,{\"href\":\"/xr\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z\"}]}],[\"$\",\"span\",null,{\"className\":\"sm:hidden\",\"children\":\"Docs\"}],[\"$\",\"span\",null,{\"className\":\"hidden sm:inline\",\"children\":\"Documentation\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/xr\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"$11\"}]}],[\"$\",\"span\",null,{\"children\":\"GitHub\"}]]}]]}]]}]}],[\"$\",\"div\",\"docs\",{\"className\":\"group/card bg-surface-container relative overflow-hidden rounded-md border border-outline-variant font-normal\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative z-10 flex h-full flex-col justify-between\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-6 px-6 py-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"max-w-md\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-lg font-bold\",\"children\":\"Docs\"}],[\"$\",\"div\",null,{\"className\":\"flex-grow text-sm !leading-relaxed text-on-surface-variant/50\",\"children\":\"Documentation generator for `pmndrs/*`\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/docs\",\"target\":\"_blank\",\"rel\":\"noopener\",\"className\":\"relative block h-20 w-20 flex-shrink-0\",\"children\":[\"$\",\"$L7\",null,{\"src\":\"/_next/static/media/docs-icon.76842f92.png\",\"className\":\"absolute inset-0 h-full w-full object-contain grayscale transition group-hover/card:grayscale-0\",\"alt\":\"Docs\",\"aria-hidden\":true,\"width\":157,\"height\":188}]}]]}],[\"$\",\"div\",null,{\"className\":\"flex w-full divide-x divide-outline-variant border-t border-outline-variant text-sm\",\"children\":[[\"$\",\"$L6\",null,{\"href\":\"/getting-started/introduction\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"M2.5 1C1.675781 1 1 1.675781 1 2.5L1 12.5C1 13.324219 1.675781 14 2.5 14L12.5 14C13.324219 14 14 13.324219 14 12.5L14 2.5C14 1.675781 13.324219 1 12.5 1 Z M 2.5 2L12.5 2C12.78125 2 13 2.21875 13 2.5L13 12.5C13 12.78125 12.78125 13 12.5 13L2.5 13C2.21875 13 2 12.78125 2 12.5L2 2.5C2 2.21875 2.21875 2 2.5 2 Z M 4 5L4 6L11 6L11 5 Z M 4 7L4 8L11 8L11 7 Z M 4 9L4 10L9 10L9 9Z\"}]}],[\"$\",\"span\",null,{\"className\":\"sm:hidden\",\"children\":\"Docs\"}],[\"$\",\"span\",null,{\"className\":\"hidden sm:inline\",\"children\":\"Documentation\"}]]}],[\"$\",\"a\",null,{\"href\":\"https://github.com/pmndrs/docs\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"interactive-bg-surface-container inline-flex flex-1 items-center space-x-2 px-6 py-4 transition-colors\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\",\"aria-hidden\":true,\"className\":\"h-5 w-5 flex-none\",\"children\":[\"$\",\"path\",null,{\"d\":\"$12\"}]}],[\"$\",\"span\",null,{\"children\":\"GitHub\"}]]}]]}]]}]}]]}]]}]}],null],null],null]},[[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/947026db73999779.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"suppressHydrationWarning\":true,\"children\":[[\"$\",\"head\",null,{\"children\":[\"$\",\"$L13\",null,{}]}],[\"$\",\"body\",null,{\"className\":\"__className_d65c78 bg-surface break-words\",\"children\":[\"$\",\"$L14\",null,{\"attribute\":\"class\",\"children\":[\"$\",\"$L15\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L16\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":\"404\"}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],\"notFoundStyles\":[]}]}]}]]}]],null],null],\"couldBeIntercepted\":false,\"initialHead\":[null,\"$L17\"],\"globalErrorComponent\":\"$18\",\"missingSlots\":\"$W19\"}]\n"])</script><script>self.__next_f.push([1,"17:[[\"$\",\"meta\",\"0\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}],[\"$\",\"meta\",\"1\",{\"charSet\":\"utf-8\"}],[\"$\",\"title\",\"2\",{\"children\":\"Poimandres documentation\"}],[\"$\",\"meta\",\"3\",{\"name\":\"description\",\"content\":\"Index of documentation for pmndrs/* libraries\"}],[\"$\",\"meta\",\"4\",{\"property\":\"og:title\",\"content\":\"Poimandres documentation\"}],[\"$\",\"meta\",\"5\",{\"property\":\"og:description\",\"content\":\"Index of documentation for pmndrs/* libraries\"}],[\"$\",\"meta\",\"6\",{\"property\":\"og:image\",\"content\":\"http://localhost:3000/logo.png\"}],[\"$\",\"meta\",\"7\",{\"name\":\"twitter:card\",\"content\":\"summary_large_image\"}],[\"$\",\"meta\",\"8\",{\"name\":\"twitter:title\",\"content\":\"Poimandres documentation\"}],[\"$\",\"meta\",\"9\",{\"name\":\"twitter:description\",\"content\":\"Index of documentation for pmndrs/* libraries\"}],[\"$\",\"meta\",\"10\",{\"name\":\"twitter:image\",\"content\":\"http://localhost:3000/logo.png\"}],[\"$\",\"meta\",\"11\",{\"name\":\"next-size-adjust\"}]]\n5:null\n"])</script></body></html><style id="sandpack">--sxs{--sxs:1 sp-k-eyOShd sp-k-iOHdLQ}@media{@keyframes sp-k-eyOShd{0%{opacity:0}100%{opacity:1}}@keyframes sp-k-iOHdLQ{0%{transform:rotateX(-25.5deg) rotateY(45deg)}100%{transform:rotateX(-25.5deg) rotateY(405deg)}}}--sxs{--sxs:2 sp-c-gMfcns sp-c-bxeRRt sp-c-jKPvnt sp-c-fWymNx sp-c-euXojQ sp-c-bpmgvy sp-c-PJLV}@media{.sp-c-gMfcns svg{margin:auto}.sp-c-bxeRRt{-webkit-appearance:none;appearance:none;outline:none;display:flex;align-items:center;font-size:inherit;font-family:inherit;background-color:transparent;transition:color var(--sp-transitions-default), background var(--sp-transitions-default);cursor:pointer;color:var(--sp-colors-clickable);border:0;text-decoration:none}.sp-c-bxeRRt:disabled{color:var(--sp-colors-disabled)}.sp-c-bxeRRt:hover:not(:disabled,[data-active='true']){color:var(--sp-colors-hover)}.sp-c-bxeRRt[data-active="true"]{color:var(--sp-colors-accent)}.sp-c-bxeRRt svg{min-width:var(--sp-space-4);width:var(--sp-space-4);height:var(--sp-space-4)}.sp-c-bxeRRt.sp-c-gMfcns{padding:var(--sp-space-1);height:var(--sp-space-7);display:flex}.sp-c-bxeRRt.sp-c-gMfcns.sp-c-bxeRRt:not(:has(span)){width:var(--sp-space-7)}.sp-c-bxeRRt.sp-c-gMfcns.sp-c-bxeRRt:has(svg + span){padding-right:var(--sp-space-3);padding-left:var(--sp-space-2);gap:var(--sp-space-1)}.sp-c-jKPvnt{padding:0 var(--sp-space-1) 0 var(--sp-space-1);border-radius:var(--sp-border-radius);margin-left:var(--sp-space-1);width:var(--sp-space-5);visibility:hidden;cursor:pointer;position:absolute;right:0px}.sp-c-jKPvnt svg{width:var(--sp-space-3);height:var(--sp-space-3);display:block;position:relative;top:1px}.sp-c-fWymNx{margin:0;display:block;font-family:var(--sp-font-mono);font-size:var(--sp-font-size);color:var(--sp-syntax-color-plain);line-height:var(--sp-font-lineHeight)}.sp-c-euXojQ{display:flex;flex-direction:column;width:100%;position:relative;background-color:var(--sp-colors-surface1);gap:1px}.sp-c-euXojQ:has(.sp-stack){background-color:var(--sp-colors-surface2)}.sp-c-bpmgvy{transform:translate(-4px, 9px) scale(0.13, 0.13)}.sp-c-bpmgvy *{position:absolute;width:96px;height:96px}}--sxs{--sxs:3 sp-c-PJLV-kCOVwI-status-pass sp-c-PJLV-kEzYsr-status-fail sp-c-PJLV-gHAhSA-status-skip sp-c-PJLV-jgnHyR-status-title sp-c-PJLV-iCgxLS-status-run sp-c-PJLV-bnDZSy-status-pass sp-c-PJLV-eYuGwt-status-fail}@media{.sp-c-PJLV-kCOVwI-status-pass{color:var(--test-pass)}.sp-c-PJLV-kEzYsr-status-fail{color:var(--test-fail)}.sp-c-PJLV-gHAhSA-status-skip{color:var(--test-skip)}.sp-c-PJLV-jgnHyR-status-title{color:var(--test-title)}.sp-c-PJLV-iCgxLS-status-run{background:var(--test-run);color:var(--sp-colors-surface1)}.sp-c-PJLV-bnDZSy-status-pass{background:var(--test-pass);color:var(--sp-colors-surface1)}.sp-c-PJLV-eYuGwt-status-fail{background:var(--test-fail);color:var(--sp-colors-surface1)}}</style>