Contora Framer Template

About this template

Contora is a portfolio template for design studios, agencies and independent practices - built for work that has to be explained, not just shown.

Typography does the structural work here. One neo-grotesque family runs the whole site on a disciplined scale, so full-colour photography can carry the personality without the page turning loud. Dark editorial sections break the rhythm, hairline rules and a strict grid hold it together.

11 PAGES

Home, Work archive, Case study (CMS), Services, Service detail (CMS), About, Process, Contact, Privacy, Terms, 404.

5 CMS COLLECTIONS

Projects, Services, Process Steps, Testimonials, FAQs. Case studies and service pages generate from the CMS - add an item, get a page. Related work at the end of each case study automatically excludes the project you are reading.

11 COMPONENTS

Header with mobile drawer, buttons, section headers, project cards, service rows, process steps, testimonials, FAQ accordion, form submit with pending, success and error states, footer CTA.

MOTION

A WebGL fluid-mask hero that reveals the wordmark on scroll, and a work section that scrolls sideways as the page moves down. Both respect prefers-reduced-motion.

BUILT PROPERLY

Every layer named. Semantic HTML throughout - section, article, nav, main, figure, form. Alt text on every image. Correct heading order on all 11 pages. Three breakpoints everywhere, no missing variants. Colour and text styles rather than hardcoded values, so the whole palette re-themes from one panel.

BEFORE YOU PUBLISH

Replace the demo copy, imagery and contact details. Point the contact form at your own email or webhook. Privacy and Terms are starting drafts, not legal advice - have them reviewed. Swap the demo videos for your own or trim them: they are the heaviest thing in the file.