24 lines
1.3 KiB
HTML
24 lines
1.3 KiB
HTML
|
<!doctype html>
|
||
|
|
<!-- @dsCard group="Type" name="Type · Body & Lead" subtitle="Lead 17/1.55 · Body 15/1.5" viewport="700x220" -->
|
||
|
|
<html><head>
|
||
|
|
<meta charset="utf-8"><title>Body & Lead</title>
|
||
|
|
<link rel="stylesheet" href="../colors_and_type.css">
|
||
|
|
<style>
|
||
|
|
body { padding: 28px 32px; background: var(--paper); display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
|
||
|
|
.col .label { display: block; margin-bottom: 8px; }
|
||
|
|
.col .spec { color: var(--fg-3); font-family: var(--ff-mono); font-size: 10px; letter-spacing: 0.04em; margin-top: 6px; display: block; }
|
||
|
|
p { margin: 0; max-width: 56ch; }
|
||
|
|
</style></head>
|
||
|
|
<body>
|
||
|
|
<div class="col">
|
||
|
|
<span class="label">Lead</span>
|
||
|
|
<p class="lead">A prototype is a question made tangible. The purpose is not to prove an idea is brilliant — it is to learn what is useful, desirable, or irrelevant.</p>
|
||
|
|
<span class="spec">.lead · system-sans 400 · 17 / 1.55 · fg-2</span>
|
||
|
|
</div>
|
||
|
|
<div class="col">
|
||
|
|
<span class="label">Body</span>
|
||
|
|
<p>Signals are evidence, not vibes. Weak signals are useful if clearly labelled. Contradictory signals should be preserved. A signal should be connected to a prototype, audience, or hypothesis. Lack of signal is also information.</p>
|
||
|
|
<span class="spec">p · system-sans 400 · 15 / 1.5 · fg-1</span>
|
||
|
|
</div>
|
||
|
|
</body></html>
|