https://rarecode.ai/playground

1<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" as="image" href="/White logo.svg"/><link rel="preload" as="image" href="/Black logo.svg"/><link rel="stylesheet" href="/_next/static/css/9bd278907532145f.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/webpack-184786480e2111f4.js"/>

1<script src="/_next/static/chunks/fd9d1056-79388568c2fed24d.js" async=""></script>

1<script src="/_next/static/chunks/52117-0025cb563e5c87bf.js" async=""></script>

1<script src="/_next/static/chunks/main-app-4f1540accb1966f3.js" async=""></script>

1<script src="/_next/static/chunks/96132-c7ee7200c938834c.js" async=""></script>

1<script src="/_next/static/chunks/39814-a4aa246e75efa461.js" async=""></script>

1<script src="/_next/static/chunks/app/playground/page-eaf1fdae0ebd81e0.js" async=""></script>

1<script src="/_next/static/chunks/app/layout-de8a1a64386c7c18.js" async=""></script>

1<script src="/_next/static/chunks/app/error-56bdc4f8871b7569.js" async=""></script>

1<script src="/_next/static/chunks/72972-f6e0ead7b06ea645.js" async=""></script>

1<script src="/_next/static/chunks/app/not-found-80ea71105dcfb2d9.js" async=""></script>

1<script src="/_next/static/chunks/app/global-error-39fc44c1cfcfe8d3.js" async=""></script>

1<link rel="preload" href="https://www.googletagmanager.com/gtag/js?id=AW-18146056231" as="script"/><title>RareCode</title><meta name="description" content="Write your first 1,000 lines of Rust"/><meta name="author" content="RareSkills"/><meta name="keywords" content="programming,coding,solidity,rust,blockchain,smart contracts,web3,tutorials,learning,rareskills"/><meta property="og:title" content="RareCode"/><meta property="og:description" content="Write your first 1,000 lines of Rust"/><meta property="og:url" content="https://rarecode.ai"/><meta property="og:site_name" content="RareCode"/><meta property="og:image" content="https://rarecode.ai/og.png"/><meta property="og:image:width" content="1200"/><meta property="og:image:height" content="630"/><meta property="og:type" content="website"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:title" content="RareCode"/><meta name="twitter:description" content="Write your first 1,000 lines of Rust"/><meta name="twitter:image" content="https://rarecode.ai/og.png"/><meta name="twitter:image:width" content="1200"/><meta name="twitter:image:height" content="630"/><link rel="icon" href="/favicon.ico" type="image/x-icon" sizes="32x32"/><link rel="icon" href="/favicon.ico"/>

1<script src="/_next/static/chunks/polyfills-42372ed130431b0a.js" noModule=""></script>

1</head><body><!--$-->

1<script>((e,t,r,a,s,n,i,o)=>{let l=document.documentElement,d=["light","dark"];function c(t){(Array.isArray(e)?e:[e]).forEach(e=>{let r="class"===e,a=r&&n?s.map(e=>n[e]||e):s;r?(l.classList.remove(...a),l.classList.add(t)):l.setAttribute(e,t)}),o&&d.includes(t)&&(l.style.colorScheme=t)}if(a)c(a);else try{let e=localStorage.getItem(t)||r,a=i&&"system"===e?window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light":e;c(a)}catch(e){}})("class","theme","dark",null,["light","dark"],null,true,true)</script>

1<nav class="flex justify-between items-center py-3 px-4 lg:px-6 bg-gray-100 dark:bg-gray-800 transition-colors duration-300 border-b dark:border-gray-700 border-gray-200"><div class="flex items-center gap-3 md:gap-4 lg:gap-6"><a class="text-xl lg:text-2xl font-bold flex items-center py-2 px-1 rounded-lg transition-all duration-200 hover:bg-opacity-10 dark:hover:bg-opacity-50 hover:bg-gray-900" href="/"><img src="/White logo.svg" alt="RareCode Logo" class="hidden dark:block h-6 md:h-7 min-w-[90px] md:min-w-[110px] max-w-[280px] md:max-w-[320px]"/><img src="/Black logo.svg" alt="RareCode Logo" class="dark:hidden h-6 md:h-7 min-w-[90px] md:min-w-[110px] max-w-[280px] md:max-w-[320px]"/></a><a target="_blank" rel="noopener noreferrer" class="hidden sm:flex items-center justify-center p-2 md:p-2.5 rounded-lg transition-all duration-200 hover:scale-105 dark:hover:bg-gray-700 hover:bg-gray-200" aria-label="Join our Discord server" href="https://discord.gg/8zWwmT3mJX"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 640 512" class="text-lg md:text-xl transition-colors duration-200 text-gray-600 hover:text-black dark:text-gray-300 dark:hover:text-white" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M524.531,69.836a1.5,1.5,0,0,0-.764-.7A485.065,485.065,0,0,0,404.081,32.03a1.816,1.816,0,0,0-1.923.91,337.461,337.461,0,0,0-14.9,30.6,447.848,447.848,0,0,0-134.426,0,309.541,309.541,0,0,0-15.135-30.6,1.89,1.89,0,0,0-1.924-.91A483.689,483.689,0,0,0,116.085,69.137a1.712,1.712,0,0,0-.788.676C39.068,183.651,18.186,294.69,28.43,404.354a2.016,2.016,0,0,0,.765,1.375A487.666,487.666,0,0,0,176.02,479.918a1.9,1.9,0,0,0,2.063-.676A348.2,348.2,0,0,0,208.12,430.4a1.86,1.86,0,0,0-1.019-2.588,321.173,321.173,0,0,1-45.868-21.853,1.885,1.885,0,0,1-.185-3.126c3.082-2.309,6.166-4.711,9.109-7.137a1.819,1.819,0,0,1,1.9-.256c96.229,43.917,200.41,43.917,295.5,0a1.812,1.812,0,0,1,1.924.233c2.944,2.426,6.027,4.851,9.132,7.16a1.884,1.884,0,0,1-.162,3.126,301.407,301.407,0,0,1-45.89,21.83,1.875,1.875,0,0,0-1,2.611,391.055,391.055,0,0,0,30.014,48.815,1.864,1.864,0,0,0,2.063.7A486.048,486.048,0,0,0,610.7,405.729a1.882,1.882,0,0,0,.765-1.352C623.729,277.594,590.933,167.465,524.531,69.836ZM222.491,337.58c-28.972,0-52.844-26.587-52.844-59.239S193.056,219.1,222.491,219.1c29.665,0,53.306,26.82,52.843,59.239C275.334,310.993,251.924,337.58,222.491,337.58Zm195.38,0c-28.971,0-52.843-26.587-52.843-59.239S388.437,219.1,417.871,219.1c29.667,0,53.307,26.82,52.844,59.239C470.715,310.993,447.538,337.58,417.871,337.58Z"></path></svg></a><a target="_blank" rel="noopener noreferrer" class="hidden sm:flex items-center justify-center p-2 md:p-2.5 rounded-lg transition-all duration-200 hover:scale-105 dark:hover:bg-gray-700 hover:bg-gray-200" aria-label="Follow our X" href="https://x.com/RareCodeAI"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" class="text-lg md:text-xl transition-colors duration-200 text-gray-600 hover:text-black dark:text-gray-300 dark:hover:text-white" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"></path></svg></a><a class="hidden lg:block px-3 py-2 rounded-lg transition-all duration-200 text-sm xl:text-base font-medium hover:scale-105 focus:outline-none focus:ring-2 focus:ring-pink-500/50 dark:bg-pink-900/30 dark:text-pink-300 dark:border-pink-400 bg-pink-100 text-pink-700 border-l-2 border-pink-500" href="/playground">Playground</a><a class="hidden lg:block px-3 py-2 rounded-lg transition-all duration-200 text-sm xl:text-base font-medium hover:scale-105 focus:outline-none focus:ring-2 focus:ring-pink-500/50 dark:text-gray-300 dark:hover:text-white dark:hover:bg-gray-700 text-gray-700 hover:text-black hover:bg-gray-200" href="/about">About</a><a class="hidden lg:block px-3 py-2 rounded-lg transition-all duration-200 text-sm xl:text-base font-medium hover:scale-105 focus:outline-none focus:ring-2 focus:ring-pink-500/50 dark:text-gray-300 dark:hover:text-white dark:hover:bg-gray-700 text-gray-700 hover:text-black hover:bg-gray-200" href="/pricing">Pricing</a><a class="hidden lg:block px-3 py-2 rounded-lg transition-all duration-200 text-sm xl:text-base font-medium hover:scale-105 focus:outline-none focus:ring-2 focus:ring-pink-500/50 dark:text-gray-300 dark:hover:text-white dark:hover:bg-gray-700 text-gray-700 hover:text-black hover:bg-gray-200" href="/reviews">Testimonials</a></div><button class="xl:hidden p-3 rounded-lg transition-all duration-200 hover:scale-105 focus:outline-none focus:ring-2 focus:ring-pink-500/50 dark:hover:bg-gray-700 hover:bg-gray-200" aria-label="Toggle menu"><div class="w-5 h-4 relative flex flex-col justify-between"><div class="w-full h-0.5 transition-all duration-200 rotate-0 translate-y-0 dark:bg-white bg-gray-900"></div><div class="w-full h-0.5 transition-all duration-200 opacity-100 dark:bg-white bg-gray-900"></div><div class="w-full h-0.5 transition-all duration-200 rotate-0 translate-y-0 dark:bg-white bg-gray-900"></div></div></button><div class="
2        hidden 
3        xl:flex 
4        flex-col 
5        xl:flex-row 
6        items-center 
7        gap-4 xl:gap-6
8        absolute 
9        xl:relative 
10        top-14 
11        xl:top-0 
12        left-0 
13        xl:left-auto 
14        w-full 
15        xl:w-auto 
16        p-4 
17        xl:p-0
18        xl:bg-transparent
19        z-50
20        shadow-lg xl:shadow-none
21      "><a href="/playground" class="xl:hidden px-4 py-2.5 rounded-lg w-full text-center font-medium transition-all duration-200 hover:scale-105 focus:outline-none focus:ring-2 focus:ring-pink-500/50 dark:bg-pink-900/40 dark:text-pink-300 border-l-2 dark:border-pink-400 bg-pink-100 text-pink-700 border-pink-500">Playground</a><a class="lg:hidden px-4 py-2.5 rounded-lg w-full text-center font-medium transition-all duration-200 hover:scale-105 focus:outline-none focus:ring-2 focus:ring-pink-500/50 dark:text-gray-300 dark:hover:text-white dark:hover:bg-gray-800 text-gray-700 hover:text-black hover:bg-gray-200" href="/about">About</a><a class="lg:hidden px-4 py-2.5 rounded-lg w-full text-center font-medium transition-all duration-200 hover:scale-105 focus:outline-none focus:ring-2 focus:ring-pink-500/50 dark:text-gray-300 dark:hover:text-white dark:hover:bg-gray-800 text-gray-700 hover:text-black hover:bg-gray-200" href="/pricing">Pricing</a><a class="xl:hidden px-4 py-2.5 rounded-lg w-full text-center font-medium transition-all duration-200 hover:scale-105 focus:outline-none focus:ring-2 focus:ring-pink-500/50 dark:text-gray-300 dark:hover:text-white dark:hover:bg-gray-800 text-gray-700 hover:text-black hover:bg-gray-200" href="/reviews">Testimonials</a><button class="group relative flex items-center justify-center gap-3 py-2.5 px-4 roun

21ded-lg w-full xl:w-auto transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-pink-500/50 hover:scale-105 dark:bg-gray-800 dark:hover:bg-gray-700 dark:border-gray-700 bg-gray-200 hover:bg-gray-300 border border-gray-300" aria-label="Toggle Ui Theme"><div class="relative w-5 h-5 transition-transform duration-200 dark:rotate-180 rotate-0"><svg class="w-5 h-5 dark:block hidden text-yellow-400" fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z" clip-rule="evenodd"></path></svg><svg class="w-5 h-5 dark:hidden text-gray-700" fill="currentColor" viewBox="0 0 20 20"><path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path></svg></div><span class="xl:hidden dark:hidden  font-medium transition-colors duration-200 text-gray-800">Dark mode</span><span class="xl:dark:hidden hidden dark:block font-medium transition-colors duration-200 text-white">Light mode</span></button><button disabled="" class="flex items-center justify-center gap-2 px-4 py-2.5 rounded-lg font-medium w-full xl:w-auto transition-all duration-200 hover:scale-105 focus:outline-none focus:ring-2 focus:ring-pink-500/50 disabled:opacity-60 disabled:cursor-not-allowed disabled:hover:scale-100 dark:bg-gray-800 dark:hover:bg-gray-700 dark:text-white dark:border-gray-700 bg-white hover:bg-gray-50 text-gray-800 border border-gray-300 hover:border-gray-400"><div class="w-5 h-5 animate-spin rounded-full border-2 border-current border-t-transparent"></div><span>Signing in...</span></button></div></nav><div class="flex items-center justify-center h-screen"><div class="text-center p-8"><div class="animate-spin rounded-full h-12 w-12 mx-auto mb-4 border-b-2 border-pink-600"></div><p class="text-gray-600">Loading playground...</p></div></div><div class="fixed bottom-4 right-4 z-50 space-y-2"></div>

21<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=

21GTM-KJKR59WV

21" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>

21<!--$!--><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><!--/$--><!--$!--><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><!--/$--><!--/$-->

21<script src="/_next/static/chunks/webpack-184786480e2111f4.js" async=""></script>

21<script>(self.__next_f=self.__next_f||[]).push([0]);self.__next_f.push([2,null])</script>

21<script>self.__next_f.push([1,"1:HL[\"/_next/static/css/9bd278907532145f.css\",\"style\"]\n"])</script>

21<script>self.__next_f.push([1,"2:I[12846,[],\"\"]\n4:I[19107,[],\"ClientPageRoot\"]\n5:I[7040,[\"96132\",\"static/chunks/96132-c7ee7200c938834c.js\",\"39814\",\"static/chunks/39814-a4aa246e75efa461.js\",\"92383\",\"static/chunks/app/playground/page-eaf1fdae0ebd81e0.js\"],\"default\",1]\n6:I[4707,[],\"\"]\n7:I[36423,[],\"\"]\n8:I[83644,[\"63185\",\"static/chunks/app/layout-de8a1a64386c7c18.js\"],\"default\"]\n9:I[10376,[\"97601\",\"static/chunks/app/error-56bdc4f8871b7569.js\"],\"default\"]\na:I[33428,[\"72972\",\"static/chunks/72972-f6e0ead7b06ea645.js\",\"29160\",\"static/chunks/app/not-found-80ea71105dcfb2d9.js\"],\"default\"]\nc:I[21667,[\"16470\",\"static/chunks/app/global-error-39fc44c1cfcfe8d3.js\"],\"default\"]\nd:[]\n0:[\"$\",\"$L2\",null,{\"buildId\":\"KkoSwehmrNMuKeanIVarS\",\"assetPrefix\":\"\",\"urlParts\":[\"\",\"playground\"],\"initialTree\":[\"\",{\"children\":[\"playground\",{\"children\":[\"__PAGE__\",{}]}]},\"$undefined\",\"$undefined\",true],\"initialSeedData\":[\"\",{\"children\":[\"playground\",{\"children\":[\"__PAGE__\",{},[[\"$L3\",[\"$\",\"$L4\",null,{\"props\":{\"params\":{},\"searchParams\":{}},\"Component\":\"$5\"}],null],null],null]},[null,[\"$\",\"$L6\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"playground\",\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L7\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"notFoundStyles\":\"$undefined\"}]],null]},[[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/9bd278907532145f.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"suppressHydrationWarning\":true,\"children\":[\"$\",\"body\",null,{\"children\":[\"$\",\"$L8\",null,{\"children\":[\"$\",\"$L6\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\"],\"error\":\"$9\",\"errorStyles\":[],\"errorScripts\":[],\"template\":[\"$\",\"$L7\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[\"$\",\"$La\",null,{}],\"notFoundStyles\":[]}]}]}]}]],null],null],\"couldBeIntercepted\":false,\"initialHead\":[null,\"$Lb\"],\"globalErrorComponent\":\"$c\",\"missingSlots\":\"$Wd\"}]\n"])</script>

21<script>self.__next_f.push([1,"b:[[\"$\",\"meta\",\"0\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}],[\"$\",\"meta\",\"1\",{\"charSet\":\"utf-8\"}],[\"$\",\"title\",\"2\",{\"children\":\"RareCode\"}],[\"$\",\"meta\",\"3\",{\"name\":\"description\",\"content\":\"Write your first 1,000 lines of Rust\"}],[\"$\",\"meta\",\"4\",{\"name\":\"author\",\"content\":\"RareSkills\"}],[\"$\",\"meta\",\"5\",{\"name\":\"keywords\",\"content\":\"programming,coding,solidity,rust,blockchain,smart contracts,web3,tutorials,learning,rareskills\"}],[\"$\",\"meta\",\"6\",{\"property\":\"og:title\",\"content\":\"RareCode\"}],[\"$\",\"meta\",\"7\",{\"property\":\"og:description\",\"content\":\"Write your first 1,000 lines of Rust\"}],[\"$\",\"meta\",\"8\",{\"property\":\"og:url\",\"content\":\"https://rarecode.ai\"}],[\"$\",\"meta\",\"9\",{\"property\":\"og:site_name\",\"content\":\"RareCode\"}],[\"$\",\"meta\",\"10\",{\"property\":\"og:image\",\"content\":\"https://rarecode.ai/og.png\"}],[\"$\",\"meta\",\"11\",{\"property\":\"og:image:width\",\"content\":\"1200\"}],[\"$\",\"meta\",\"12\",{\"property\":\"og:image:height\",\"content\":\"630\"}],[\"$\",\"meta\",\"13\",{\"property\":\"og:type\",\"content\":\"website\"}],[\"$\",\"meta\",\"14\",{\"name\":\"twitter:card\",\"content\":\"summary_large_image\"}],[\"$\",\"meta\",\"15\",{\"name\":\"twitter:title\",\"content\":\"RareCode\"}],[\"$\",\"meta\",\"16\",{\"name\":\"twitter:description\",\"content\":\"Write your first 1,000 lines of Rust\"}],[\"$\",\"meta\",\"17\",{\"name\":\"twitter:image\",\"content\":\"https://rarecode.ai/og.png\"}],[\"$\",\"meta\",\"18\",{\"name\":\"twitter:image:width\",\"content\":\"1200\"}],[\"$\",\"meta\",\"19\",{\"name\":\"twitter:image:height\",\"content\":\"630\"}],[\"$\",\"link\",\"20\",{\"rel\":\"icon\",\"href\":\"/favicon.ico\",\"type\":\"image/x-icon\",\"sizes\":\"32x32\"}],[\"$\",\"link\",\"21\",{\"rel\":\"icon\",\"href\":\"/favicon.ico\"}]]\n3:null\n"])</script>

21</body></html>