Brand guidelines · v1 · Oct 2026One house, five rooms
Mira already speaks to very different people: guests booking a villa, friends looking for dinner, creators pitching a shoot, readers planning a trip, investors reading numbers. These guidelines keep one core that never changes and give each line its own accent, ground, photography and voice, so you can tell where you are before you read a word. Use them for every page, story, PDF and deck Mira makes.
The first four colours come straight from the story highlights on @miravillaskp (Villa bronze, Book copper, Island olive, Collabs sage). Journal and Invest are new and use colours already in the site's tokens (bistre and ink).
Mira is one small place that talks to five very different people. Without shared rules, every page, story and PDF drifts a little, and after a year nobody can tell what Mira looks like.
Mira is slow, warm and handmade: teak, white walls, a private pool, the sunset side of the island. The brand should feel the same way. Calm type, real photos and a lot of space do that better than any slogan.
A guest booking, a friend looking for dinner, a creator pitching a shoot and an investor reading numbers need different things. Each one gets its own room, with its own colour and tone of voice. Our Instagram highlights already do this, and the website now does too.
Alvaro, the property manager, a designer or a creator should all be able to make something that looks like Mira without asking. These pages are the answer to “how should this look?” Each rule comes with the reason behind it, so new cases can be decided the same way.
Every rule on this site comes from one of these. When a case isn't covered, decide it with them.
Guests decide with their eyes, in seconds, on a phone. So: lead with a real photo, keep text short, and show details only when someone asks for them.
People come to Mira to slow down. So: light type, plenty of space, hairlines instead of boxes, almost no motion. Collabs is the one room allowed to turn the volume up.
Trust is the product. So: only real Mira photos, no stock and no construction. Honest content from creators. Nobody pays to be a Friend of Mira. Every number is real and sourced.
Recognition comes from repetition, and relevance comes from fit. So: the wordmark, fonts, hairlines and buttons never change. Each line changes only its surface.
People are impatient. So: one obvious action per screen (book on WhatsApp, apply, request), always a clear way back, and no dead ends.
Every line inherits these. If someone covers the logo, the page should still feel like Mira: same type family, same hairlines, same calm spacing, same hand in the photography. Lines only change the surface.
Mark
One wordmark, black or bone. No per-line logos, no lock-ups with line names baked in.
Type
Two families, always. Lines change weight, size and whether the serif is italic or upright. Never a third family.
Core palette
Paper, ink, moss, bone. Each line adds one accent and may swap the ground.
Structure
Spaced-caps kicker over every headline, 1px hairlines instead of boxes, generous section spacing.
Buttons
Square-ish, spaced caps, solid or outline. Only the fill colour follows the line.
Photography
Real Mira shots, daylight, teak and white. No stock, no filters that fight the palette, no construction.
What each core piece is, how to use it, and why we chose it. Click any colour to copy its hex code.
Wordmark
Black on light grounds and bone on dark grounds or photos. Leave clear space of at least the height of the “m” on every side. Minimum width is 64px on screens and 18mm in print. Never stretch it, recolour it, add effects, or put a line name inside it.
WhyA small lowercase wordmark is quiet and personal, like the place. Keeping one mark for every line is what holds the family together.
Colour
Paper is the default ground and ink is the text. Moss marks labels and small accents. Bone is for quiet bands and dividers. Each line adds one accent on top of these; never mix two line accents on one page.
WhyThey come from the villa itself: white linen and lime plaster, dark teak, the jungle around the pool, warm stone. A palette taken from the place can't look generic.
Type
General Sans for almost everything, in light (300) for headlines and regular (400) for text. Cormorant only for a single phrase per block, or for names on the Friends line. Never add a third family. Thai and Chinese pages fall back to Noto Sans or system fonts.
WhyGeneral Sans is modern and airy without feeling corporate. Cormorant brings the handwritten warmth of our Instagram story cards. One of each keeps the system simple enough for anyone to use.
Photography
Use the professional set (27 photos) first. Natural light, straight verticals, teak and white. No stock, no construction, no heavy filters or presets that fight the palette. Portrait photos go in vertical frames; never crop them into wide banners.
WhyPhotos are the first thing guests judge (principle 1), and they have to be true (principle 3). A blurry crop or a stock image breaks trust faster than any typo.
Layout
04 · Near Mira
Our favourite places.
Every block opens with a small spaced-caps kicker, then a headline, then content in lists separated by 1px hairlines. Generous section spacing (64px on phones, up to 120px on desktop), text no wider than about 65 characters.
WhyHairlines and space feel like a printed travel journal, calm and premium. The kicker tells you where you are before you read the headline.
Voice
Short sentences, active voice, “you” and “we”. Real numbers (km, minutes, check-in 3 pm). No hype words, no emoji in headlines, no exclamation marks. English first; every page is translated into Spanish, Russian, Chinese and Thai.
Experience the ultimate luxury paradise getaway!
Private pool villas on the sunset side. Four minutes to the beach.
WhyWe sound like the person who lives here and knows the island, not like a hotel chain. Specific details are more convincing than adjectives.
For guests deciding where to sleep. It should feel like opening the door: photo first, few words, one obvious way to book.
General Sans light headlines, one italic Cormorant phrase at most.
Full-bleed interiors and pool, people optional, never staged.
Photo hero, quick facts, gallery, a single copper “Book” button that follows you.
Almost none. Smooth scroll, image fade on load. Nothing that moves while you swipe.
Your villa is ready from 3 pm. The pool is yours.
Wok Tum · Koh Phangan
Two bedrooms · private pool · 4 min to Hin Kong beach
Site · Instagram story
For guests already on the island and anyone asking “where should we eat?”. It reads like a note from a friend who lives here: warm, specific, short.
Upright Cormorant for names and titles (as in the Island stories), General Sans for distances.
Places with people in them, plates, sunsets. Palm-shadow texture on story cards.
Lists, not cards: name · what it is · km · min. Filter chips, top picks first.
Light. Chips and lists respond instantly; no decorative animation.
Rosy Pizza. Neapolitan pizza, three minutes on foot.
Near Mira
Four cafés we love, under 10 min away
Site · Instagram story
For creators and brands. The loudest room in the house: dark ground, big type, camera language. Still Mira fonts and Mira photos, just turned up.
General Sans at poster size (100px+), Cormorant italic as the counter-voice.
Vertical 9:16 frames with REC marks; textures from the stories (teak, pool caustics).
Tilted frame stacks, a formats marquee, a “shot list” of spots. Allowed to break the grid.
The only line with a motion budget: marquee, blinking REC, hover zooms. Off for reduced motion.
A few nights on us. Make something honest.
Mira Collabs
Site (live) · story
For readers planning a trip who found us on Google. A small island magazine: the most text of any line, so the calmest layout and the best reading measure.
Headlines mix sans and italic serif; tide-coloured drop cap; body at 65 characters.
Island landscapes, credited. Wider, quieter, more sea than villa.
Article template with reading time, table of contents, “back to all guides”.
None in articles. Readers came to read.
The west coast gets the sunset, the quiet beaches and the shortest pier run.
Guide · 8 min read
By the Mira team · Wok Tum
Photo: Mira Villas
Koh Phangan's west coast faces the sun as it drops into the Gulf. From Mira you can be on the sand in four minutes, so plan dinner around it.
Article · story
For investors. The quietest room: white ground, ink, numbers. Moss appears only on data. The investment page is the reference for anything financial.
General Sans only. No italics, no serif flourishes. Tabular figures everywhere.
The asset as built: wide, straight, daylight. Fewer photos, larger.
Numbered sections, tables, currency switch, appendix. Every claim has a number.
None.
Make every getaway unforgettable. Here is how the numbers work.
Investor overview 2026
| Section | Page |
|---|---|
| The deal | 01 |
| The asset | 02 |
| The returns | 03 |
| The backup | 04 |
Memo · story / cover
What each line is allowed to change. Anything not in this table comes from the core.
| Villa | Friends | Collabs | Journal | Invest | |
|---|---|---|---|---|---|
| Audience | Guests booking | Guests on the island | Creators, brands | Trip planners, Google | Investors |
| Ground | Paper | Sand | Night (dark) | Page (lighter paper) | White |
| Accent | Bronze + copper CTA | Olive | Sage + moss band | Tide | Ink, moss for data |
| Serif | One italic phrase | Upright, for names | Italic counter-voice | Italic in headlines, drop cap | None |
| Headline size | Large | Medium | Poster (100px+) | Medium | Medium-small |
| Photos | Full-bleed interiors | Places, people, food | 9:16 frames, textures | Island landscapes | The asset, wide |
| Motion | Minimal | Minimal | Allowed | None | None |
| Voice | Warm, “you” | A friend's note | Short, confident | Knowing local writer | Precise, numbers first |
| Villa + Book highlights | Island highlight | Collabs highlight | New highlight | Not on Instagram |
Before you design anything, answer one question: who is going to read this? The answer picks the line, and the line gives you the colours, type, photos and voice.
If two lines seem to fit, choose the one whose reader would act on it. A guide that ends in “book now” is still the Journal; booking just appears as the copper button.
The same rules, applied to the places we publish most.
Hotel and lifestyle brands that sell to everyone but run clearly marked lines.
HOSHINOYA · KAI · RISONARE · OMO · BEB · LUCY
One Japanese company, six lines, each with a one-sentence promise about who it's for: luxury and local culture, onsen ryokan, families, city explorers, groups of friends, mountains.
StealA fixed audience promise per line. That's the “For guests…” sentence on every line above.
hoshinoresorts.com/enSoho House · Soho Friends · Soho Works · Soho Home · Cowshed
One identity built on one typeface used at very different weights; the same system was stretched to launch new channels. Cowshed keeps its own calmer tone inside the family.
StealChange weight and size per line, never the family. Collabs gets poster-size sans, Invest stays small and plain.
plusagency.co.uk · Soho House identityAman · Aman Residences · Aman Interiors · Janu
Aman is whisper-quiet seclusion; Janu, its sister, is described as a spirited social scene. Same quality bar, opposite energy, shown through photography and copy.
StealQuiet vs social. Invest and Journal are the Aman side; Friends and Collabs are the Janu side.
hospitalitydesign.com · Aman launches JanuAirbnb · Airbnb Plus · Airbnb Luxe
One brand red for the marketplace; Plus and Luxe each get their own accent that only appears on their own pages, never in the main marketing.
StealOne scoped accent per line, never mixed on the same page. Exactly the token model proposed here.
getdesign.md · Airbnb tokens (third-party)Products · stores worldwide
Packaging and type never change; every store is designed by local architects around its neighbourhood. The core is fixed, the surface is local.
StealFix the parts (logo, type, buttons, grid). Let only the surface move (ground, accent, photo mood, voice).
wallpaper.com · Aesop storesOne fan mark · a fan per city
The fan logo is constant, but each hotel gets its own fan variant, and the long-running “I'm a Fan” campaign kept one photographer across years.
StealOne photographic hand across every line, so even the loud Collabs pages still read as Mira.
hospitalitynet.org · Mandarin Oriental fansAirbnb's accent hex values come from a third-party token extraction, not from Airbnb itself. Six Senses, Ace Hotel and Habitas were considered but not verified, so they're left out.
Every new page, story or document starts by choosing its line. On the website one attribute on the page picks the line and the shared stylesheet swaps the tokens.
Who is reading? Guests booking, guests exploring, creators, readers or investors.
Wordmark, General Sans and Cormorant, hairlines, buttons, real Mira photos. Never a third font or a new logo.
Ground, accent, serif style, photo rule and motion budget from that line. Nothing else changes.
Read it in the line’s voice. If it would fit another line better, it belongs there.
<body data-line="friends">
[data-line="friends"] { --ground:#E7DDCC; --accent:#6B6D40; --text:#2B261F; --serif-style:normal; --motion:low }
[data-line="collabs"] { --ground:#121211; --accent:#8D8E76; --text:#F1EEE9; --serif-style:italic; --motion:on }
[data-line="invest"] { --ground:#FFFFFF; --accent:#0F0F0F; --text:#0F0F0F; --serif-style:none; --motion:off }
Everything you need to start. Use the files from here rather than screenshots or old copies.
CSS tokens · core + lines
:root {
/* core */
--paper:#F1EEE9; --ink:#0F0F0F; --moss:#686636; --bone:#D6CFC8;
--font-sans:'General Sans', system-ui, sans-serif;
--font-serif:'Cormorant Garamond', Georgia, serif;
/* lines */
--villa-bronze:#8A6A55; --book-copper:#A3593A;
--friends-sand:#E7DDCC; --friends-olive:#6B6D40; --friends-soil:#2B261F;
--collabs-night:#121211; --collabs-sage:#8D8E76;
--journal-page:#F6F3EE; --journal-tide:#4E6151;
--invest-white:#FFFFFF; --invest-ink:#0F0F0F;
}
/* on the website every page declares its line: */
<html data-line="villa | friends | collabs | journal | invest">