Built from three soft forms.

Logo

The logo is the founder’s own drawing, used exactly as supplied: three soft forms in indigo, bright blue and cyan, and a wide, light wordmark in indigo. We never redraw, recolour or rearrange it. The site draws it inline from the original paths so it stays sharp at any size.

Where it can sit

Only on white or near-white grounds, where it was designed to live. The number is the wordmark’s contrast on each ground.

• White #FFFFFF6.88:1
• Neutral 50 #F9FAFC6.59:1
• Mist #F0F2F76.14:1
• Blue 50 #F3F7FF6.41:1

Never

• Logo

  On dark or saturated colour. The blue wordmark falls to 2.6:1 on Night. Dark sections simply carry no logo.

• In any colours but these. No white, black, single-colour or gradient versions. Always indigo, bright blue and cyan, exactly.

• Stretched or squashed. Scale it evenly, or not at all.

• Rotated or tilted. The forms already lean. The logo itself stays level.

• With effects. No shadows, glows, outlines or blur.

• Imisium

  Rearranged or retyped. The mark sits to the left of the drawn wordmark. Never stack it or set the name in a font.

Motion and the logo

In the name section the three forms breathe with the site’s rhythm. They settle back to exactly their drawn size on each inhale and ease down by at most 4% on the exhale, so they never grow past the original. With reduced motion on, they never move. Elsewhere the logo is still.

Colour

Three colours from the logo, a cool neutral that sits quietly beside them, one warm complement used sparingly, and three colours that only ever mean something went right, needs attention, or went wrong.

The logo’s colours

• Indigo#3045E0

  The action colour and the wordmark. Buttons, links, focus rings, the one thing to press.

  --blue-600On white 6.88:1Text OK

• Bright blue#3563FC

  Support. The breath meter, progress, the rising lines of the breath field.

  --blue-500On white 4.84:1Text OK

• Cyan#02C9EE

  Fresh air. Highlights on Night and on brand blue. Never text on a light ground.

  --cyan-400On white 1.98:1Never text on light

Scales

Eleven steps each, generated in OKLCH so equal steps look equally different. The number under each swatch is its contrast against white.

Roles

Components use roles, never raw scale steps, so the system can be tuned in one place.

Semantic colours

Reserved for state. Each always travels with an icon and words, never colour alone.

• Success. Bill created in Xero.

  50 #E6FCEC200 #AEE8C1500 #36AC62700 #227240

  Text 700 on 50: 5.49:1

• Warning. Running cost is near the limit you set.

  50 #FFF7DD200 #FADB90500 #F2AB19700 #8B5510

  Text 700 on 50: 5.76:1

• Error. That didn’t send. Check your connection.

  50 #FFF2F1200 #FFC3C0500 #E94646700 #BE2327

  Text 700 on 50: 5.56:1

Typography

One family does nearly everything. Width is the lever: wide and light for display, the way the wordmark is drawn, and normal width for reading.

The width axis

The same word at four widths. On the home page, the hero’s last line, “and nobody else’s.”, moves between 112 and 125 with every breath, and section titles widen into place as they arrive.

Scale

Fluid between a 360px and a 1600px screen. Two tiers: text sizes step by about 1.25, display sizes by about 1.55. Display never passes 96px.

1. Display

   48 to 96px

   Width 125 · weight 300 · line 1.0 · tracking −0.035em

   Room to breathe.

2. Heading 2

   34 to 64px

   Width 125 · weight 330 · line 1.04 · tracking −0.03em

   Four steps. No surprises.

3. Heading 3

   26 to 40px

   Width 116 · weight 380 · line 1.1

   The busywork, handled.

4. Heading 4

   20 to 26px

   Width 108 · weight 500 · line 1.22

   People stay in charge.

5. Lede

   18 to 21px

   Width 100 · weight 400 · line 1.5

   A simple process for busy people.

6. Body

   16 to 17px

   Width 100 · weight 400 · line 1.6 · measure 66ch

   We build in short cycles and show you working software every week.

7. Small

   15px

   Width 100 · weight 400 · line 1.55

   We only use this to reply to you.

8. Caption

   13px

   Width 100 · weight 400 to 500 · line 1.45

   An example workflow with sample data.

9. Data

   12px

   Martian Mono · weight 400 · tabular figures

   INV-2291 · 7.8s · #3045E0

Usage

• Headings are set wide and light, like the wordmark. Reading text is set at normal width.
• Sentence case for headings, buttons and labels. The guarantee seal is the one place set in capitals, as seals are.
• Emphasis comes from colour, weight or width. There are no italics.
• Body text runs no wider than about 66 characters.
• Numbers in tables and steppers use tabular figures. Big standalone numbers do not.
• Sans-serif only. No serif appears anywhere in the system.

Space and layout

A 4px base, a twelve-column grid, and generous room between sections. Tight inside a group, generous between groups, and always more space above a heading than below it.

Shape and depth

The mark is made of capsules with soft, round ends. So anything you can press is a capsule too. Things that hold content get softer corners the bigger they are, and rows of data stay square. The same radius is never used for everything.

• --radius-xs6px · Tags, checkboxes
• --radius-s10px · Small inner pieces
• --radius-m16px · Inputs, output cards
• --radius-l24px · Cards, open rows
• --radius-xl36px · Panels, the demo stage
• --radius-pill999px · Anything you press

Components

Every piece below is the real component, styled by the same tokens the site uses. Hover, press and tab through them.

Motion

Ìmísí means breathing into something, so the whole site moves to one slow breath: six a minute. Motion is calm, it always has a job, and it never hides content.

Voice

The words follow the same rules as the design: plain, calm and specific.

• Say “Invoices get read, matched and filed.”

  Not “Unlock seamless AI-powered finance.”

• Say “A person approves anything that touches money.”

  Not “Human-in-the-loop orchestration.”

• Say “Fixed price, agreed before we start.”

  Not “Flexible, value-based engagements.”

• Short sentences. Concrete nouns: invoices, leads, inbox, spreadsheet.
• No em dashes or en dashes. Use a full stop, a comma or a colon.
• Never “unlock”, “supercharge”, “seamless” or “elevate”.
• Never invent proof: no fake logos, testimonials or numbers. Label sample data as sample data.