Kettle Observatory · Brand book v0.1 · Nine O'Clock
Games · Apps · Curiosities
01 · The idea

A kettle that looks at the stars

The most ordinary thing in the house, pointed at the most extraordinary thing there is.

Kettle Observatory is a tiny studio for little games, small apps and other curiosities. The name puts two things together: a kettle, which is homely, a bit daft and always on, and an observatory, which is all wonder and looking up.

That pairing is the whole brand. We make homely things with a sense of wonder. Big curiosity, small kitchen. Everything we put out should feel like it was made by people who are genuinely delighted by odd ideas, and who'll happily stop to make you a cup of tea.

Pillar one

Homely

Warm, familiar, unfussy. The kind of thing you'd leave out on the kitchen table. Soft shapes, warm paper and plain words.

Pillar two

Curious

Always looking up. We poke at odd ideas to see what they do, and we let you see the poking. The wonder comes before the wit.

Pillar three

Small on purpose

Little games, made carefully by a few people. We'd rather be loved by a handful than shrugged at by millions. Small is the point.

Cosy, not twee.Warm, but never saccharine.
Curious, not clever-clever.Wonder first. No smugness.
Small, not slight.Tiny scope, real care.
Playful, not random.Silly ideas, made with real care.
British-ish, not bunting.A cuppa, not a Union Jack.
02 · The mark

The soft kettle

A round, friendly stovetop kettle whose spout is a little telescope. A curved band, like the stripe on an enamel kettle, turns the body into an observatory dome sitting on a drum. Six simple parts, one idea. It works at 16 pixels and on the side of a mug.

Lid knob · K
Our unit of measure. Its diameter (K) sets clear space, spacing in lockups, the stroke of the handle (about ⅗K) and the width of the band (about ½K).
Handle
One round stroke with soft ends. It's the only line in the mark; everything else is a filled shape.
Body
A soft, rounded dome with gently sloping shoulders, exactly as wide as the base it sits on.
Band
A straight gap about ½K wide, just below the widest point. It's the stripe on an enamel kettle, and the line where an observatory dome meets its drum. It's always there, in one colour or two.
Base
A thin, flush slab, 7K wide and about ½K tall. The body sits right on it, so the kettle feels grounded without a heavy plinth, and it gives a flat baseline that lines up with type.
Telescope
Two rounded tubes, set into the shoulder and tilted up 28°. It always points up and to the right: at the sky, and at what's next.

The telescope pivots from where it meets the body. That joint is the hinge for all of the mark's animation (see Motion).

In the artwork the kettle is four plain filled shapes (handle, lid knob, telescope and body) with no strokes, transforms or masks. It has two frames: a tight one for lockups, and an optically centred one that's a little taller with the kettle lifted, for when it sits on its own.

Clear space and size

Keep 2K clear on every side. Anything smaller than these sizes loses the telescope.

2K clear space

Measured from the outermost edges: handle top, base and telescope tip.

16px
24px
Kettle Observatory
Horizontal · 20px type
KettleObservatory
Primary · 24px “Kettle”

Minimum sizes

Mark: 16px tall. Horizontal lockup: 20px type. Primary lockup: 24px “Kettle”. Below that, Observatory gets too small to read, so switch to the horizontal one.

Colourways

The mark is always one solid colour. These are the approved pairings; cream on cobalt is the hero. Any that fall below 3:1 in the current scheme are greyed out.

Two-tone pinstripe · optional

For big, special moments the band can carry a stripe of coral, floating in the gap with a hairline either side, like the line on an enamel mug. The one-colour mark is still the master; the pinstripe is an extra.

Cream + Coral on Cobalt
Ink + Coral on Cream
Cream + Coral on Ink
  • 48px and up. App icons, splash screens, merch, stickers and big headers. Favicons, nav bars, credits and anything small stay one colour.
  • The gap stays. The stripe floats inside the band with a hairline either side; it never fills it edge to edge.
  • Only the band takes a second colour, and it's always the element colour. Never the handle, lid or telescope.
  • Never on an element background. If the stripe would disappear or clash, use one colour. Because it's a gap, the mark still works without it.

Please don't

The kettle is simple, which makes it easy to break.

Flip, tilt or rotate it

The kettle sits flat on the counter, with the telescope looking up and to the right.

Close the gap

The band is part of the mark at every size, in one colour or two.

Fill the band solid

The pinstripe always floats in the gap, with a hairline either side.

Stretch or squash it

Scale it in proportion, always.

Colour in the parts

Only the band's pinstripe can take a second colour. No two-tone telescopes or lids.

Put it on a weak background

Tints, mid-tones and busy photos make it murky. Use a full-strength colour from the palette.

Add effects

No shadows, glows, bevels, gradients, outlines or permanent steam (steam is a motion effect).

Give it a face

We know. The band makes a very tempting smile. It's a kettle, not a mascot (characters live in the games).

03 · Lockups

Kettle leads, Observatory follows

Observatory sits underneath at 65% of the size, in the same face and weight. It's one name in two lines with a clear hierarchy: Kettle is the bit people actually say.

Primary lockup

Use it wherever there's room: splash screens, the website hero, press kits, merch. The kettle's base sits on the baseline of Observatory and its handle reaches the top of the K; the gap between kettle and name is about 2K.

Horizontal

One line for tight, wide spaces: site nav, game credits, footers, email signatures. The base sits on the baseline.

Mark alone

App icons, favicons, avatars, stickers, end cards. Use it once people already know who we are.

On the boil

Ink on coral is kept for launch days and big announcements. If everything's hot, nothing is.

  • Always set the lockup from the master artwork. Don't retype it. The spacing is tuned by eye.
  • “Kettle Observatory” in running text is two words, title case, no “the”. Shorten to “Kettle” in casual copy, never “KO” (KO is only for catalogue numbers).
  • Observatory is always 65% of Kettle, in the same weight, title case, never spaced-out capitals. The equal-weight stack from the early concepts is retired.
  • Left-aligned, tight leading. The two words share a left edge and sit close together, so they read as one name.
  • Co-branding: put partner marks to the right, separated by a thin rule 2K away, at the same optical height as the kettle.
  • Game title screens: the game's logo leads. We sign off small: “an observation by” plus the horizontal lockup.
04 · Colour

Night sky, milk, and the element

Cobalt night sky, cream and a coral glow. Bright, friendly, a bit electric. Four colours do almost all the work, each with one job.

Schemes to try

Your three ideas, the original, and two of mine. Pick one here or from the switcher at the bottom of the screen and the whole book repaints. Each scheme fills the same four jobs (sky, milk, midnight and element), so nothing else needs to change.

The four jobs · Nine O'Clock

Sky · signatureCobalt

The night sky at nine o'clock, slightly optimistic. Our signature: backgrounds, hero moments, links.

#2B3BFFRGB 43 59 255
Milk · paperCream

Milky tea and warm paper. The page everything sits on, and the colour of the mark on dark grounds.

#FFF3E2RGB 255 243 226
Midnight · darkInk

The sky after midnight. Our black: text on cream, and dark backgrounds for loading screens and games.

#121218RGB 18 18 24
Element · accentCoral

The glow of the element. A pilot light: progress bars, “new”, launch days, the brightest star. Use sparingly.

#FF5A36RGB 255 90 54

Supporting tints

For depth and quiet UI. Never lead with these. In the new schemes they're mixed from the core four.

Dusk

Deep cobalt for shadows, pressed states and night scenes.

#1A1F8C
Steam

Pale cobalt for quiet surfaces, selection and hover.

#D9DDFF
Biscuit

Toasted cream for cards, borders and secondary paper.

#F0DCC0

Roughly this much of each

A rule of thumb for any page, poster or screen.

Pairings

Contrast ratios against WCAG, worked out live for the current scheme. “Text” means 4.5:1 or better; “Large” means 3:1, fine for big headlines and graphics only.

05 · Type

Chunky, plain, and labelled

Three families, each with one job. All free, all on Google Fonts.

Display500–800
Aa

Bricolage Grotesque

ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789

Text400 · 600
Aa

IBM Plex Sans

ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789

Labels500 · 600
Aa

IBM Plex Mono

ABCDEFGHIJKLMNOPQRSTUVWXYZ 0123456789 KO-001 · 28° · 51.48°N

  • Bricolage at its smallest optical size. Always set font-variation-settings: 'opsz' 12, even for huge headlines. It makes the letters chunkier and friendlier, like the kettle.
  • Tight, but not crushed. Headlines at −3% to −4% tracking, sentence case. No full stops in headlines unless it's a proper sentence that's meant to land.
  • Plex Sans does the reading. Body copy, UI and long text. Regular for reading, SemiBold for emphasis. Never Bricolage for paragraphs.
  • Plex Mono is for labels. Capitals, tracked +14%. It's the engraving on the instrument: catalogue numbers, statuses, dates, coordinates and small headings.

Scale

DisplayBricolage 800 · 76/0.95 · −4%Look up.
Heading 1Bricolage 700 · 48/1.0 · −3.5%Always something brewing
Heading 2Bricolage 700 · 32/1.1 · −2.5%Notes from the logbook
BodyPlex Sans 400 · 17/1.55We're a very small studio making games, apps and other curiosities. Most of it starts with a cup of tea and a “wouldn't it be funny if…”
LabelPlex Mono 600 · 12 · +14% · capsKO-003 · On the boil · 14 Nov 2026
06 · Graphic language

Catalogue numbers, steam and a little starlight

A few devices that make anything feel like Kettle Observatory, even without the logo.

KO-001 Warming up On the boil 51.48°N · 0.00° Logbook · No. 12 Est. 2026

Instrument labels

Plex Mono capitals in a thin outlined box, like the plates on a telescope. Use them for catalogue numbers, statuses, dates and tiny bits of nerdy detail.

Steam

The same soft S-curve, in one stroke weight. Wisps rise from things that are warm; laid on its side, it's a section divider.

The starfield

Sparse and quiet: small cream dots at low opacity, with only the odd soft sparkle and barely any twinkle. Keep it for big backgrounds like the hero, banners and splash screens, never behind small logos, cards or text. If it's the first thing you notice, there are too many.

Steamini

Our own constellation, traced over the mark: Gemini's steamier twin. Its brightest star, the coral one where the lid knob sits, is Kettlegeuse. Use it big, faint and rarely: a banner, an end card, the odd bit of merch. (Not a real constellation. Yet.)

Everything we make is an observation

Each project gets a catalogue number, in order, never reused: KO-001, KO-002 and so on. Even the abandoned ones keep their number. It makes a back catalogue feel like a star chart, and it gives the studio a quiet running joke. (Project names below are just examples.)

Observation001
KO-001Clear skies

Moth Radio

A tiny game about tuning in to the secret broadcasts of moths.

Type
Game
Out
Web, itch.io
Observation002
KO-002On the boil

Small Hours

An app that tells you which planets are up while you wait for the kettle.

Type
App
Out
Next month
Observation003
KO-003Warming up

Tidepool Post Office

Sort the mail for a rock pool. Crabs are very particular about their post.

Type
Curiosity
Out
When it's ready
07 · Voice

Talk like a friend who's just put the kettle on

Warm, a bit wry, and properly excited about small things. We sound like people, not a company.

One

Wonder, then wit

Lead with genuine delight. The joke comes second and is never at anyone's expense, including the player's.

Two

Say less, mean it

Short sentences, plain words. If it would sound odd said out loud across a kitchen table, rewrite it.

Three

Honest about size

We're small and we say so. No “revolutionary”, no “immersive”, no pretending there's a marketing department.

Say this

Not this

We made a small game about a lighthouse keeper who's scared of the dark.

An immersive, genre-defining narrative experience.

It's out! Go and have a look.

We are thrilled to announce the official launch of…

Sorry, that broke. We're on it.

An unexpected error has occurred (0x80040).

Three of us, one kettle, a lot of biscuits.

A passionate team of creatives.

The tagline

Always something brewing.

  • What it means: there's always a new observation on the go at the studio. The brewing is ours; the kettle just keeps the water hot.
  • Where it goes: under the lockup on the website and splash screens, in social bios, on loading screens and merch.
  • How to set it: sentence case with a full stop, in Bricolage. It sits with the lockup, never inside it.
  • Don't rewrite it per project. Games get their own lines; this one belongs to the studio.

House words

A small vocabulary we use on the site, in devlogs and in our own planning. Use it lightly; one per sentence is plenty.

Observation
Anything we make. A game, an app, a small curiosity.
Warming up
In development. Not ready yet, but getting there.
On the boil
About to launch, or launching right now.
Whistling
Just out. Come and have a look.
Clear skies
Out in the world and working nicely.
Off the boil
Paused. Back on the hob later, not in the bin.
Cloud cover
Something's down or delayed. Used on status pages.
The Logbook
Our devlog and notes.
Dispatches
The newsletter.

Small words, big moments

Microcopy is where the brand actually lives. Some starting points.

Loading

Putting the kettle on…

Swap in a few rotating lines for long loads: “Finding a clean mug.” “Polishing the lens.”

404

Nothing in this patch of sky.

That page has drifted off. Try pointing the telescope somewhere else.

Back to the homepage
Error

The kettle's boiled dry.

Something went wrong on our end. Give it a minute and try again.

Empty state

No observations yet.

Clear skies so far. Something's warming up.

Newsletter

Dispatches from the Observatory

A short letter when there's something worth looking at. Once a month at most.

Sign me up
Launch post

KO-001 is on the boil.

Moth Radio is out today. It's small and strange and we're very fond of it.

08 · Motion

Gentle as steam

The kettle moves the way a real one does: small rattles, soft wisps, a curious nod. It never spins, bounces or shouts. Your original explorations are in the motion file.

Rule one

Small amplitude

A few degrees, a few pixels. If you notice it moving before you notice the kettle, it's too much.

Rule two

Always looking up

Motion drifts up and to the right, like the telescope and the steam.

Rule three

One part at a time

The telescope nods or the lid rattles. The whole kettle only moves to arrive.

Rule four

Settle, don't bounce

Ease out softly. A hint of overshoot is fine; boinging isn't.

Loops

Stargazing · 4.4s

Scans the sky from its pivot, then focuses. Idle states and loading.

Steaming · 3.4s

Soft wisps drift up from the telescope. Ambient, calm, background.

Coming to the boil · 3.6s

The lid rattles and the telescope puffs. For “almost ready” and launch countdowns.

Two curves, four speeds

Glide

cubic-bezier(.65, 0, .35, 1)

Symmetrical ease-in-out for things that travel and return: scanning, wipes, progress.

Settle

cubic-bezier(.22, 1, .36, 1)

Quick start, long soft landing. For arrivals, hovers and anything responding to you.

150msMicro: colour and tint changes
350msUI: hover nods
700msCharacter: arrivals and intro beats
3.4–4.4sLoops: always slow, always seamless

Respect prefers-reduced-motion: loops stop, the intro jumps straight to the finished lockup, and nothing is lost.

09 · In the wild

On screens, mugs and laptops

How it all comes together. These are mock-ups; names and details are placeholders.

App icon and favicon

Cream on cobalt by default. The kettle sits a touch right of and above centre so the telescope has room. Ink and cream versions for themed icons; coral only for special editions. From 64px up the icon can carry the pinstripe; smaller sizes are one colour.

Game loading screen

Stargazing loop, a starfield, and the coral pilot light as the progress bar.

Always something brewing.

Hover over or tap the logo: the telescope looks up.

Website header

A tiny hover moment on the logo, using Settle at 350–500ms.

Social avatar and banner

The same avatar everywhere: itch.io, Bluesky, Steam, Discord. Banners can carry a faint Steamini.

Business cards

Cobalt front, cream back. Give everyone a silly, honest job title.

The mug

Obviously. Our first piece of merch, and a good thing to send to press with a game.

Sticker sheet

Cheap, beloved, and they end up on exactly the right people's laptops. Hand them out at game jams and conventions.

10 · Tokens

Copy, paste, put the kettle on

The whole system as CSS custom properties, for the website, web games and anything else.

/* Kettle Observatory · tokens v0.1 */
:root {
  /* colour: core */
  --ko-cobalt:  #2B3BFF;  /* sky */
  --ko-cream:   #FFF3E2;  /* milk */
  --ko-ink:     #121218;  /* midnight */
  --ko-coral:   #FF5A36;  /* the element, use sparingly */
  /* colour: supporting */
  --ko-dusk:    #1A1F8C;
  --ko-steam:   #D9DDFF;
  --ko-biscuit: #F0DCC0;

  /* type */
  --ko-font-display: 'Bricolage Grotesque', 'Helvetica Neue', sans-serif; /* always opsz 12 */
  --ko-font-text:    'IBM Plex Sans', system-ui, sans-serif;
  --ko-font-label:   'IBM Plex Mono', ui-monospace, monospace;
  --ko-track-display: -0.035em;
  --ko-track-label:    0.14em;

  /* motion */
  --ko-glide:  cubic-bezier(.65, 0, .35, 1);
  --ko-settle: cubic-bezier(.22, 1, .36, 1);
  --ko-dur-micro: 150ms;
  --ko-dur-ui:    350ms;
  --ko-dur-char:  700ms;
  --ko-dur-loop:  4.4s;

  /* shape */
  --ko-radius-s: 6px;    /* labels */
  --ko-radius-m: 12px;   /* panels */
  --ko-radius-l: 18px;   /* cards */
  --ko-radius-pill: 999px;
}