Measured Then extended
one designer, every feature
A brand guide an agent can follow. Every value below was read from the live site's computed styles, then tagged so you know what's real.
seven rules the site already follows
A soft grotesk talks to people; a pixel terminal font talks like a machine. Every label picks one.
Radius is 0. Tiles, windows, buttons, images. Only code (6px) and tables (8px) soften.
Each page owns a single background: paper, pink, sage, ink. Contrast comes from ink blocks.
#d45bb6 appears only where the pointer is: hover, active chip, current tile.
Headlines run at 150px with 0.8 line-height and touch. Body stays 17px everywhere.
Windows with title bars, version numbers, clocks, Game of Life, base64. Software as decoration.
Things tick, blink and loop linearly. Hovers swap instantly. Nothing floats in.
every colour, measured
Hex values are the site's own Framer tokens and computed colours. Click a swatch to copy it. Usage is where it was found on the six pages sampled.
Schemes
5 measured + 8 extensions · same roles · contrast read live (✕ = below AA) · "use" restyles everything, modules includedwe took the opposite direction
Tag text = page colour.
typesafe raises series a
#03aa5c at 74% over paper.
huge, tight, title case
Sizes switch at the site’s breakpoints (1200 / 810), not fluidly. Headings are typed in sentence case and CSS capitalises them. Resize the window to see the steps.
put jev to work
frontiers, old and new
typesafe raises series a
lies, damned lies, and benchmarks
Side-by-side demonstration
Reinforcement Learning from Human Feedback (RLHF) has led to LLMs that are optimized for human preferences.
Models have been superhuman at chat for years, so where is all the automation? Think of Jev as a frontier-intelligence function call: unstructured state in, typed probabilistic decisions out. Inline code uses Fragment Mono.
Nuance
TypeSafe AI © 2026 · Terms of Use · Privacy Policy
Fonts and free substitutes
| Role | On the site | Licence | Use instead |
|---|---|---|---|
| Display (500) | Die Grotesk C Medium | Commercial, self-hosted I | Inter Tight 500, closest free neo-grotesk with tight default spacing |
| Text (400, faux 700) | Die Grotesk C Regular | Commercial I | Inter Tight 400 / 700 |
| Pixel / machine voice | LisaTerminal Paper 2X3Y Medium | Commercial I | VT323, scaled ×1.18 (--pixel-k) |
| Mono labels (300) | JetBrains Mono | Free (OFL) M | Same font |
| Inline code | Fragment Mono | Free (OFL) M | Same font |
Type presets
Xsame roles and sizes, other voices · "use" restyles the pageput jev to work
Inter Tight + VT323 + JetBrains Mono. Closest free match.
put jev to work
Space Grotesk + Space Mono. Quirkier, more engineered.
put jev to work
Instrument Serif headlines, Silkscreen pixels. For essays.
put jev to work
Archivo at 125% width, Pixelify Sans. Louder posters.
put jev to work
Barlow Condensed 600. Fits more words per line.
square, framed, dotted
No radius, no shadows, almost no borders. Structure comes from ink blocks, 1px drawn outlines, corner crop marks and dot fields.
6px · code8px · tablesNone, except the cookie banner: 0 8px 24px #00000088.
Spacing used
Mno 4/8 grid · these numbers recurGrid
M1240 frame · 100 margin at 1440 · 10 on phones · panels inset 5the pieces that repeat
All live. Hover them: everything that reacts turns magenta.
Nav tiles + dropdown
M36px · flush to top · 5px gaps · hover instantLink-headings + text links
M4px bar · colour eases .5sBody links stay underlined: Read the Case Study · Privacy Policy · ∵ Back
Windows
M V outlinesink bar 20px · 3px frame · panel©2026. All rights reserved.
Made in SF. With Love.
Introducing Jev Intelligence beyond chat
we give a FAQ
what are system one models? what is jev?
is jev just a smaller LLM?
how much does jev cost?
| Existing LLMs | System One + Jev | |
|---|---|---|
| Sampling | Sequential | Parallel |
| Speed | 3–329 s | 70–500 ms |
| Outputs | Strings | Typed values |
Inline: jev.ask(state)
it ticks, it never floats
The site barely animates. On load the headline is already there; one pill pops from scale 0. What moves is software: a clock, a glider, blinking dots, bars on a linear loop. Links ease their colour over 0.5s with cubic-bezier(.12,.23,.5,1). Tiles and the phone menu swap instantly.
| What | Duration | Easing | |
|---|---|---|---|
| Text link / post title colour → magenta | 0.5s | cubic-bezier(.12,.23,.5,1) | M |
| Nav tile bg → magenta, dropdown, phone menu | 0s (instant) | — | M |
| Blinking dots in SVG art | 2s, infinite | linear (on/off) | M |
| Speed race bars | 18.248s, infinite | linear | M |
| "Watch launch video" pill on load | ≈0.5s | scale 0 → 1, curve not captured | V |
| Clock (1s) · Game of Life steps | 1s / step | stepped | M I rate |
Going larger
Xmarquee, horizontal scroll, scramble, dither · all linear, stepped or a hard swapcalibrated decisions
Jev.Confidence 0.93
Resolves through base64 glyphs in 30ms steps, left to right. Use on numbers and labels, never on body copy.
Motion presets
Xswitch in Taste.cfg · every effect below obeys the presetThe site’s own register. Hovers swap in 0s, entrances step in 4 frames over 240ms, tickers click digit by digit. Default.
steps(4, end) · 240msYour playbook rule: things whip in from below on power4-out in about 180ms, with binary opacity and no fades.
cubic-bezier(.23,1,.32,1) · 180msLong settles for editorial pages. Masks instead of fades, 760ms on power3-out.
cubic-bezier(.22,.61,.36,1) · 760msMotion lab
Xported from the HyperFrames animation rules to WAAPI · data-fx="name" · press Run to replaytyped decisions your software can act on
nothing fades. it rises.
JEV.CONFIDENCE
RLCD 0.93
193.6x
$41,200
no type errors
built for automation
notice more.
decide faster.
act now.
ready_
Hairline figures
X@lucasmarkes/hairline · 33 isometric figures that answer the pointer · themed from the scheme · data-hairline="name"Phone menus
tap "Menu" in each phone · pick one for this page’s own nav in Taste.cfgthe bitterest lesson
introducing jev
be memorable
every block, desktop and phone
Menus, heroes, blog pages, marketing sections, gestures, product UI and motion moments, built only from this system. Each one renders live in a 1280px browser and a 390px phone, so the breakpoints are real. Pick one from the menu, use ← → to step through, change the scheme or motion in Taste.cfg, or open it full size.
confident, nerdy, a little smug
Copy below is quoted verbatim from the site M. The patterns under each list are the read I.
- The First (Public) System One Model; Jev Gives AI The Properties Of Code
- We Took The Opposite Research Direction
- 193.6x Faster, 444.6x Cheaper.
- Jev’s Intelligence Per Dollar Is Literally Off The Charts.
- We Give A FAQ
- Let’s Talk Business
Claim first, number second, joke third. Precise decimals. Title Case done by CSS.
- Oct 9, 2026 • TypeSafe News
- Jev.Confidence
- TS.AI.OS1
- Clock Tool 1.1
- Version 0.01
- [b.64]
Name UI like software: dotted identifiers, version numbers, dates with a bullet.
- Contact Us · Talk To Sales
- Create Account · Join Discord
- Watch Launch Video ▶
- Read the Case Study
- View announcement
- ∵ Back
Two or three words, verb first. Odd glyphs (∵ ▶) stand in for icons.
- Extraordinary claims require extraordinary evidence so see below for the receipts. 💅
- We love skeptics, and are skeptics ourselves.
- We raised a really big Series A led by a16z 🤑
- Output tokens: FREE (too cheap to meter).
First person plural, one emoji at the end of a casual line, never in a headline.
the short version
- Pick one page colour per page; build contrast with ink blocks.
- Put labels in pixel or mono, everything people read in the grotesk.
- Write headings in sentence case and let
text-transform: capitalizedo Title Case. - Use magenta only for the thing under the pointer.
- Wrap demos, data and widgets in a window with a version-numbered title bar.
- Mark section corners with 10px crop marks.
- Back every claim with a number and a link to proof.
- Round corners, add drop shadows or use gradient buttons.
- Fade or slide content in on scroll; it should already be there.
- Ease hover backgrounds. Tiles swap in 0s.
- Mix two page colours in one viewport, outside a framed panel.
- Set body copy in the pixel font, or headlines in mono.
- Shrink body text on phones. It is 17px everywhere.
- Put emoji in headings or buttons.
make the next taste index
This folder is the template for Shipped. Class names, hooks and file names stay the same in every index, so agents and the module gallery work on any brand. Only the values change.
node _measure/extract.cjs <out> <url…> (or Shipped’s pipeline/capture-site.mjs) on 4–6 pages at 1440 and 390. Keep the JSON and screenshots in _measure/ and refs/.brand.css (palette, schemes, type) and tokens.json. Tag every value M / V / I / X. Keep the role names (--bg --fg --accent --chip-fg …).DESIGN.md (brief, principles with reasons, colour, type, components, motion, voice, Do / Don’t), quoting the site’s real copy.get the files
m.html?id=pricing&scheme=signal.
How to build the next index for a Shipped client, plus the Framer handoff.
Colours, text styles, spacing and motion as data, for Framer styles or code.
<html data-scheme="paper" data-type="measured" data-motion="computed"> <link rel="stylesheet" href="brand.css"> <script src="brand.js" defer></script> <h1 class="ts-hero">put jev to work</h1> <a class="ts-tile ts-tile--ink" href="/contact">Contact Us</a>