Find your way

All notes
Note 03 · Craft · 6 min read

Four strokes.

Four lines through one point: three colours for three worlds, and one for the thinking between.

My mark, drawn stroke by stroke. Watch it turn from the star into TK, drag the slider yourself, or switch on X-ray to see the grid it's built on.

I work in technology, and I work in creativity. Over the years those became separate verticals: the products I build, the films and stories I create, the memories I make for people. Each one its own line, on its own level.

It started as a word

At first I imagined a wordmark: just my name, with the T built out of lines, the verticals stacked into a letter. But when I looked at those lines arranged into a T, I saw more than a letter.

Every direction, one point

I've always liked the asterisk, the sign that points every way at once. It's the shape at the heart of Claude Code's mark, a tool I build with every day; AI and automation are part of my work too. And it's how I work: going in every direction, but always connecting those directions to each other.

That became the idea. Lines at different levels, all meeting in one point. It's how I see things: separate levels arranging themselves into one meaning, connections that aren't obvious until they are. I worked it out in my motion lab, and the hardest part was making the star and my initials the very same four strokes.

One stroke for each world

The mark is four straight strokes through one point, with round ends, like a pen that touches down and lifts off. Its colours aren't picked for the mark: each one comes from the identity of one of my ventures.

  • Blue, upright: what I build, in software and technology.
  • Crimson, across: what I create, as OXXYZ Media.
  • Brown, falling to the right: the memories, as ISHQ VISTA.
  • And the fourth, rising to the right, has no colour of its own. It takes the ink of whatever it sits on: dark on paper, light on the dark menu. That one is the thinking between.

The three colours never change, because they are the three worlds: wherever you see blue on my site it's about building, crimson is about stories, brown is about memories. The thinking between is the only stroke that adapts, because thinking is what fits itself to each thing.

The star and TK are the same strokes

Beside my full name the four strokes cross in the middle: a star. On its own, the mark becomes my initials, TK. But it's not a second logo. Each stroke keeps its angle and simply slides and changes length:

  • the upright becomes the stem of the T;
  • the crossbar becomes the top of the T;
  • the falling stroke becomes the leg of the K;
  • the rising stroke becomes the arm of the K.

Because nothing rotates or bends, the turn from star to TK is the mark's own animation. On my homepage it holds the star, turns into TK, holds, and turns back, again and again, about every six seconds.

strokes through one point
4
colours, one for each world
3
shapes from the same strokes
2
to turn from one into the other
0.7 s

Where it signs

Once you know the strokes, you'll find them everywhere on the site, quietly doing small jobs:

  • the star beside my name in the header, and the living mark on the homepage;
  • the underline that signs each section title: the three world strokes under Ventures, the thinking-between stroke under the others;
  • the footer card, where each of the four words of my line lights up its own stroke;
  • the lost page, where the strokes start scattered and find their way back to each other;
  • the tab in your browser, as TK.
For developers How it’s builtmark.js

The mark is stored as two sets of four lines on a 100 × 100 grid: the star (| — \ / through 50, 50) and TK (the stem, the bar, the leg, the arm). Drawing it in either shape, or anywhere between, is one interpolation of the line ends. Round caps, a stroke of 12, and the fourth colour is currentColor.

Talib Khan

  • brand
  • identity
  • motion
Next note / 04The voice in the machine
06 / A conversation starts somethingOpen to considered collaborations

Have something
in mind?

Let’s talk

A product to build. A story to tell.
Or a better way to make things work.

talibtalks@gmail.com

Send me a little about the idea, the scope
and when you’d like to get started.

A conversation starts something
01 / Your idea, taking shape

Let’s make
something matter.

A few details are a good place to start.

Step 1 of 4: about you
Step 2 of 4: timing
Step 3 of 4: the idea
Step 4 of 4: your message
Open email draft

Opens your email app with a draft to talibtalks@gmail.com. You choose when to send.

No email app? Copy your message and email talibtalks@gmail.com. Your draft stays in this page until you choose to hand it off.