dk / executable proof

Perfect is computable.

This page treats palette, rhythm, contrast, motion, and optics as one equation. Change one input and the same program recomputes the entire interface.

Open palette engine
motion / snappy
base #295dff light
signal code in, answer out

Every gap, tint, and easing cue is computed from the same dk primitives.

primary #0061d4
secondary #af3f00
tertiary #706c00
APCA 76.6 min 60
Ratio perfect-fourth 1.3333333333333333
Settle 493ms snappy
Distinct ΔE 22.26 deutan 5.12
dashed = compiled envelope measuring toggle a break mode to force an explicit containment delta
Surface mode
Spring curve
Break proof
I

Color & Contrast

Proof / chroma

Tonal scale stays perceptually even.

50 #eef6ff Lc 99.9
100 #d7e9ff Lc 91.7
200 #b5d6ff Lc 80.3
300 #85b9ff Lc 64.5
400 #5497fb Lc 60.6
500 #2072e4 Lc 76.6
600 #0052c3 Lc 88.4
700 #00359a Lc 97.7
800 #002075 Lc 103.3
900 #000f4d Lc 106.3
950 #00042a Lc 107.6

Proof / contrast

Readable states, not hopeful ones.

PASS Lc 98.5

Body on surface

PASS (Lc 98.5 >= 60)

Aa #16181c
PASS Lc 76.6

Primary action

PASS (Lc 76.6 >= 60)

Aa #ffffff
PASS Lc 77.7

Signal accent

PASS (Lc 77.7 >= 60)

Aa #ffffff
II

Space & Structure

Proof / rhythm

Spacing and type move as one ladder.

--proof-xs clamp(0.703rem, 0.625rem + 0.347vw, 0.938rem)
15px
--proof-base clamp(0.938rem, 0.8333rem + 0.463vw, 1.25rem)
20px
--proof-sm clamp(1.25rem, 1.1111rem + 0.617vw, 1.667rem)
26.7px
--proof-md clamp(1.667rem, 1.4815rem + 0.823vw, 2.222rem)
35.6px
--proof-lg clamp(2.222rem, 1.9753rem + 1.097vw, 2.963rem)
47.4px
--proof-xl clamp(2.963rem, 2.6337rem + 1.463vw, 3.951rem)
63.2px
--proof-2xl clamp(3.951rem, 3.5117rem + 1.951vw, 5.267rem)
84.3px

Proof / optics

Geometry is not perception.

geometric
corrected
transform scale(1.12)

Circles appear ~12% smaller than same-dimension squares -- scale to match

width 80.6px

Optically corrected circle size (geometric: 72px)

height 80.6px

Optically corrected circle size (geometric: 72px)

transform translateX(3.6px)

Shift directional icon right by 5% to center visual mass

transform translateY(-1.4px)

Shift icon up by 2% to compensate for baseline alignment

Proof / equation

The equation falls out of the inputs.

:root {
  --perfect-base-color: #295dff;
  --perfect-primary: #2072e4;
  --perfect-surface: #f2f5fb;
  --perfect-ratio: 1.3333333333333333;
  --perfect-curve: linear( 0.000, 0.041, 0.141, 0.272, 0.413, 0.549, 0.672, 0.777, 0.863, 0.929, 0.977, 1.010, 1.031, 1.042, 1.046, 1.045, 1.041, 1.035, 1.029, 1.022, 1.016, 1.011, 1.007, 1.004, 1.002, 1.000, 0.999, 0.998, 0.998, 0.998, 0.998, 0.998, 1.000 );
}

Proof / glass

Glass computes from the same seed.

.perfect-glass {
  position: relative;
  isolation: isolate;
  background-color: rgba(242, 245, 251, 0.48);
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48ZmlsdGVyIGlkPSJuIj48ZmVUdXJidWxlbmNlIHR5cGU9ImZyYWN0YWxOb2lzZSIgYmFzZUZyZXF1ZW5jeT0iMC42NSIgbnVtT2N0YXZlcz0iMyIgc3RpdGNoVGlsZXM9InN0aXRjaCIvPjwvZmlsdGVyPjxyZWN0IHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbHRlcj0idXJsKCNuKSIgb3BhY2l0eT0iMC4wMTIiLz48L3N2Zz4=");
  background-size: 200px 200px;
  backdrop-filter: blur(22px) saturate(145%);
  -webkit-backdrop-filter: blur(22px) saturate(145%);
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 30px;
}

.perfect-glass::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: rgba(242, 245, 251, 0.336);
  backdrop-filter: blur(33px);
  -webkit-backdrop-filter: blur(33px);
  z-index: -1;
}

Proof / compiler

The proof compiles constraints and emits deltas when reality diverges.

compile FAIL 14/15 invariants
render WAIT measuring DOM
failures 1 error-level deltas
score 93 compiled
try it Break the proof on purpose.

Inject overflow or layout drift and watch the verifier emit explicit deltas.

compile Deutan distinctness

Semantic colors should stay meaningfully separated under deuteranopia simulation.

expected >= 15 5.12 -9.88

Proof / layout

The rail solves before the browser paints it.

overlay measuring Dashed boxes are compiled budgets. Solid boxes are the rendered nodes.
signal 119px +19.32px
body 264px +31.62px
assist 116px +14.05px
compression 1
free 0px
total 37
safe region 6552

Proof / composition

Order is measurable, not mystical.

signal
body
assist
order 72
weighted 60
hierarchy 88
baseline 63

Proof / saliency

Importance stays explicit through the solve.

body role:title · area:0.467 · contrast:0.78 · spatial:0.953
40%
signal role:cta · area:0.239 · contrast:0.78 · spatial:0.671
33%
assist role:support · area:0.265 · contrast:0.78 · spatial:0.719 · edge-density:0.581
28%

Proof / distinction

Semantic colors stay apart under stress.

1 #2072e4
2 #af3f00
3 #706c00
4 #85b9ff
base ΔE 22.26
protan 11.29
deutan 5.12
tritan 18.91

Proof / targeting

The interface predicts the cost to touch it.

fitts 515.9ms
choice 478.6ms
steer 891.7ms
total 1899.7ms
touch occlusion 13.5ms

Proof / fit

The browser has to honor the solve, not just admire it.

ratio control measuring

Measured after render. If CSS breaks the budget, the verifier emits explicit deltas.

overflow x 0px
layout drift 0px
missing 0
fit score 0
III

Time & Language

Proof / typography

Spacing adapts when measure and size change.

Mathematical typography becomes proof when measure, line height, spacing, and contrast stay in agreement.
chars 55.1
line ht 1.45
crowding low

Proof / line break

Balanced lines beat accidental ragging.

balanced 246 A proof solver shouldresolve layout,distinction, movement,and reading comforttogether.
greedy 344 A proof solver shouldresolve layout,distinction, movement,and reading comforttogether.
advanced 13828 A proof solver should resolve layout,distinction, movement, and readingcomfort together.
flow tight 391.48px
segments 23
chunks 1
lead 81px 2 lines before handoff A proofsolver
body 367px continues to the end should resolve layout, distinction, movement,and reading comfort together.

Proof / minimum jerk

There is a calmer curve than springiness.

duration 0.493s
samples 25
curve 1