1<!DOCTYPE html><!--UErfBBZVcC_6ND94g2QxY--><html lang="en" class="cormorant_garamond_fdcc62b5-module__j0AN-G__variable"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" href="/_next/static/media/01e4147cff8141ee-s.p.7787e134.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/8bd76523131fa0fc-s.p.eb17b6b9.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="stylesheet" href="/_next/static/chunks/a03875a0db02ece9.css?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/f1b4d49aa9e249c5.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr"/>
1<script src="/_next/static/chunks/8ef812ec526a6a45.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr" async=""></script>
1<script src="/_next/static/chunks/32b3bef3019f2e82.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr" async=""></script>
1<script src="/_next/static/chunks/f8c0db758fb27563.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr" async=""></script>
1<script src="/_next/static/chunks/8cce17550f39a24b.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr" async=""></script>
1<script src="/_next/static/chunks/turbopack-5c113aa9eb96821c.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr" async=""></script>
1<script src="/_next/static/chunks/ff1a16fafef87110.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr" async=""></script>
1<script src="/_next/static/chunks/79b3d4c44ce2c01d.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr" async=""></script>
1<script src="/_next/static/chunks/1d89ed972a208c42.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr" async=""></script>
1<script src="/_next/static/chunks/d4439152c30eada9.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr" async=""></script>
1<meta name="next-size-adjust" content=""/><title>Josh Puckett</title><meta name="description" content="Personal site for Josh Puckett"/><link rel="icon" href="/favicon.ico?favicon.33747bef.ico" sizes="48x48" type="image/x-icon"/>
1<script src="/_next/static/chunks/a6dad97d9634a72d.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr" noModule=""></script>
1</head><body class="antialiased"><div hidden=""><!--$--><!--/$--></div><main class="min-h-screen px-12 py-12 md:px-24 md:py-24" style="max-width:740px"><style> 2 .company-link { 3 text-decoration: none; 4 color: var(--foreground); 5 transition: color 0.15s ease, filter 250ms ease-out; 6 } 7 .company-link:hover { 8 color: var(--brand-color); 9 } 10 .company-link.role-highlighted { 11 color: var(--foreground); 12 } 13 .company-link.role-highlighted:hover { 14 color: var(--brand-color); 15 } 16 .role-text { 17 cursor: default; 18 color: var(--foreground); 19 transition: color 0.15s ease, filter 250ms ease-out; 20 } 21 .role-text:hover { 22 color: var(--foreground); 23 } 24 .filler { 25 transition: color 250ms ease-out, filter 250ms ease-out; 26 } 27 .interactive-paragraph.role-active .filler { 28 color: var(--muted); 29 opacity: 0.5; 30 filter: blur(2px); 31 } 32 .interactive-paragraph.role-active .role-highlighted, 33 .interactive-paragraph.role-active .role-text-active { 34 color: var(--foreground); 35 } 36 .interactive-paragraph.role-active .role-text:not(.role-text-active) { 37 color: var(--muted); 38 opacity: 0.5; 39 filter: blur(2px); 40 } 41 .interactive-paragraph.role-active .company-link:not(.role-highlighted) { 42 color: var(--muted); 43 opacity: 0.5; 44 filter: blur(2px); 45 } 46 .interactive-paragraph.role-active .company-link.role-highlighted:hover { 47 color: var(--brand-color); 48 } 49 @media (prefers-color-scheme: dark) { 50 .company-link.brand-black:hover { 51 color: #ffffff; 52 } 53 .interactive-paragraph.role-active .company-link.brand-black.role-highlighted:hover { 54 color: #ffffff; 55 } 56 } 57 </style><header><h1 style="font-family:'Signifier', Georgia, serif;font-weight:400;font-size:24px;letter-spacing:-0.01rem"><a href="https://x.com/joshpuckett" target="_blank" rel="noopener noreferrer" class="hover:opacity-60 transition-opacity">@joshpuckett</a></h1><div class="w-12 h-px bg-neutral-300 my-6 rounded-[1px]"></div>
57<p class="text-neutral-600 dark:text-neutral-400 leading-relaxed">Co-founder of <a href="https://iteration.design/" target="_blank" rel="noopener noreferrer" class="company-link brand-black" style="--brand-color:#000000">Iteration</a>, a design practice partnering with select early-stage founders. I also co-founded <a href="https://upperstudy.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#A7335E">Upperstudy</a>, an apprenticeship based studio that helped over a hundred designers kickstart their careers in technology.</p><p class="text-neutral-600 dark:text-neutral-400 leading-relaxed mt-6">Before that, I led teams at <a href="https://www.wealthfront.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#472EC4">Wealthfront</a>, <a href="https://www.dropbox.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#0061FE">Dropbox</a>, and <a href="https://www.groupon.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#53A318">Groupon</a>.</p>
57<p class="text-neutral-600 dark:text-neutral-400 leading-relaxed mt-6 interactive-paragraph "><span class="filler">I've been fortunate to collaborate as a </span><span class="role-text ">designer</span><span class="filler">, </span><span class="role-text ">advisor</span><span class="filler">, and </span><span class="role-text ">investor</span><span class="filler"> across companies including </span><a href="https://www.browserbase.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#f03603">Browserbase</a><span class="filler">, </span><a href="https://c.inc/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#2206F5">Checkmate</a><span class="filler">, </span><a href="https://www.clubhouse.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#FBE56B">Clubhouse</a><span class="filler">, </span><a href="https://equals.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#ED745E">Equals</a><span class="filler">, </span><a href="https://www.framer.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#4297F8">Framer</a><span class="filler">, </span><a href="https://modal.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#7fee64">Modal</a><span class="filler">, </span><a href="https://render.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#7D1BF5">Render</a><span class="filler">, </span><a href="https://runway.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#EDAA3B">Runway</a><span class="filler">, </span><a href="https://www.sydecar.io/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#82F1C0">Sydecar</a><span class="filler">, </span><a href="https://www.asktia.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#DC448F">Tia</a><span class="filler">, </span><a href="https://www.truework.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#585EF1">Truework</a><span class="filler">, </span><a href="https://www.vanta.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#6C3CA4">Vanta</a><span class="filler">, </span><a href="https://www.vise.com/" target="_blank" rel="noopener noreferrer" class="company-link " style="--brand-color:#4148ff">Vise</a><span class="filler">, and many more.</span></p></header><section class="mt-[72px]"><h2 class="mb-6" style="font-family:'Signifier', Georgia, serif;font-weight:400;font-size:24px;letter-spacing:-0.01rem">Projects</h2><div class="w-12 h-px bg-neutral-300 my-6 rounded-[1px]"></div><div class="-mx-4 space-y-1"><a href="https://www.interfacecraft.dev/" target="_blank" rel="noopener noreferrer" class="block rounded-xl px-4 py-3 leading-relaxed transition-colors hover:bg-neutral-100 dark:hover:bg-neutral-800/50"><span class="block">Interface Craft</span>
57<span class="block text-neutral-600 dark:text-neutral-400">A working library for those committed to designing with uncommon care.</span></a><a href="/letters-of-love" class="block rounded-xl px-4 py-3 leading-relaxed transition-colors hover:bg-neutral-100 dark:hover:bg-neutral-800/50"><span class="block">Letters of Love</span><span class="block text-neutral-600 dark:text-neutral-400">An archive of love letters, gathered in hopes of bringing the practice back.</span></a><a href="https://www.dialkit.dev/" class="block rounded-xl px-4 py-3 leading-relaxed transition-colors hover:bg-neutral-100 dark:hover:bg-neutral-800/50"><span class="block">DialKit</span><span class="block text-neutral-600 dark:text-neutral-400">A floating control panel for real-time parameter tweaking.</span></a><a href="https://pica.joshpuckett.me/" target="_blank" rel="noopener noreferrer" class="block rounded-xl px-4 py-3 leading-relaxed transition-colors hover:bg-neutral-100 dark:hover:bg-neutral-800/50"><span class="block">Pica</span><span class="block text-neutral-600 dar
57k:text-neutral-400">Better font management for MacOS.</span></a><a href="/locale" class="block rounded-xl px-4 py-3 leading-relaxed transition-colors hover:bg-neutral-100 dark:hover:bg-neutral-800/50"><span class="block">Locale</span><span class="block text-neutral-600 dark:text-neutral-400">Preview every locally available font family directly in the browser.</span></a><a href="/pasito" class="block rounded-xl px-4 py-3 leading-relaxed transition-colors hover:bg-neutral-100 dark:hover:bg-neutral-800/50"><span class="block">Pasito</span><span class="block text-neutral-600 dark:text-neutral-400">A tiny, fully-themeable, and dependency-free fluid stepper component.</span></a><a href="/bloom" class="block rounded-xl px-4 py-3 leading-relaxed transition-colors hover:bg-neutral-100 dark:hover:bg-neutral-800/50"><span class="block">Bloom</span><span class="block text-neutral-600 dark:text-neutral-400">An iOS inspired pull down menu for the web</span></a><a href="https://missmybar.com/" target="_blank" rel="noopener noreferrer" class="block rounded-xl px-4 py-3 leading-relaxed transition-colors hover:bg-neutral-100 dark:hover:bg-neutral-800/50"><span class="block">Miss My Bar</span>
57<span class="block text-neutral-600 dark:text-neutral-400">A retro background ambiance synthesizer.</span></a><a href="https://getdesignstrategies.com/" target="_blank" rel="noopener noreferrer" class="block rounded-xl px-4 py-3 leading-relaxed transition-colors hover:bg-neutral-100 dark:hover:bg-neutral-800/50"><span class="block">Design Strategies</span><span class="block text-neutral-600 dark:text-neutral-400">A deck of strategies to help you get unblocked.</span></a><a href="/font-31756" class="block rounded-xl px-4 py-3 leading-relaxed transition-colors hover:bg-neutral-100 dark:hover:bg-neutral-800/50"><span class="block">FONT 31756</span><span class="block text-neutral-600 dark:text-neutral-400">A hidden icon font found inside HyperCard 1.0.1</span></a></div></section><section class="mt-[72px]"><h2 class="mb-6" style="font-family:'Signifier', Georgia, serif;font-weight:400;font-size:24px;letter-spacing:-0.01rem">Writing</h2><div class="w-12 h-px bg-neutral-300 my-6 rounded-[1px]"></div><div class="-mx-4 space-y-1"><a href="/on-being-an-elder" class="block rounded-xl px-4 py-3 leading-relaxed transition-colors hover:bg-neutral-100 dark:hover:bg-neutral-800/50"><span class="block">On Being An Elder</span>
57<span class="block text-neutral-600 dark:text-neutral-400">Responsibilities of those who've been around</span></a><a href="/melt-effect" class="block rounded-xl px-4 py-3 leading-relaxed transition-colors hover:bg-neutral-100 dark:hover:bg-neutral-800/50"><span class="block">Melt Effect</span><span class="block text-neutral-600 dark:text-neutral-400">Melting any element with a single SVG filter.</span></a></div></section></main><!--$--><!--/$--><!--$!--><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><!--/$-->
57<script src="/_next/static/chunks/f1b4d49aa9e249c5.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr" id="_R_" async=""></script>
57<script>(self.__next_f=self.__next_f||[]).push([0])</script>
57<script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:I[39756,[\"/_next/static/chunks/ff1a16fafef87110.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\",\"/_next/static/chunks/79b3d4c44ce2c01d.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\"],\"default\"]\n3:I[37457,[\"/_next/static/chunks/ff1a16fafef87110.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\",\"/_next/static/chunks/79b3d4c44ce2c01d.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\"],\"default\"]\n4:I[2355,[\"/_next/static/chunks/1d89ed972a208c42.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\"],\"Analytics\"]\n5:I[47257,[\"/_next/static/chunks/ff1a16fafef87110.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\",\"/_next/static/chunks/79b3d4c44ce2c01d.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\"],\"ClientPageRoot\"]\n6:I[52683,[\"/_next/static/chunks/1d89ed972a208c42.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\",\"/_next/static/chunks/d4439152c30eada9.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\"],\"default\"]\n9:I[97367,[\"/_next/static/chunks/ff1a16fafef87110.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\",\"/_next/static/chunks/79b3d4c44ce2c01d.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\"],\"OutletBoundary\"]\na:\"$Sreact.suspense\"\nc:I[97367,[\"/_next/static/chunks/ff1a16fafef87110.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\",\"/_next/static/chunks/79b3d4c44ce2c01d.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\"],\"ViewportBoundary\"]\ne:I[97367,[\"/_next/static/chunks/ff1a16fafef87110.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\",\"/_next/static/chunks/79b3d4c44ce2c01d.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\"],\"MetadataBoundary\"]\n10:I[68027,[],\"default\"]\n:HL[\"/_next/static/chunks/a03875a0db02ece9.css?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\",\"style\"]\n:HL[\"/_next/static/media/01e4147cff8141ee-s.p.7787e134.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/media/8bd76523131fa0fc-s.p.eb17b6b9.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n"])</script>
57<script>self.__next_f.push([1,"0:{\"P\":null,\"b\":\"UErfBBZVcC_6ND94g2QxY\",\"c\":[\"\",\"\"],\"q\":\"\",\"i\":false,\"f\":[[[\"\",{\"children\":[\"__PAGE__\",{}]},\"$undefined\",\"$undefined\",true],[[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/a03875a0db02ece9.css?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/chunks/1d89ed972a208c42.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\",\"async\":true,\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"className\":\"cormorant_garamond_fdcc62b5-module__j0AN-G__variable\",\"children\":[\"$\",\"body\",null,{\"className\":\"antialiased\",\"children\":[[\"$\",\"$L2\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L3\",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.\"}]}]]}]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}],[\"$\",\"$L4\",null,{}]]}]}]]}],{\"children\":[[\"$\",\"$1\",\"c\",{\"children\":[[\"$\",\"$L5\",null,{\"Component\":\"$6\",\"serverProvidedParams\":{\"searchParams\":{},\"params\":{},\"promises\":[\"$@7\",\"$@8\"]}}],[[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/chunks/d4439152c30eada9.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\",\"async\":true,\"nonce\":\"$undefined\"}]],[\"$\",\"$L9\",null,{\"children\":[\"$\",\"$a\",null,{\"name\":\"Next.MetadataOutlet\",\"children\":\"$@b\"}]}]]}],{},null,false,false]},null,false,false],[\"$\",\"$1\",\"h\",{\"children\":[null,[\"$\",\"$Lc\",null,{\"children\":\"$Ld\"}],[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$Le\",null,{\"children\":[\"$\",\"$a\",null,{\"name\":\"Next.Metadata\",\"children\":\"$Lf\"}]}]}],[\"$\",\"meta\",null,{\"name\":\"next-size-adjust\",\"content\":\"\"}]]}],false]],\"m\":\"$undefined\",\"G\":[\"$10\",[]],\"S\":true}\n"])</script>
57<script>self.__next_f.push([1,"7:{}\n8:\"$0:f:0:1:1:children:0:props:children:0:props:serverProvidedParams:params\"\n"])</script>
57<script>self.__next_f.push([1,"d:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}]]\n"])</script>
57<script>self.__next_f.push([1,"11:I[27201,[\"/_next/static/chunks/ff1a16fafef87110.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\",\"/_next/static/chunks/79b3d4c44ce2c01d.js?dpl=dpl_E2W6QuoK1Z9EjCA2E99B5SGjfVGr\"],\"IconMark\"]\nb:null\nf:[[\"$\",\"title\",\"0\",{\"children\":\"Josh Puckett\"}],[\"$\",\"meta\",\"1\",{\"name\":\"description\",\"content\":\"Personal site for Josh Puckett\"}],[\"$\",\"link\",\"2\",{\"rel\":\"icon\",\"href\":\"/favicon.ico?favicon.33747bef.ico\",\"sizes\":\"48x48\",\"type\":\"image/x-icon\"}],[\"$\",\"$L11\",\"3\",{}]]\n"])</script>
57</body></html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.