Brand guide

A fish, drawn in one line.

The mark is a fish drawn with a single stroke weight: a body, a tail, two ribs and an eye, with round caps and round joins. It is ink on paper. In the nav it sways as the page scrolls; everywhere else it holds still.

beach family house

Clear space and size

Keep a third of the fish’s width clear on every side: the same gap that separates the fish from the name in the lockup. On screen the mark is never smaller than 20 px, where the ribs still read as two lines.

What the mark never does

• Fill in. The fish is an outline; the eye is the only solid shape.
• Change colour. Ink on paper, or paper on ink, and nothing else.
• Stretch, skew or flip. It always swims to the right.
• Sit beside a capitalised or sans-serif name. The lockup is the lowercase wordmark.

Lowercase, always.

The wordmark is “beach family house”: three words, lowercase, in EB Garamond semibold, tracked slightly tight (−0.01em), beside the fish and a little smaller than it.

Paper, ink, and one sea-blue.

Everything readable is ink on paper. The sea-blue is the single accent, and everything else is a neutral hairline.

• Ink

  #1E262B

  Headlines, the fish, buttons
• Ink soft

  #2E3E48

  Button hover
• Paper

  #FDFDFB

  The page
• Slate

  #4A555C

  Body copy
• Steel

  #57636B

  Nav links
• Muted

  #66717A

  Captions, dates
• Sea

  #2E6E8E

  Links, focus, selection
• Line

  #E7E6E1

  Hairlines
• Line soft

  #DEDCD5

  Form fields
• Line strong

  #C9C6BD

  Outlined buttons, markers
• Chip

  #F2F1EC

  Tags, code

• Paper is the ground and ink is the type. Headlines are full ink; body copy is slate.
• Nothing is a block of colour. Sections sit on paper, divided by hairlines.
• No gradients and no drop shadows, on anything.
• The sea-blue marks what you can act on: links, the focus ring, the text selection. Labels and metadata are muted grey.

A book serif over the system’s own sans.

Headlines are EB Garamond, a variable serif, set at weight 550. Everything else is the reader’s system sans-serif, which loads instantly and reads well at small sizes.

Display

The home page's opening line, once

EB Garamond 550 · clamp(44px, 6.2vw, 80px) · line-height 1 · tracking -0.03em

A family house in Matosinhos.

Title

Every page's H1

EB Garamond 550 · clamp(36px, 4.4vw, 54px) · line-height 1.05 · tracking -0.028em

Everything a family needs

Heading

Sections, guide headings, places

EB Garamond 550 · clamp(26px, 2.8vw, 36px) · line-height 1.12 · tracking -0.022em

Where we actually eat

Subheading

Amenities, list entries, cards

EB Garamond 600 · 21px · line-height 1.3 · tracking -0.01em

Maurícia, for breakfast

Statement

A single line that closes a section

EB Garamond 400 · clamp(24px, 2.6vw, 32px) · line-height 1.35 · tracking -0.015em

The house shares its building with a working art gallery.

Standfirst

The direct answer under a guide's title

EB Garamond 400 · clamp(20px, 1.9vw, 23px) · line-height 1.5 · tracking -0.005em

Six places a local eats, and what to order at each.

Quote

Guest reviews, pulled short

EB Garamond 400 italic · clamp(20px, 1.9vw, 23px) · line-height 1.45 · tracking -0.01em

“Everything immaculate and very tastefully furnished.”

Lead

The paragraph under a title

System sans 400 · 18px · line-height 1.6

Two bedrooms, a 70 m² garden and a private gym on Rua Brito Capelo.

Body

Running text

System sans 400 · 16px · line-height 1.7

The best bakery in Matosinhos, on Rua de Brito Capelo. It opens at 7h, seven days a week.

Small

Footer, asides, secondary lists

System sans 400 · 14.5px · line-height 1.6

Every walk and drive is measured from the front door.

Meta

Dates, captions, attributions

System sans 400 · 13px · line-height 1.5

Updated 9 October 2026

Label

Column and list headers, set beside or below what they name

System sans 600 · 12px · line-height 1.4 · tracking 0.06em · uppercase

More guides

Soft corners, flat surfaces.

Corners grow with the size of the surface. A card is outlined in a hairline; a photograph sits in a larger rounded panel; buttons are pills. Nothing casts a shadow.

One ink pill per screen for the main action; an outlined pill or a text link for the rest.

The house as it is.

Photographs of the house are our own, taken in daylight. Photographs of Matosinhos and Porto come from Unsplash and Wikimedia Commons and carry their credit and licence wherever they appear.

• Real rooms, as guests will find them.
• Every borrowed photograph is credited to its photographer, with its licence, beneath it.
• Photographs sit in rounded panels with text beside or below them. A label over one sits on a small ink chip.
• Pages without a photograph are plain paper and type.

Plain, first-hand, and measured.

The site speaks as “we” for the house and as Tiago in the guides.

1. Measured, with where from.Every walk and drive is measured from the front door and says so. When a number changes, it changes everywhere.
2. First-hand or named.A place is recommended because Tiago has been, or because somebody he names has been. Hours and prices come from the place’s own listing, with the date they were read.
3. Say what the thing is.Plain words and complete sentences. Describe the house, the street, the beach, directly and specifically.
4. Let people decide.No urgency, no superlatives we cannot show, no exclamation marks. The facts and one clear way to ask.
5. Use numbers.7 minutes on foot. A 70 m² garden. 5.0 from every guest so far.

How to describe us.

Approved descriptions at the lengths placements ask for. The numbers come from the site’s own data, so copy taken from this page is current on the day it is taken.

The files.

Everything here is served from this site, so a link to it stays current.

• Icon

  SVG · the fish on its tile
  Download ↓
• Share card

  JPG · 1200 × 630
  Download ↓
• Portrait of Tiago

  Animated WebP · 400 × 400
  Download ↓
• The house, street side

  JPG · 2560 px
  Download ↓

Questions about using the name? Ask through the booking form.