The Architectural Stitch Pack #2 Is Live: 38 Stitches and a New Home for the App

Hand-coded HTML and CSS sections for websites for architects, interior designers and landscape studios: search-bar heroes, services, timelines, team sections, galleries, contact forms and footers. 38 stitches, two of them section types the library has never had. Plus, the app now lives at app.codestitch.app.

The Architectural Stitch Pack #2 is out now. 38 new stitches, built for the kind of work freelancers actually get paid for: the architecture practice, interiors studio or landscape firm that needs a site as considered as the spaces it designs.

The first Architectural pack set a bold, creative tone. This one widens it. Two of the section types here are new to CodeStitch entirely: heroes with a built-in search bar, and timelines. We want the library to be new, varied and versatile, and this pack pushes on all three.

The App Has Moved to app.codestitch.app

Last week we moved the CodeStitch app (the stitch library, your dashboard and account settings) to its own home at app.codestitch.app. The marketing site, including this blog, stays on codestitch.app.

Two things to know: you'll need to log in again, and it's worth updating your bookmarks to the new address.

Why split them? Two reasons. The marketing site stays fast without carrying the app's weight, and our backend and marketing teams can now deploy separately, so neither waits on the other.

Help Us Rework the Get Code Screen

The next major platform upgrade is the Get Code screen, the one you land on when you grab a stitch's code. Right now it shows the code and nothing else. We want to add three things to it: a stitch preview, tags and links to the Figma file.

We also want to expand what it does. Two new code types, for Astro components and Shopify sections, so you can copy a stitch in one shot. And a way to replace links inside CodeStitch, so a forgotten href doesn't ship as a 404.

Some of these ideas were inspired by Xavier at Oui Digital's Chrome extension. Now we'd like yours: what's missing from the screen, and which other code types could we support just by wrapping the same HTML and CSS? Design mockups and development start in the coming weeks, so add your thoughts in Discord while it's still on the drawing board.

What's in the Architectural Stitch Pack #2

Every stitch is the usual CodeStitch deal: hand-written, mobile-first, fully responsive HTML and CSS. No Tailwind, no Bootstrap, no build step. Copy the markup, copy the CSS, swap the content and you're done. All 38 are in the stitch library now.

One Practice Homepage, Built From the Pack

Here's the pack stacked into a single homepage for an architecture practice, top to bottom. Seven stitches, all from this drop. It's also our take on what the best architecture websites have in common: a clear way in, proof of the work, the people behind it, and an easy way to start a conversation.

Why Websites for Architects Deserve Better Than a Template

Architecture is a small-numbers business. A practice might only need a handful of new commissions a year, and each one is a large, long project. That changes the maths on the website: if a better site wins a single extra commission, it has covered its cost several times over before the foundations are poured.

It also changes who's judging the site. An architect's clients are buying taste and judgement, and the website is the first piece of the portfolio they ever see. That's why good architecture website design is worth charging properly for. The practice can tell the difference, and so can their clients.

Look at what people search for alongside these terms and Squarespace comes up again and again. Templates are the default answer, which is exactly why so many studio sites look interchangeable. A site assembled from sections you can actually edit doesn't have that problem.

Then there's speed. A portfolio is image-heavy by nature, and that's where page builders start to drag on a phone. A hand-coded architect portfolio website keeps the markup lean, so the photography is the only heavy thing on the page. That's what a stitch is: sections you can read and edit in a text editor, built to hit 100/100 on PageSpeed without a build pipeline.

What You Can Build With the Pack

• A complete architecture firm website, hero to footer, in the seven-section order shown above
• Your own reusable interior design website templates: the same sections, restyled for an interiors studio
• Landscape architecture websites built around the gallery, the services slideshows and a project timeline
• A practice history page from the four new timelines, ready for every milestone since the first commission

Next Up: HVAC, Then Real Estate #2