Multifamily template
Marlowe
For one occupied community. Bone and deep navy with a single bronze rule, italic Fraunces headings over Figtree, square corners and hairline rules in place of cards.
Pages
Marlowe includes 12 pages.
“A page each” means one page for every item, such as one for every floor plan.
- Home
- Amenities
- Gallery
- Neighborhood
- Contact
- Floorplans
- Floorplans, a page each
- Residents
- Schedule a tour
- Accessibility
- Privacy policy
- Faqs
For assistants
The pages of Marlowe offer 5 tools an assistant can use.
A tool is something a visitor's AI assistant can do on the page, such as request a tour. The pages describe their tools to the assistant through WebMCP, a browser standard.
- request_tourWebMCP
Request a tour of the community: the visitor's name, email and phone, the day they would like to visit, and the floor plan they are interested in.
- send_messageWebMCP
Send the leasing office a message: the visitor's name, email, an optional phone and move-in date, and what they want to ask.
- list_floorplansWebMCP
The community's floor plans, each with beds, baths, size, the published rent range and how many apartments are available.
- list_unitsWebMCP
The apartments, each with its floor plan, size, rent, status and the date it is free; filter by status, beds or floor plan.
- search_siteWebMCP
Search the pages of this site for a word or phrase and see where it appears.
Design
Marlowe has its own colours, fonts and corners.
A site you start from it keeps them until you ask Clutch to change them.
The Marlowe is a brick apartment house on the Tennessee riverfront, and the site is painted from that hour: a bone ground, one deep navy as the only heavy colour (header, tour band, footer, buttons), a warm near-black for type, and a single bronze rule spent on the mark under each heading and on the specials bar, never on buttons. Type pairs an italic old-style display (Fraunces) with a quiet grotesque body (Figtree): every section heading is set in italic, list titles are upright semibold, and small-capital labels sit above. Shape is square: 2px corners, no shadows, and hairline rules in place of boxes and cards, with bands alternating bone and a slightly darker bone. The home page opens on a full-bleed photograph that fades into navy, then a ruled stack of teasers, one more photograph, a quiet photo strip, resident notes set as plain italic lines, and a navy closing band. It should read as a small-press brochure for a brick building, not a lifestyle poster.
Colours
- backgroundBackground#f9f6f0
- foregroundForeground#221813
- card#f9f6f0
- card-foreground#221813
- primaryPrimary#0f1e2d
- primary-foregroundPrimary foreground#f9f6f0
- mutedMuted#ebe8e1
- muted-foregroundMuted foreground#4b403a
- accentAccent#a38043
- accent-foreground#221813
- borderBorder#d4d0c8
- on-photoOn photo#f6f3ec
Fonts
- FrauncesHeadings
- FigtreeText
Corners
Slightly rounded corners, 2px
Rules
Clutch keeps every change consistent with the rules of Marlowe.
They say what its pages always do and never do.Always
- Set every section heading in type-h2, italic, with the bronze mark under it.
- Set list titles upright in type-title-lg or type-title.
- Put a type-label line in uppercase above a section heading.
- Rule sections and lists with a 1px border-border line instead of boxing them.
- Spend navy (bg-primary) on the header, the tour band, the footer and buttons only.
Never
- Use bronze (color.accent) on a button.
- Lift anything with a shadow but the floating search bar.
- Round a corner past rounded-md.
- Set type over a photograph without gradient-fade or a navy band under it.
Start your own site from Marlowe.
Name it, and Clutch copies Marlowe into a new site under that name and opens it for you to change by asking.