type · every role, on real content
Two families with fixed jobs, one fluid spine from 400px to 1240px, and hierarchy below h3 that comes from opacity and case instead of more sizes.
fun experiments
display-xl · mono · clamp(2.5rem → 6rem) · 700 · lh 1.05 · tracking -0.02em · uppercase via css
🐌 So Snail Media
title · mono · clamp(1.75rem → 2.75rem) · 700 · lh 1.25 · tracking -0.01em · amber via the --amber variant, the page's one amber moment
Hi,
I am Kesh.
title-soft · mono · = title · 400 + --stroke-semi 0.35px · lh 1.25 · tracking -0.01em · amber · the hero variant, because space mono ships no 600
The Internet Has Changed
h2 · mono · clamp(1.25rem → 1.5rem) · 700 · lh 1.3 · tracking -0.005em · as-typed
Shell Growth and Conversation Evolution
h3 · mono · clamp(0.9375rem → 1.125rem) · 700 · lh 1.4 · tracking 0 · as-typed
can't decide what to eat? shake your phone, let physics pick.
lede/dek · sans · clamp(1.0625rem → 1.25rem) · 400 · lh 1.6 · tracking -0.01em · sentence · mut
A design technologist who executes whacky ideas. With the help of design and tech, I design things that fall in the intersection of design “aha” and “wtf?”—based in Singapore.
hero-sub · sans · lede scale · 400 · lh 1.6 · tracking -0.01em · 52ch · full · text-wrap pretty
Somewhere along the line, I realized I wanted to do more than just Push Pixels. Rather than having something be stuck in a digital plane, I wanted to make things that people would touch, feel, and interact with. As you can tell, I was slowly inching towards interaction design.
body · sans · 1rem · 400 · lh 1.7 · tracking 0 · sentence · full
random small builds that didn't earn a full case study, poke around and see what breaks .-.
body-sm · sans · 0.875rem · 400 · lh 1.6 · tracking 0 · sentence · mut
pixel art of a snail with a spiral shell overlooking a warm-lit hillside city at dusk
caption · mono · 0.6875rem (0.75rem ≤760px) · 400 · lh 1.5 · tracking 0.02em · sentence, NOT caps · mut
aug 16, 2025 · monologues
kicker/meta · mono · 0.6875rem (0.75rem ≤760px) · 400 · lh 1.5 · tracking 0.07em · uppercase · mut
creativetech.wtf w??? thoughts fun experiments singapore, +8 · 21:04:37
nav · mono · 0.8125rem · 400 (wordmark 700) · lh 16px fixed · tracking 0.01em · lowercase · mut · amber wipe on hover
Expore All Works → open → see it live →
action · mono · 0.8125rem · 700 · lh 16px fixed · tracking 0.02em · as-typed · full, underline, .hl wipe
To me, an artist weaves his thoughts onto a medium. — kesh · genai and ownership · sep 2024
quote · sans · = lede · 400, NEVER italic · lh 1.6 · tracking 0 · full · amber 2px left border, no giant quote marks
quote-attribution · mono · 0.6875rem (0.75rem ≤760px) · 400 · lh 1.5 · tracking 0.07em · uppercase · mut
what moves between them is .animap, an open json format
bundling mesh points, triangulation and driver indices.
code-inline · mono · 0.92em relative · 400 · lh inherit · tracking 0 · as-typed · full
npm i portra-anima
<portra-anima src="kesh.animap">
</portra-anima>code-block · mono · 0.8125rem · 400 · lh 1.5 · tracking 0 · as-typed · full
| readout | value |
|---|---|
| player size | ~9.5kb gzipped, webgl |
| player license | mit |
| file format | .animap, open json |
| runtime ai | none |
table · mono · 0.8125rem body / kicker header · 400 · lh 1.6 · tracking 0 · full body, mut header
client work lives at evotions.cc
smallprint · mono · 0.6875rem (0.75rem ≤760px) · 400 · lh 1.6 · tracking 0.02em · sentence · mut