All workCase study Brand Systems

Mitti Studio

Brand system for a ceramics studio

An identity for a ceramics studio that feels handmade and rigorous at once — warm clay, exacting grid.

Mitti StudioRuns live
Screenshot of Mitti Studio on a desktop

A sample brief, a real product. We wrote this brief ourselves to show how we work; the client and their story are illustrative. The product is not: it was designed and engineered here, and you can use it below. We publish results only for work a client has let us verify, so this page shows none.

Mitti Studio live demoReady
The real front end, in your browser. Sample data. Nothing is saved.Open in a new tab (opens Mitti Studio full screen)
Screenshot of Mitti Studio on a desktop
1

The brief

Mitti Studio makes quiet, beautiful objects and had a loud, borrowed logo. We built a full identity that matches the work — tactile, precise, unmistakably theirs.

2

The problem

Craft brands drift into cliché fast. We needed warmth without the usual rustic costume, and rigour without going cold.

  • An identity that feels made by hand
  • A system that survives real-world use
  • Type and marks that scale to a stamp
  • Guidelines the studio can actually follow
3

The approach

We drew the marks from the process itself — the wheel, the glaze line, the kiln — then set them on a strict grid.

  • A primary mark plus a working set
  • A type and colour system with room to breathe
  • Physical applications, tested on real objects
  • A short, usable set of guidelines
4

What shipped

  • Palette with a WCAG contrast checker
  • Type scale slider
  • Mark variants
  • A radius token that redraws components
  • CSS, JSON and Swift export
  • Changelog and publish
  • Component gallery and icon set
  • Motion tokens
  • Token change reviews: propose, approve, decline
5

Under the surface

How it is built

Design tokens live in Figma, export through Style Dictionary into CSS variables and a typed React kit documented in Storybook; Chromatic gates every visual diff in CI.

  • Single token source compiled to web, iOS, print
  • Storybook as the contract between design and build
  • Chromatic visual regression on every PR
  • Versioned brand releases with changelogs

Considered and turned down

A static PDF guideline — rejected because brands drift; pipelines don’t.

Stack

Figma TokensStyle DictionaryStorybookReactViteChromatic
6

The mechanism, working

The part of Mitti Studio that was hardest to get right, as a small model you can operate.

lab/tokensOpen in the Lab

Token pipeline

One source of truth compiles to CSS, iOS and print. Every visual diff gates a pull request.

Start here

What are you building?

Pick one and we hand you the closest thing we have already built. Or go straight to the brief: a person replies within one working day, with an honest view on scope, time and cost.

Start a project
studio@yakooha.com+91 81042 13809Mumbai10:00 to 19:00 IST, Monday to Friday
What are you building?