Skip to content
codexa

Portfolios · React

Architecture practice

Minimal, square-cornered portfolio for a small architecture practice with projects and process.

Architecture practice starter, as built from its own files
Starter screenshot captured from this template's own build at 1440×900. It shows the template as it ships, not output generated from a prompt.

What you get

A restrained portfolio for an architect or small practice: built projects, an approach section, how a commission runs from brief to handover, practice history and an enquiry form. All content lives in src/site.ts.

Files

Exactly what is copied into a new project: 13 files, nothing generated.

Raw data: GET /api/v1/templates/portfolio-architect

src/site.ts
src/site.ts
import type { Site } from "./types"; /** Everything this site shows. Edit freely. */export const site: Site = {  "brand": "Brandt Architecture",  "nav": [    {      "label": "Projects",      "href": "#projects"    },    {      "label": "Approach",      "href": "#approach"    },    {      "label": "Process",      "href": "#process"    },    {      "label": "Practice",      "href": "#practice"    }  ],  "navCta": {    "label": "Enquire",    "href": "#contact"  },  "sections": [    {      "kind": "hero",      "variant": "editorial",      "eyebrow": "Nadia Brandt, architect · Copenhagen",      "title": "Small buildings, built carefully, meant to last a hundred years.",      "text": "A practice of four working on houses, extensions and small civic buildings. We use timber, brick and lime where we can, and we stay on the project until the keys are handed over.",      "primary": {        "label": "View projects",        "href": "#projects"      },      "secondary": {        "label": "Start a project",        "href": "#contact"      },      "visual": {        "type": "tiles",        "tones": [          "#57534e",          "#d6d3d1",          "#a8a29e",          "#292524"        ],        "caption": "Harbour House, Helsingør, 2025"      }    },    {      "kind": "projects",      "id": "projects",      "eyebrow": "Projects",      "title": "Selected work",      "items": [        {          "title": "Harbour House",          "tag": "New-build timber house, 160 m²",          "year": "2025",          "tone": "#44403c"        },        {          "title": "Nørrebro Courtyard",          "tag": "Brick extension to a 1890s apartment block",          "year": "2024",          "tone": "#7c2d12"        },        {          "title": "Skov Kindergarten",          "tag": "Forest kindergarten for 40 children",          "year": "2023",          "tone": "#3f4a3c"        },        {          "title": "Studio on Fanø",          "tag": "Artist's workshop in thatch and larch",          "year": "2022",          "tone": "#57534e"        },        {          "title": "Two Gables",          "tag": "Pair of semi-detached family houses",          "year": "2021",          "tone": "#1c1917"        },        {          "title": "Allotment Pavilion",          "tag": "Community shelter, built with volunteers",          "year": "2020",          "tone": "#6b5d4f"        }      ]    },    {      "kind": "split",      "id": "approach",      "eyebrow": "Approach",      "title": "Fewer materials, better details",      "text": "We'd rather spend the budget on a well-made window than on a feature wall. Most of our houses use three or four materials, chosen so they age well and can be repaired by a local builder.",      "bullets": [        "Timber frame and bio-based insulation as standard",        "Daylight studies for every room before we fix the plan",        "Fixed fee agreed at the start, in writing"      ],      "visual": {        "type": "card",        "tone": "#292524",        "title": "Harbour House in numbers",        "lines": [          "160 m² over two floors",          "Built in 11 months",          "Heating demand 28 kWh/m² a year"        ]      }    },    {      "kind": "steps",      "id": "process",      "eyebrow": "Process",      "title": "From brief to handover",      "items": [        {          "title": "Brief and site visit",          "text": "We walk the site with you, talk budget honestly and write a one-page brief we both sign off."        },        {          "title": "Design and permits",          "text": "Sketch options, a chosen scheme, then drawings for planning and building permits. Usually 4–6 months."        },        {          "title": "Build and handover",          "text": "We tender to builders, visit the site weekly and stay through the first year of snagging."        }      ]    },    {      "kind": "timeline",      "id": "practice",      "eyebrow": "Practice",      "title": "About the studio",      "items": [        {          "period": "2019",          "title": "Studio founded",          "text": "Nadia opens the practice after nine years at larger offices in Copenhagen and Oslo."        },        {          "period": "2021",          "title": "First completed house",          "text": "Two Gables completes; the studio grows to three people."        },        {          "period": "2023",          "title": "First public building",          "text": "Skov Kindergarten opens, designed with the teachers and parents who use it."        },        {          "period": "2026",          "title": "Teaching",          "text": "Nadia teaches a timber construction studio one day a week at the school of architecture."        }      ]    },    {      "kind": "contact",      "eyebrow": "Enquiries",      "title": "Start a project",      "text": "Tell us about the site, what you'd like to build and your rough budget. We take on four to six new projects a year.",      "fields": [        "name",        "email",        "phone",        "message"      ],      "button": "Send enquiry"    }  ],  "footer": {    "text": "Brandt Architecture. Houses, extensions and small public buildings.",    "columns": [      {        "title": "Studio",        "links": [          "Vesterbrogade 112, Copenhagen",          "+45 31 55 01 42"        ]      },      {        "title": "Follow",        "links": [          "Instagram",          "Journal"        ]      }    ],    "legal": "© Brandt Architecture. Sample content: replace it in src/site.ts."  }};

Remix

Remix this template

Describe what to change and the agent starts from Architecture practice's files. The box is already started for you: finish “Start from Architecture practice and …”

Agent ready

Creates a free account first; your idea is carried over.

Dependencies

Documented from the template's package.json. The runtime has a prebuilt dependency set for Vite + React + TypeScript, so installs are fast.

  • react^19.1.0
  • react-dom^19.1.0
  • vite^6.3.0
  • @vitejs/plugin-react^4.4.0
  • tailwindcss^4.1.0
  • @tailwindcss/vite^4.1.0
  • typescript^5.8.0

How it runs

Framework
Vite + React + TypeScript
Dev command
npm run dev
Build command
npm run build
Output directory
dist
Port
5173
Entry route
/

Projects run in an isolated sandbox with a live preview. Read the projects documentation for settings, snapshots and deployment.

All templates

Build on Architecture practice

Create a free account, start from this template, and ask the AI agent to turn it into your app.