← Examples

Pewter.

GitHub-dark cribbed wholesale — centered hero, semantic colored badges, structured sections with hairline dividers.

rust apache 2.0 superset of rdf preview
View breakdown See it live

Three feature columns

Pewter pages stack content in centered, full-width sections divided by hairlines, with feature grids inside each.

One thing

A short paragraph in muted gray. Cards have an 8 px radius and a single-pixel border.

Another thing

Surfaces use --surface on top of --bg.

A third thing

Buttons lift 1 px on hover, like Lacquer, but never animate continuously.

// Pewter mono uses SFMono-Regular, GitHub-style highlights
struct Palette {
  bg:     "#0d1117",  // GitHub dark
  accent: "#58a6ff",  // GitHub blue
  green:  "#3fb950",
};

Style breakdown

Tokens copied from GitHub's own dark theme, plus four semantic badge colors.

Palette
#0d1117 bg
#161b22 surface
#30363d border
#e6edf3 text
#8b949e mute
#58a6ff accent
#3fb950 green
#d29922 orange
#bc8cff purple
Typography
-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial — the GitHub system stack to the letter.
Code: 'SFMono-Regular', 'Consolas', 'Liberation Mono', monospace.
Headlines
Hero h1 at 3em 700, letter-spacing: -0.02em. Centered, not left-aligned — this is the only style here that does that. Section h2s also bold, 1.6em, letter-spacing: -0.01em.
Components
Badge — pill (border-radius: 16px), padding: 4px 12px, weight 600. Each kind has a hand-picked dark fill + bright text pair: rust (#3e2723 / #ff8a65), license blue (#1a237e / #82b1ff), license green (#1b5e20 / #81c784), preview magenta (#4a1942 / #e879f9).
Button — primary fills with accent (text becomes the bg color); secondary uses --surface with --border.
Section — full-width, hairline-divided, centered max-width 880 px.
Spacing
Hero padding 80px 20px 60px. Section padding 56px 20px. Feature card padding 18×20px. Buttons 12×28px.
Signature motif
The centered hero with badge row. Pewter is the only style here that puts everything down the middle of the page; everything else is left-aligned in a 600–760 px column. Combined with the GitHub palette it reads as “classic open-source project README rendered as a real site.”
In use: loka. The most divergent of the sister sites — predates the Lacquer template the others adopted and has not been migrated.