blob: c508778ba4a49023a6d9dc0fc72699b1270f8953 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
|
<!doctype html>
<html lang="en" class="og">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>herdr OG card — source</title>
<meta name="robots" content="noindex" />
<link href="https://fonts.googleapis.com/css2?family=Archivo:wght@600;800;900&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="/css/og-card.css?v=3" />
<style>
/* Source of truth for /assets/og-card-v9.png.
Regenerate: open this page, capture the full document, crop to the
leftmost 1200x630 (the document is pinned to exactly the card size, but
the browser viewport may be wider). Bump the filename when the artwork
changes — Slack, X and LinkedIn cache unfurls by URL for weeks. */
/* centre the headline in the band below the head rather than in the whole
card, so a four-line headline can't ride up into the lockup */
.in { display: flex; flex-direction: column; justify-content: center; padding-top: 118px; }
h1 {
font-family: var(--disp);
font-weight: 900;
letter-spacing: -0.055em;
line-height: 0.86;
font-size: 104px;
margin: 30px 0 0;
max-width: 15ch;
color: var(--ink);
}
h1 em { font-style: normal; color: var(--spot); }
/* X, LinkedIn and Slack all draw their own attribution over the bottom of an
unfurl, so the lockup and provenance sit at the top and the bottom band is
left deliberately empty. */
.head {
position: absolute;
left: 62px;
right: 62px;
top: 48px;
z-index: 1;
display: flex;
align-items: center;
justify-content: space-between;
}
.head .sub { color: var(--faint); font-size: 21px; letter-spacing: 0.1em; }
.head .sub b { color: var(--dim); font-weight: 400; }
</style>
</head>
<body class="og">
<div class="card">
<span class="ram mass"></span>
<div class="head">
<div class="lockup"><span class="ram"></span><b>herdr</b></div>
<div class="sub"><b>herdr.dev</b> · Apache 2.0</div>
</div>
<div class="in pad">
<div class="eyebrow"><s></s>the agent runtime</div>
<h1>Run them <em>anywhere.</em> Leave them running.</h1>
</div>
</div>
</body>
</html>
|
