Compass

Compass is a design studio website template for Framer, made for architecture, interior, branding and creative agencies that sell on the quality of their work. It sits on a strict 12-column Swiss grid, pairs Instrument Serif with Inter, and keeps every page calm, editorial and easy to read.

11 pages

Home, Work, Project, Studio, Services, Journal, Article, Careers, Contact, Imprint and 404.

5 CMS collections

Projects, Journal, Team, Open Roles and Services. Publish a new case study or article and every list, filter and detail page updates on its own.

What is inside

- Portfolio index filtered by discipline, with a cover image that follows the cursor

- Case studies with client, location, year and services, a gallery, credits and a next-project link

- Studio page with team portraits and social links, studio numbers and two office addresses

- Services with deliverables for each discipline

- Careers page with open roles, a four-step hiring process and an open application

- Journal with categories, authors, reading time and long-form article styles

- Contact form with budget and timeline fields and sending, sent and error states

- Selected clients logo marquee

- Page loader with a live counter, page transitions, parallax images, text reveals and smooth scrolling

Easy to make your own

Color tokens, text styles and reusable components run through every page, so a new palette or typeface updates the whole site. Every layout is tuned for desktop, tablet and phone, with a full-screen mobile menu.

SEO ready

Each page has its own title and meta description, CMS pages build theirs from their content, headings follow a clear order and every image has alt text.

Good to know

Fonts are free Google Fonts. Client logos, names and images are placeholders, so swap them for your own before you publish.