CINXE.COM

<!DOCTYPE html><html lang="en"><head><meta name="astro-view-transitions-enabled" content="true"><meta name="astro-view-transitions-fallback" content="none"><meta charset="UTF-8"><meta name="description" content="Project IDX is an entirely web-based workspace for full-stack application development, complete with the latest generative AI from Gemini, and full-fidelity app previews, powered by cloud emulators."><meta name="viewport" content="width=device-width"><meta name="generator" content="Astro v4.10.1"><link rel="sitemap" href="/sitemap-index.xml"><link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"><link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"><link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"><link rel="manifest" href="/site.webmanifest"><link rel="mask-icon" href="/safari-pinned-tab.svg" color="#a87ffb"><meta name="apple-mobile-web-app-title" content="Project IDX"><meta name="application-name" content="Project IDX"><meta name="msapplication-TileColor" content="#10151d"><meta name="theme-color" content="#10151d"><meta property="og:type" content="website"><meta property="og:url" content="https://idx.dev"><meta property="og:title" content="Project IDX"><meta property="og:description" content="Project IDX is an entirely web-based workspace for full-stack application development, complete with the latest generative AI from Gemini, and full-fidelity app previews, powered by cloud emulators."><meta property="og:image" content="https://cdn.raster.app/google/idx/AfEGWyeSKl?ixlib=js-3.7.0&width=1200&height=630&compress=false&q=85&s=9da0a8f7e17838c341fe30f15b699317"><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Google+Sans+Display:wght@400;500;700&display=swap"><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Google+Sans+Text:wght@300;400;500;600;700&display=swap"><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Google+Sans+Mono:wght@400;500;600;700&display=swap"><link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet"><title>Project IDX</title><script type="text/partytown" src="https://www.googletagmanager.com/gtag/js?id=G-GMNGFBDXTR"></script><script type="text/partytown">window.dataLayer = window.dataLayer || [] function gtag() { dataLayer.push(arguments) } gtag('js', new Date()) gtag('config', 'G-GMNGFBDXTR')</script><link rel="stylesheet" href="/_astro/_page_.DLtxn820.css"><style>.mtanim-container{--cell-width:26px;--cell-height:38px;--cell-font-size:19px;--max-rows:4;width:calc(var(--max-cols) * var(--cell-width));height:calc(var(--max-rows) * var(--cell-height));position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;font-family:Google Sans Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-weight:500}@media (min-width: 360px){.mtanim-container{--cell-width:30px;--cell-height:44px;--cell-font-size:22px}}@media (min-width: 400px){.mtanim-container{--cell-width:35px;--cell-height:52px;--cell-font-size:26px}}@media (min-width: 640px){.mtanim-container{--cell-width:42px;--cell-height:62px;--cell-font-size:31px;--max-rows:3}}@media (min-width: 1024px){.mtanim-container{--cell-width:50px;--cell-height:74px;--cell-font-size:37px}}@media (min-width: 1280px){.mtanim-container{--cell-width:64px;--cell-height:95px;--cell-font-size:48px}}.mtanim-slide{position:absolute;left:0;top:0;display:flex;flex-direction:column}.mtanim-cell{width:var(--cell-width);height:var(--cell-height);font-size:var(--cell-font-size);line-height:100%;box-sizing:border-box;flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.mtanim-cell span{position:relative;width:100%;text-align:center}.mtanim-cell[data-span]{align-items:flex-start}.mtanim-cell[data-span] span{width:calc(var(--cell-width) * 2)}.mtanim-cell[data-color=C]{--tw-text-opacity:1;color:rgb(37 166 233/var(--tw-text-opacity))}.mtanim-cell[data-color=M]{--tw-text-opacity:1;color:rgb(168 127 251/var(--tw-text-opacity))}.mtanim-cell[data-color=Y]{--tw-text-opacity:1;color:rgb(255 194 110/var(--tw-text-opacity))}.mtanim-cell[data-color=G]{--tw-text-opacity:1;color:rgb(23 184 119/var(--tw-text-opacity))}.mtanim-cell.is-random{--tw-text-opacity:1;color:rgb(46 60 81/var(--tw-text-opacity))}.mtanim-cell.is-symbol{font-family:JetBrains Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.mtanim-cell.is-space span{visibility:hidden}.mtanim-cell:not(.is-space){--tw-bg-opacity:1;background-color:rgb(16 21 29/var(--tw-bg-opacity));--tw-shadow-color:#2E3C51;--tw-shadow:var(--tw-shadow-colored);box-shadow:0 0 0 .5px #2e3c51 inset,0 0 0 .5px #2e3c51}.title[data-astro-cid-pbgv5ggz],.rich-text[data-astro-cid-pbgv5ggz]{@media (min-width: 1024px){max-width:var(--max-width-when-narrow, none)}@media (max-width: 639px){max-width:var(--max-width-when-narrow, none)}}.rich-text[data-astro-cid-pbgv5ggz] .small{font-size:10px} .astro-route-announcer{position:absolute;left:0;top:0;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;white-space:nowrap;width:1px;height:1px}.menu-to-close[data-astro-cid-zdwhra5n]{--size: 16px;display:flex;width:var(--size);height:var(--size);overflow:hidden}.menu-to-close[data-astro-cid-zdwhra5n] svg[data-astro-cid-zdwhra5n]{flex:0 0 auto;width:auto;height:var(--size);transition:transform .3s steps(30,start)}.menu-to-close[data-astro-cid-zdwhra5n][data-close] svg[data-astro-cid-zdwhra5n]{transform:translate(calc(-100% + var(--size)))}.site-footer[data-astro-cid-sz7xmlte] a[data-astro-cid-sz7xmlte]{display:flex;align-items:center}.site-footer[data-astro-cid-sz7xmlte] a[data-astro-cid-sz7xmlte]:hover{--tw-text-opacity: 1;color:rgb(200 170 255 / var(--tw-text-opacity))}.site-footer[data-astro-cid-sz7xmlte] a[data-astro-cid-sz7xmlte]{gap:8px}.site-footer-row[data-astro-cid-sz7xmlte]{display:flex;align-items:center}@media (max-width: 1023px){.site-footer-row[data-astro-cid-sz7xmlte]{justify-content:center}}@media (min-width: 1024px){.site-footer-row[data-astro-cid-sz7xmlte].is-end{flex:1 1 0%;justify-content:flex-end}}.footer-separator[data-astro-cid-sz7xmlte]{margin-left:12px;margin-right:12px;width:12px;--tw-bg-opacity: 1;background-color:rgb(137 100 232 / var(--tw-bg-opacity))}@media (max-width: 1023px){.footer-separator[data-astro-cid-sz7xmlte]{margin-left:8px;margin-right:8px;width:8px}}.footer-separator[data-astro-cid-sz7xmlte]{height:1px}</style><script type="module" src="/_astro/hoisted.DDUJ2XyC.js"></script><script type="module" src="/_astro/page.C66G14YQ.js"></script><script>!(function(w,p,f,c){if(!window.crossOriginIsolated && !navigator.serviceWorker) return;c=w[p]=Object.assign(w[p]||{},{"lib":"/~partytown/","debug":false});c[f]=(c[f]||[]).concat(["dataLayer.push"])})(window,'partytown','forward');/* Partytown 0.10.2 - MIT builder.io */ const t={preserveBehavior:!1},e=e=>{if("string"==typeof e)return[e,t];const[n,r=t]=e;return[n,{...t,...r}]},n=Object.freeze((t=>{const e=new Set;let n=[];do{Object.getOwnPropertyNames(n).forEach((t=>{"function"==typeof n[t]&&e.add(t)}))}while((n=Object.getPrototypeOf(n))!==Object.prototype);return Array.from(e)})());!function(t,r,o,i,a,s,c,d,l,p,u=t,f){function h(){f||(f=1,"/"==(c=(s.lib||"/~partytown/")+(s.debug?"debug/":""))[0]&&(l=r.querySelectorAll('script[type="text/partytown"]'),i!=t?i.dispatchEvent(new CustomEvent("pt1",{detail:t})):(d=setTimeout(v,1e4),r.addEventListener("pt0",w),a?y(1):o.serviceWorker?o.serviceWorker.register(c+(s.swPath||"partytown-sw.js"),{scope:c}).then((function(t){t.active?y():t.installing&&t.installing.addEventListener("statechange",(function(t){"activated"==t.target.state&&y()}))}),console.error):v())))}function y(e){p=r.createElement(e?"script":"iframe"),t._pttab=Date.now(),e||(p.style.display="block",p.style.width="0",p.style.height="0",p.style.border="0",p.style.visibility="hidden",p.setAttribute("aria-hidden",!0)),p.src=c+"partytown-"+(e?"atomics.js?v=0.10.2":"sandbox-sw.html?"+t._pttab),r.querySelector(s.sandboxParent||"body").appendChild(p)}function v(n,o){for(w(),i==t&&(s.forward||[]).map((function(n){const[r]=e(n);delete t[r.split(".")[0]]})),n=0;n<l.length;n++)(o=r.createElement("script")).innerHTML=l[n].innerHTML,o.nonce=s.nonce,r.head.appendChild(o);p&&p.parentNode.removeChild(p)}function w(){clearTimeout(d)}s=t.partytown||{},i==t&&(s.forward||[]).map((function(r){const[o,{preserveBehavior:i}]=e(r);u=t,o.split(".").map((function(e,r,o){var a;u=u[o[r]]=r+1<o.length?u[o[r]]||(a=o[r+1],n.includes(a)?[]:{}):(()=>{let e=null;if(i){const{methodOrProperty:n,thisObject:r}=((t,e)=>{let n=t;for(let t=0;t<e.length-1;t+=1)n=n[e[t]];return{thisObject:n,methodOrProperty:e.length>0?n[e[e.length-1]]:void 0}})(t,o);"function"==typeof n&&(e=(...t)=>n.apply(r,...t))}return function(){let n;return e&&(n=e(arguments)),(t._ptf=t._ptf||[]).push(o,arguments),n}})()}))})),"complete"==r.readyState?h():(t.addEventListener("DOMContentLoaded",h),t.addEventListener("load",h))}(window,document,navigator,top,window.crossOriginIsolated);;((d,s)=>(s=d.currentScript,d.addEventListener('astro:before-swap',()=>s.remove(),{once:true})))(document);</script></head><body><nav id="nav" class="nav-transparent"><div class="nav-items"><a href="https://idx.google.com" title="Project IDX" class="nav-item max-md:py-3 gap-2 z-50"><svg viewBox="0 0 192 192" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-7 max-md:w-6"><rect x="28" y="156" width="88" height="24" rx="12" class="fill-purple-500"></rect><rect x="104" y="120" width="36" height="24" rx="12" class="fill-green-400"></rect><rect x="56" y="120" width="36" height="24" rx="12" class="fill-green-400"></rect><rect x="84" y="84" width="52" height="24" rx="12" class="fill-yellow-400"></rect><rect x="148" y="84" width="24" height="24" rx="12" class="fill-yellow-400"></rect><rect x="56" y="48" width="88" height="24" rx="12" class="fill-blue-400"></rect><rect x="64" y="12" width="52" height="24" rx="12" class="fill-purple-500"></rect><rect x="28" y="12" width="24" height="24" rx="12" class="fill-purple-500"></rect></svg> <span class="sr-only">Project IDX</span> </a><label tabindex="0" for="nav-mobile-menu-trigger" class="nav-item"><div class="menu-icon-animation menu-to-close" data-astro-cid-zdwhra5n><svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 496 16" width="496" height="16" data-astro-cid-zdwhra5n><path d="M0 4h16v1H0zm0 4h16v1H0zm0 4h16v1H0zm16-7.957h16v1H16zM16 8h16v1H16zm0 3.957h16v1H16zM32 4.2h16v1H32zM32 8h16v1H32zm0 3.8h16v1H32zm16-7.264h16v1H48zM48 8h16v1H48zm0 3.464h16v1H48zm16-6.352h16v1H64zM64 8h16v1H64zm0 2.888h16v1H64zm16-5.059h16v1H80zM80 8h16v1H80zm0 2.171h16v1H80zm16-3.717h16v1H96zM96 8h16v1H96zm0 1.546h16v1H96zm16-2.626h16v1h-16zM112 8h16v1h-16zm0 1.08h16v1h-16zm16-1.822h16v1h-16z" data-astro-cid-zdwhra5n></path><path d="M128 8h16v1h-16z" data-astro-cid-zdwhra5n></path><path d="M128 8.742h16v1h-16zm16-1.238h16v1h-16z" data-astro-cid-zdwhra5n></path><path d="M144 8h16v1h-16z" data-astro-cid-zdwhra5n></path><path d="M144 8.496h16v1h-16zm16-.813h16v1h-16z" data-astro-cid-zdwhra5n></path><path d="M160 8h16v1h-16z" data-astro-cid-zdwhra5n></path><path d="M160 8.317h16v1h-16z" data-astro-cid-zdwhra5n></path><g data-astro-cid-zdwhra5n><path d="M176 7.812h16v1h-16z" data-astro-cid-zdwhra5n></path><path d="M176 8h16v1h-16z" data-astro-cid-zdwhra5n></path><path d="M176 8.188h16v1h-16z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="M192 7.901h16v1h-16z" data-astro-cid-zdwhra5n></path><path d="M192 8h16v1h-16z" data-astro-cid-zdwhra5n></path><path d="M192 8.099h16v1h-16z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="M208 7.959h16v1h-16z" data-astro-cid-zdwhra5n></path><path d="M208 8h16v1h-16z" fill-opacity=".939" data-astro-cid-zdwhra5n></path><path d="M208 8.041h16v1h-16z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="M224 7.99h16v1h-16z" data-astro-cid-zdwhra5n></path><path d="M224 8h16v1h-16z" fill-opacity=".147" data-astro-cid-zdwhra5n></path><path d="M224 8.01h16v1h-16z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="M240 8h16v1h-16z" data-astro-cid-zdwhra5n></path><path d="M240 8h16v1h-16z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="m256.013 7.933 15.982.134-.008 1-15.982-.134z" data-astro-cid-zdwhra5n></path><path d="m256.005 8.067 15.982-.134.008 1-15.982.134z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="m272.066 7.688 15.908.624-.04 1-15.908-.624z" data-astro-cid-zdwhra5n></path><path d="m272.026 8.312 15.908-.624.04 1-15.908.624z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="m288.203 7.174 15.699 1.658-.105.994-15.699-1.658z" data-astro-cid-zdwhra5n></path><path d="m288.098 8.832 15.699-1.658.105.994-15.699 1.658z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="m304.515 6.327 15.186 3.37-.216.976-15.186-3.37z" data-astro-cid-zdwhra5n></path><path d="m304.299 9.697 15.186-3.37.216.976-15.186 3.37z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="m321.029 5.349 14.294 5.366-.352.936-14.294-5.366z" data-astro-cid-zdwhra5n></path><path d="m320.677 10.715 14.294-5.366.352.936-14.294 5.366z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="m337.578 4.577 13.308 6.96-.464.886-13.308-6.96z" data-astro-cid-zdwhra5n></path><path d="m337.114 11.537 13.308-6.96.464.886-13.308 6.96z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="m354.041 4.057 12.46 8.046-.542.84-12.46-8.046z" data-astro-cid-zdwhra5n></path><path d="m353.499 12.103 12.46-8.046.542.84-12.46 8.046z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="m370.403 3.712 11.791 8.773-.597.803-11.791-8.773z" data-astro-cid-zdwhra5n></path><path d="m369.806 12.485 11.791-8.773.597.803-11.791 8.773z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="m386.679 3.479 11.277 9.27-.635.772-11.277-9.27z" data-astro-cid-zdwhra5n></path><path d="m386.044 12.749 11.277-9.27.635.772-11.277 9.27z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="m402.885 3.318 10.891 9.614-.661.75-10.891-9.614z" data-astro-cid-zdwhra5n></path><path d="m402.224 12.932 10.89-9.614.662.75-10.89 9.614z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="m419.037 3.208 10.607 9.85-.68.734-10.608-9.85z" data-astro-cid-zdwhra5n></path><path d="m418.356 13.059 10.607-9.85.68.732-10.606 9.85z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="m435.143 3.135 10.407 10.01-.693.72-10.407-10.01z" data-astro-cid-zdwhra5n></path><path d="m434.45 13.145 10.407-10.01.693.72-10.407 10.01z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="M451.212 3.088 461.49 13.2l-.701.713L450.51 3.8z" data-astro-cid-zdwhra5n></path><path d="m450.511 13.2 10.277-10.112.7.713-10.276 10.11z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="m467.25 3.063 10.205 10.166-.706.708-10.204-10.166z" data-astro-cid-zdwhra5n></path><path d="m466.545 13.229 10.204-10.166.706.708-10.204 10.166z" data-astro-cid-zdwhra5n></path></g><g data-astro-cid-zdwhra5n><path d="m483.262 3.055 10.183 10.183-.707.707-10.183-10.183z" data-astro-cid-zdwhra5n></path><path d="m482.555 13.238 10.183-10.183.707.707-10.183 10.183z" data-astro-cid-zdwhra5n></path></g></svg></div><span class="sr-only">Menu</span></label> <input tabindex="-1" type="checkbox" id="nav-mobile-menu-trigger"><div class="nav-list"><a href="https://idx.google.com" class="nav-item"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M2 6.08447V13H14V6.08447L8.49075 2.98148C8.18608 2.80988 7.81392 2.80988 7.50925 2.98148L2 6.08447ZM1 6.08447V13C1 13.5523 1.44772 14 2 14H14C14.5523 14 15 13.5523 15 13V6.08447C15 5.7234 14.8054 5.39036 14.4907 5.21317L8.98149 2.11018C8.37216 1.76699 7.62784 1.76699 7.01851 2.11018L1.50925 5.21317C1.19465 5.39036 1 5.7234 1 6.08447Z" fill="currentColor"></path></svg> <span>Home</span> </a><a href="/blog" class="nav-item"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.01333 13.0133C5.01333 12.4444 4.81778 11.9644 4.42667 11.5733C4.03556 11.1822 3.55556 10.9867 2.98667 10.9867V13.0133H5.01333ZM2.98667 2.98667C4.8 2.98667 6.47111 3.44889 8 4.37333C9.52889 5.26222 10.7378 6.47111 11.6267 8C12.5511 9.52889 13.0133 11.2 13.0133 13.0133H12C12 11.3778 11.5911 9.86667 10.7733 8.48C9.99111 7.09333 8.90667 6.00889 7.52 5.22667C6.13333 4.40889 4.62222 4 2.98667 4V2.98667ZM2.98667 6.98667C4.08889 6.98667 5.08444 7.27111 5.97333 7.84C6.89778 8.37333 7.62667 9.10222 8.16 10.0267C8.72889 10.9156 9.01333 11.9111 9.01333 13.0133H8C8 12.0889 7.76889 11.2533 7.30667 10.5067C6.88 9.72444 6.27556 9.12 5.49333 8.69333C4.74667 8.23111 3.91111 8 2.98667 8V6.98667Z" fill="currentColor"></path></svg> <span>Blog</span> </a><a href="https://developers.google.com/idx" target="_blank" rel="noopener" class="nav-item"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.01333 12V10.9867H10.0267V12H1.01333ZM1.01333 6.98667H14.9867V8H1.01333V6.98667ZM12 2.98667V4H1.01333V2.98667H12Z" fill="currentColor"></path></svg> <span>Docs</span> </a><a href="https://developers.google.com/idx/support/help" target="_blank" rel="noopener" class="nav-item"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.01333 6.98667L4.96 4.96L6.98667 9.01333L11.04 11.04L9.01333 6.98667ZM9.44 9.44L7.52 8.48L6.56 6.56L8.48 7.52L9.44 9.44ZM13.9733 8.48H13.0133V7.52H13.9733C13.9022 6.56 13.6178 5.67111 13.12 4.85333C12.6222 4.03556 11.9644 3.37778 11.1467 2.88C10.3289 2.38222 9.44 2.09778 8.48 2.02667V2.98667H7.52V2.02667C6.56 2.09778 5.67111 2.38222 4.85333 2.88C4.07111 3.37778 3.41333 4.03556 2.88 4.85333C2.38222 5.63556 2.09778 6.50667 2.02667 7.46667H2.98667V8.48H2.02667C2.09778 9.44 2.38222 10.3289 2.88 11.1467C3.37778 11.9289 4.03556 12.5867 4.85333 13.12C5.67111 13.6178 6.56 13.9022 7.52 13.9733V13.0133H8.48V13.9733C9.44 13.9022 10.3289 13.6178 11.1467 13.12C11.9644 12.6222 12.6222 11.9644 13.12 11.1467C13.6178 10.3289 13.9022 9.44 13.9733 8.48ZM8 14.9867C6.72 14.9867 5.54667 14.6844 4.48 14.08C3.41333 13.44 2.56 12.5867 1.92 11.52C1.31556 10.4533 1.01333 9.28 1.01333 8C1.01333 6.72 1.31556 5.54667 1.92 4.48C2.56 3.41333 3.41333 2.57778 4.48 1.97333C5.54667 1.33333 6.72 1.01333 8 1.01333C9.28 1.01333 10.4533 1.33333 11.52 1.97333C12.5867 2.57778 13.4222 3.41333 14.0267 4.48C14.6667 5.54667 14.9867 6.72 14.9867 8C14.9867 9.28 14.6667 10.4533 14.0267 11.52C13.4222 12.5867 12.5867 13.44 11.52 14.08C10.4533 14.6844 9.28 14.9867 8 14.9867Z" fill="currentColor"></path></svg> <span>Support</span></a></div></div><a href="https://developers.google.com" title="Made by Google" class="max-md:hidden group p-3 md:p-4 flex justify-center" target="_blank" rel="noopener noreferrer"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 21" class="w-5 h-5 text-gray-300 group-hover:text-gray-400 transition-colors duration-500"><path class="fill-current" d="M20 11.04c0-.72-.063-1.436-.19-2.144h-9.597v3.929h5.532a4.727 4.727 0 0 1-2.05 3.163v2.548h3.284C18.899 16.761 20 14.139 20 11.039Z"></path><path class="fill-current" d="M13.69 15.988c-.916.617-2.094.977-3.477.977-2.66 0-4.926-1.792-5.735-4.207H1.086v2.628a10.201 10.201 0 0 0 3.766 4.098A10.228 10.228 0 0 0 10.212 21c2.76 0 5.079-.906 6.765-2.464l-3.287-2.548Z"></path><path class="fill-current" d="M4.16 10.807c0-.663.107-1.322.318-1.95V6.229H1.086a10.193 10.193 0 0 0 0 9.156l3.394-2.627a6.13 6.13 0 0 1-.32-1.95Z"></path><path class="fill-current" d="M10.213 4.65c1.505 0 2.854.516 3.92 1.528L17.05 3.27C15.28 1.624 12.97.615 10.213.615c-1.893 0-3.75.524-5.361 1.516a10.2 10.2 0 0 0-3.766 4.098L4.48 8.857c.81-2.415 3.073-4.208 5.733-4.208Z"></path></svg></a></nav><main class="md:relative min-h-screen flex flex-col justify-between overflow-x-clip md:grow"><header class="md:relative flex flex-col-reverse md:flex-col justify-center items-center md:text-center text-gray-500 pt-8 pb-14 min-h-[480px] md:min-h-[600px] h-screen max-h-[1280px] max-md:mb-16 px-4 sm:px-6 md:px-12"><div class="shine -z-10 absolute inset-0" role="presentation"></div><nav class="container flex-col-reverse xxs:flex xxs:justify-center xxs:flex-row items-center md:justify-end gap-3 mt-24 md:mt-0"><a href="/#introduction" class="button button-outline w-full xs:w-auto">Explore IDX</a><a href="https://accounts.google.com/AccountChooser/signinchooser?continue=https://idx.google.com" class="button button-primary xs:has-arrow w-full xs:w-auto">Get Started</a></nav><div class="container w-full md:max-w-[850px] md:flex-1 flex flex-col sm:items-center justify-center pt-16"><p class="text-lg font-display md:text-2xl mb-8 obscure-stars inline-block">What if your dev experience was</p><style>astro-island,astro-slot,astro-static-slot{display:contents}</style><script>(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).load=e;window.dispatchEvent(new Event("astro:load"));})();;(()=>{var A=Object.defineProperty;var g=(i,o,a)=>o in i?A(i,o,{enumerable:!0,configurable:!0,writable:!0,value:a}):i[o]=a;var d=(i,o,a)=>g(i,typeof o!="symbol"?o+"":o,a);{let i={0:t=>m(t),1:t=>a(t),2:t=>new RegExp(t),3:t=>new Date(t),4:t=>new Map(a(t)),5:t=>new Set(a(t)),6:t=>BigInt(t),7:t=>new URL(t),8:t=>new Uint8Array(t),9:t=>new Uint16Array(t),10:t=>new Uint32Array(t)},o=t=>{let[l,e]=t;return l in i?i[l](e):void 0},a=t=>t.map(o),m=t=>typeof t!="object"||t===null?t:Object.fromEntries(Object.entries(t).map(([l,e])=>[l,o(e)]));class y extends HTMLElement{constructor(){super(...arguments);d(this,"Component");d(this,"hydrator");d(this,"hydrate",async()=>{var b;if(!this.hydrator||!this.isConnected)return;let e=(b=this.parentElement)==null?void 0:b.closest("astro-island[ssr]");if(e){e.addEventListener("astro:hydrate",this.hydrate,{once:!0});return}let c=this.querySelectorAll("astro-slot"),n={},h=this.querySelectorAll("template[data-astro-template]");for(let r of h){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("data-astro-template")||"default"]=r.innerHTML,r.remove())}for(let r of c){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("name")||"default"]=r.innerHTML)}let p;try{p=this.hasAttribute("props")?m(JSON.parse(this.getAttribute("props"))):{}}catch(r){let s=this.getAttribute("component-url")||"<unknown>",v=this.getAttribute("component-export");throw v&&(s+=` (export ${v})`),console.error(`[hydrate] Error parsing props for component ${s}`,this.getAttribute("props"),r),r}let u;await this.hydrator(this)(this.Component,p,n,{client:this.getAttribute("client")}),this.removeAttribute("ssr"),this.dispatchEvent(new CustomEvent("astro:hydrate"))});d(this,"unmount",()=>{this.isConnected||this.dispatchEvent(new CustomEvent("astro:unmount"))})}disconnectedCallback(){document.removeEventListener("astro:after-swap",this.unmount),document.addEventListener("astro:after-swap",this.unmount,{once:!0})}connectedCallback(){if(!this.hasAttribute("await-children")||document.readyState==="interactive"||document.readyState==="complete")this.childrenConnectedCallback();else{let e=()=>{document.removeEventListener("DOMContentLoaded",e),c.disconnect(),this.childrenConnectedCallback()},c=new MutationObserver(()=>{var n;((n=this.lastChild)==null?void 0:n.nodeType)===Node.COMMENT_NODE&&this.lastChild.nodeValue==="astro:end"&&(this.lastChild.remove(),e())});c.observe(this,{childList:!0}),document.addEventListener("DOMContentLoaded",e)}}async childrenConnectedCallback(){let e=this.getAttribute("before-hydration-url");e&&await import(e),this.start()}async start(){let e=JSON.parse(this.getAttribute("opts")),c=this.getAttribute("client");if(Astro[c]===void 0){window.addEventListener(`astro:${c}`,()=>this.start(),{once:!0});return}try{await Astro[c](async()=>{let n=this.getAttribute("renderer-url"),[h,{default:p}]=await Promise.all([import(this.getAttribute("component-url")),n?import(n):()=>()=>{}]),u=this.getAttribute("component-export")||"default";if(!u.includes("."))this.Component=h[u];else{this.Component=h;for(let f of u.split("."))this.Component=this.Component[f]}return this.hydrator=p,this.hydrate},e,this)}catch(n){console.error(`[astro-island] Error hydrating ${this.getAttribute("component-url")}`,n)}}attributeChangedCallback(){this.hydrate()}}d(y,"observedAttributes",["props"]),customElements.get("astro-island")||customElements.define("astro-island",y)}})();</script><astro-island uid="Z1CkLnU" component-url="/_astro/HeroAnimation.KMcl1eg8.js" component-export="default" renderer-url="/_astro/client.Cx1FBVJX.js" props="{}" ssr="" client="load" opts="{"name":"HeroAnimation","value":true}" await-children=""><div class="mtanim-container"></div></astro-island><a href="#introduction" class="obscure-stars mt-24 hidden md:inline-block"><span class="sr-only">Introduction to Project IDX</span> <span class="squiggly-arrow text-4xl text-purple rotate-90"></span></a></div></header><section id="introduction" class="max-md:my-24"><div class="container max-w-[510px]"><script>(()=>{var l=(s,i,o)=>{let r=async()=>{await(await s())()},t=typeof i.value=="object"?i.value:void 0,c={rootMargin:t==null?void 0:t.rootMargin},n=new IntersectionObserver(e=>{for(let a of e)if(a.isIntersecting){n.disconnect(),r();break}},c);for(let e of o.children)n.observe(e)};(self.Astro||(self.Astro={})).visible=l;window.dispatchEvent(new Event("astro:visible"));})();</script><astro-island uid="uuGbO" component-url="/_astro/AnimatedAppLogo.BS4qq39S.js" component-export="default" renderer-url="/_astro/client.Cx1FBVJX.js" props="{"className":[0,"w-14 md:w-20 mb-8 md:mb-10 obscure-stars -ml-3"]}" ssr="" client="visible" opts="{"name":"AnimatedLogo","value":true}" await-children=""><div class="w-14 md:w-20 mb-8 md:mb-10 obscure-stars -ml-3 aspect-square block"></div></astro-island><h1 class="title text-3xl font-medium md:text-4xl mb-10 max-sm:mb-4 obscure-stars">Welcome to Project IDX</h1><p></p><div class="flex flex-col items-start gap-6 text-sm md:text-base mb-10 obscure-stars"><p style="max-width: 400px;">Project IDX is an AI-assisted workspace for full-stack, multiplatform app development in the cloud. With support for a broad range of frameworks, languages, and services, alongside integrations with your favorite Google products, IDX streamlines your development workflow so you can build and ship apps across platforms with speed, ease, and quality.</p><div class="flex items-start w-full mt-5 max-sm:mt-1 md:relative"><a href="https://accounts.google.com/AccountChooser/signinchooser?continue=https://idx.google.com" class="button button-primary w-full xs:w-auto has-arrow">Get Started</a></div></div></div></section><div id="features"><section class="my-16 md:my-32" data-astro-cid-pbgv5ggz><div class="container flex flex-col items-stretch lg:items-start lg:flex-row-reverse" data-astro-cid-pbgv5ggz><div class="relative overflow-hidden lg:w-2/3 lg:h-[650px] bg-gray-100 border border-gray-300 flex justify-center aspect-[4/3]" data-astro-cid-pbgv5ggz><div class="shine z-10 absolute inset-0" role="presentation" data-astro-cid-pbgv5ggz></div><script>(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).only=e;window.dispatchEvent(new Event("astro:only"));})();</script><astro-island uid="ZvdEiI" component-url="/_astro/SVGIllustration.CTfZcZaS.js" component-export="default" renderer-url="/_astro/client.Cx1FBVJX.js" props="{"slot":[0,"image"],"svg":[0,"idx-browser"]}" ssr="" client="only" opts="{"name":"SVGIllustration","value":"svelte"}"></astro-island></div><div class="lg:w-1/3 p-6 md:p-12 border border-gray-300 max-lg:border-t-0 text-sm bg-gray-100 lg:border-r-0" data-astro-cid-pbgv5ggz><img src="/images/code-chevron.svg" class="w-9 mb-6" alt="abstract icon depicting code lines" data-astro-cid-pbgv5ggz width="36" height="36" loading="lazy" decoding="async"><h2 class="title text-[24px]/[29px] md:text-[32px]/[38px] mb-5" style="--max-width-when-narrow: 15ch;" data-astro-cid-pbgv5ggz>Get to work quickly, wherever you are</h2><p class="mb-5 rich-text" style="--max-width-when-narrow: 280px;" data-astro-cid-pbgv5ggz>Project IDX gets you into your dev workflow in no time, backed by the security and scalability of Google Cloud. Go from opening your browser to building an application in a matter of seconds, not days.</p><div class="flex flex-wrap gap-x-8 mt-5" data-astro-cid-pbgv5ggz><a href="https://accounts.google.com/AccountChooser/signinchooser?continue=https://idx.google.com" class="button button-link text-purple has-arrow" data-astro-cid-pbgv5ggz>Get Started</a></div></div></div></section><section class="my-16 md:my-32" data-astro-cid-pbgv5ggz><div class="container flex flex-col items-stretch lg:items-start lg:flex-row" data-astro-cid-pbgv5ggz><div class="relative overflow-hidden lg:w-2/3 lg:h-[650px] bg-gray-100 border border-gray-300 flex justify-center aspect-[4/3]" data-astro-cid-pbgv5ggz><div class="shine z-10 absolute inset-0" role="presentation" data-astro-cid-pbgv5ggz></div><astro-island uid="sHMuU" component-url="/_astro/SVGIllustration.CTfZcZaS.js" component-export="default" renderer-url="/_astro/client.Cx1FBVJX.js" props="{"slot":[0,"image"],"svg":[0,"ai-assistant"]}" ssr="" client="only" opts="{"name":"SVGIllustration","value":"svelte"}"></astro-island></div><div class="lg:w-1/3 p-6 md:p-12 border border-gray-300 max-lg:border-t-0 text-sm bg-gray-100 lg:border-l-0" data-astro-cid-pbgv5ggz><img src="/images/gemini-logo.svg" class="w-9 mb-6" alt="abstract icon depicting code lines" data-astro-cid-pbgv5ggz width="36" height="36" loading="lazy" decoding="async"><h2 class="title text-[24px]/[29px] md:text-[32px]/[38px] mb-5" style="--max-width-when-narrow: 15ch;" data-astro-cid-pbgv5ggz>Develop with Gemini in IDX</h2><p class="mb-5 rich-text" style="--max-width-when-narrow: 320px;" data-astro-cid-pbgv5ggz>Work quickly and efficiently with built-in AI assistance from Gemini, Google’s largest and most capable AI model. Generate code, access inline coding suggestions, and get help understanding complex code in real time.</p><div class="flex flex-wrap gap-x-8 mt-5" data-astro-cid-pbgv5ggz><a href="https://accounts.google.com/AccountChooser/signinchooser?continue=https://idx.google.com" class="button button-link text-purple has-arrow" data-astro-cid-pbgv5ggz>Get Started</a></div></div></div></section><section class="my-16 md:my-32" data-astro-cid-pbgv5ggz><div class="container flex flex-col items-stretch lg:items-start lg:flex-row-reverse" data-astro-cid-pbgv5ggz><div class="relative overflow-hidden lg:w-2/3 lg:h-[650px] bg-gray-100 border border-gray-300 flex justify-center aspect-[4/3]" data-astro-cid-pbgv5ggz><div class="shine z-10 absolute inset-0" role="presentation" data-astro-cid-pbgv5ggz></div><astro-island uid="Z4Xx6V" component-url="/_astro/SVGIllustration.CTfZcZaS.js" component-export="default" renderer-url="/_astro/client.Cx1FBVJX.js" props="{"slot":[0,"image"],"svg":[0,"frameworks"]}" ssr="" client="only" opts="{"name":"SVGIllustration","value":"svelte"}"></astro-island></div><div class="lg:w-1/3 p-6 md:p-12 border border-gray-300 max-lg:border-t-0 text-sm bg-gray-100 lg:border-r-0" data-astro-cid-pbgv5ggz><h2 class="title text-[24px]/[29px] md:text-[32px]/[38px] mb-5" style="--max-width-when-narrow: 20ch;" data-astro-cid-pbgv5ggz>Instantly access popular frameworks and languages</h2><p class="mb-5 rich-text" style="--max-width-when-narrow: 279px;" data-astro-cid-pbgv5ggz>Project IDX makes it easy to get started with a variety of templates for frameworks such as Angular, Astro, Flutter, Go, Next.js, Python/Flask, React, Svelte and more. You can also <a href="https://developers.google.com/idx/guides/customize-idx-env">customize your environment with Nix</a> or import your existing applications from GitHub, with support for most tech stacks.<br><br>And, with one-click integrations, you can effortlessly add popular Google APIs and services to your app for every stage of development.</p><div class="flex flex-wrap gap-x-8 mt-5" data-astro-cid-pbgv5ggz><a href="https://accounts.google.com/AccountChooser/signinchooser?continue=https://idx.google.com" class="button button-link text-purple has-arrow" data-astro-cid-pbgv5ggz>Get Started</a></div></div></div></section><section class="my-16 md:my-32" data-astro-cid-pbgv5ggz><div class="container flex flex-col items-stretch lg:items-start lg:flex-row" data-astro-cid-pbgv5ggz><div class="relative overflow-hidden lg:w-2/3 lg:h-[650px] bg-gray-100 border border-gray-300 flex justify-center aspect-[4/3]" data-astro-cid-pbgv5ggz><div class="shine z-10 absolute inset-0" role="presentation" data-astro-cid-pbgv5ggz></div><astro-island uid="jJDvX" component-url="/_astro/SVGIllustration.CTfZcZaS.js" component-export="default" renderer-url="/_astro/client.Cx1FBVJX.js" props="{"slot":[0,"image"],"svg":[0,"mobile-simulator"]}" ssr="" client="only" opts="{"name":"SVGIllustration","value":"svelte"}"></astro-island></div><div class="lg:w-1/3 p-6 md:p-12 border border-gray-300 max-lg:border-t-0 text-sm bg-gray-100 lg:border-l-0" data-astro-cid-pbgv5ggz><img src="/images/code-play.svg" class="w-9 mb-6" alt="abstract icon depicting code lines" data-astro-cid-pbgv5ggz width="36" height="36" loading="lazy" decoding="async"><h2 class="title text-[24px]/[29px] md:text-[32px]/[38px] mb-5" style="--max-width-when-narrow: 15ch;" data-astro-cid-pbgv5ggz>Optimize your apps across platforms</h2><p class="mb-5 rich-text" style="--max-width-when-narrow: 345px;" data-astro-cid-pbgv5ggz>Project IDX lets you preview your full-stack, multiplatform apps as your users would see them, with built-in web previews and Android emulators. And, with access to thousands of extensions, you can test and optimize your API endpoints and backend services.</p><div class="flex flex-wrap gap-x-8 mt-5" data-astro-cid-pbgv5ggz><a href="https://accounts.google.com/AccountChooser/signinchooser?continue=https://idx.google.com" class="button button-link text-purple has-arrow" data-astro-cid-pbgv5ggz>Get Started</a></div></div></div></section></div><section class="pb-24 md:pb-60"><div class="container flex flex-col items-center max-w-[400px] sm:max-w-[630px]"><h2 class="title text-[36px]/[43px] md:text-[52px]/[62px] mb-8 obscure-stars md:relative md:-right-6">Let’s make the development workflow better, together</h2><div class="flex flex-col items-start gap-6 text-sm md:text-base mb-12 obscure-stars self-stretch md:relative md:-right-6"><p style="max-width: 460px;">While software development today is more accessible than ever before, it’s also more complicated.</p><p style="max-width: 430px;">We’re constantly exploring additional ways to simplify and speed up your entire workflow, like richer collaboration tools, across environment sync, pair debugging, code review and more, all powered by Google’s latest AI technology.</p><p style="max-width: 470px;">But we can't do this alone — we want to hear from you as we continue to update IDX and reimagine a better workflow to build, ship and manage apps. To try out Project IDX and give feedback, sign in with your Google Account below.</p></div><div class="flex max-md:flex-col gap-3 items-start w-full md:relative md:-right-6"><a href="/roadmap" data-astro-prefetch="false" class="button button-outline w-full xs:w-auto">Explore Roadmap</a> <a href="https://accounts.google.com/AccountChooser/signinchooser?continue=https://idx.google.com" class="button button-primary w-full xs:w-auto has-arrow">Get Started</a></div><div id="waitlist-intersection-observer-target"></div></div></section><footer class="site-footer mt-10 mb-10 text-xs" data-astro-cid-sz7xmlte><div class="container flex gap-2 max-lg:flex-col" data-astro-cid-sz7xmlte><div class="site-footer-row is-start" data-astro-cid-sz7xmlte><a href="/status" target="_blank" rel="noopener" data-astro-cid-sz7xmlte><astro-island uid="Z1WJNS1" component-url="/_astro/ServiceStatusDot.CHS8dBLT.js" component-export="default" renderer-url="/_astro/client.Cx1FBVJX.js" props="{"data-astro-cid-sz7xmlte":[0,true]}" ssr="" client="visible" opts="{"name":"ServiceStatusDot","value":true}" await-children=""><div class="w-2 h-2 rounded-full bg-gray-300"></div></astro-island>Status</a><div class="footer-separator" data-astro-cid-sz7xmlte></div><a href="https://community.idx.dev/" target="_blank" rel="noopener" data-astro-cid-sz7xmlte>Discussion Forum</a><div class="footer-separator" data-astro-cid-sz7xmlte></div><a href="https://idx.uservoice.com/" target="_blank" rel="noopener" data-astro-cid-sz7xmlte>Feature Requests</a></div><div class="site-footer-row is-end" data-astro-cid-sz7xmlte><a href="/" data-astro-cid-sz7xmlte>About IDX</a><div class="footer-separator" data-astro-cid-sz7xmlte></div><a href="/blog/rss.xml" target="_blank" rel="noopener" data-astro-cid-sz7xmlte><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.01333 13.0133C5.01333 12.4444 4.81778 11.9644 4.42667 11.5733C4.03556 11.1822 3.55556 10.9867 2.98667 10.9867V13.0133H5.01333ZM2.98667 2.98667C4.8 2.98667 6.47111 3.44889 8 4.37333C9.52889 5.26222 10.7378 6.47111 11.6267 8C12.5511 9.52889 13.0133 11.2 13.0133 13.0133H12C12 11.3778 11.5911 9.86667 10.7733 8.48C9.99111 7.09333 8.90667 6.00889 7.52 5.22667C6.13333 4.40889 4.62222 4 2.98667 4V2.98667ZM2.98667 6.98667C4.08889 6.98667 5.08444 7.27111 5.97333 7.84C6.89778 8.37333 7.62667 9.10222 8.16 10.0267C8.72889 10.9156 9.01333 11.9111 9.01333 13.0133H8C8 12.0889 7.76889 11.2533 7.30667 10.5067C6.88 9.72444 6.27556 9.12 5.49333 8.69333C4.74667 8.23111 3.91111 8 2.98667 8V6.98667Z" fill="currentColor"></path></svg></a><div class="footer-separator" data-astro-cid-sz7xmlte></div><a href="https://policies.google.com/terms" target="_blank" rel="noopener" data-astro-cid-sz7xmlte>Terms</a><div class="footer-separator" data-astro-cid-sz7xmlte></div><a href="https://policies.google.com/privacy" target="_blank" rel="noopener" data-astro-cid-sz7xmlte>Privacy</a></div></div></footer></main></body></html>