← NewTon DC Tournament Manager

Design System

NewTon DC Tournament Manager — Visual Language Reference

NewTon DC uses a warm, analogue design language built on two typefaces and a hand-picked palette of browns, oranges, and teal. This page documents every visual token — colors, typography, components, and patterns — as a living reference rendered from the actual CSS.

NewTon DC Tournament Manager

Design System — Insignia Regular & Manrope Variable — landing.css

Typography

Display — Insignia Regular, 400 weight

h1, h2, stat numbers, step numerals

H1 Heading
H2 Heading

Body — Manrope variable, 100–900 weight

body, UI labels, buttons, captions

Body text. Line-height 1.6.

Manrope, 1rem, #3d2e1f

UI Label

Manrope, 0.875rem, weight 500

Buttons

Launch (Primary)

Chalker

GitHub / Secondary

Color Palette
Parchment
#f5ebe0
Cream
#fff8f0
Warm tan
#ede0d0
Rich brown
#2b2118
Mid brown
#3d2e1f
Warm prose
#5c4a3a
Muted text
#8a7968
Pale label
#d5c4b0
Warm border
#e0cdb8
Burnt orange
#c0562a
Mid orange
#d4824a
Amber gold
#e8a44a
Muted teal
#4a8c7e
Cards

H3 Card Title

Standard card — cream surface, warm border, lifts on hover.

H3 Feature

Feature card — 4px burnt orange left border. Clean accent, no gradient.

Card Variants

Dark Card

Rich brown surface, parchment text. Authoritative, high contrast.

No border.

Just text on parchment. Confident. Nothing decorative.

Hero Image & Highlight / Stat Card
Hero image specimen
42
Active Players
Section Divider

transparent → #d4824a → #e8a44a → #d4824a → transparent

Showcase Label
Bracket View
Code & Terminal

Open tournament.html in your browser.

const tid = "DC-2024"; return tid;
$ docker pull skrodahl/newton
Step List
  1. Download the release
  2. Open tournament.html
  3. Register players
Footer