The Hejaz Survey Plate
A visual identity drawn from ten colours of the Jordanian identity palette and built as a working engineering document rather than a portfolio that talks about engineering. This page records what was chosen, what was measured, and what was rejected.
- 10Palette colours, all used
- 7Worlds derived, one built
- 68Files reskinned by three rules
- 0Rounded corners remaining
Measurements before adjectives
The Hejaz Railway was surveyed through Amman, Qatrana and Ma'an, and the plates that recorded it are bilingual engineering documents: station tables, gradient profiles, mileposts, everything ruled and stamped and nothing decorated. That is the register this site needed. A station table is a service inventory. A gradient profile is a metrics chart. A milepost is a version marker.
The identity refuses one arrangement in particular: the near-black portfolio with a single neon accent, a monospace hero and a fake terminal prompt. That layout is what the category ships, and shipping it would make an engineer who actually runs multi-account AWS under PCI-DSS look exactly like one who has only read about it.
Ten colours, every one given a job
The source is Jordanian Identity Colors, ten tones drawn from Jordan's landscape, culture and heritage. Nothing was added and nothing was dropped. What the contrast maths decided was which colour can carry text, which can only carry graphics, and which has to flip between day and night.
What the contrast maths decided
Every colour was measured against both grounds before any of it was assigned, so the roles are a result rather than a preference. Keffiyeh Red is unusable at night and Wadi Rum Sand is unusable by day, which is why the accent swaps instead of dimming.
| Colour | Hex | On Salt White | On Black Iris | Verdict |
|---|---|---|---|---|
| Keffiyeh Red | #8B1E2D | 7.25 | 1.68 | Accent, day only |
| Wadi Rum Sand | #D9A36A | 1.79 | 6.81 | Accent, night only |
| Black Iris | #2B2233 | 12.21 | 1.00 | Headings by day |
| Salt White | #EAE6DB | 1.00 | 12.21 | Headings by night |
| Basalt Black | #3C3C3C | 8.85 | 1.38 | Copy by day |
| Amman Stone | #D9C9B0 | 1.30 | 9.38 | Copy by night |
| Dead Sea Blue | #2F5D6B | 5.81 | 2.10 | Second ink, day only |
| Desert Camel | #B9875E | 3.14 | 4.85 | Second ink, night only |
| Petra Rose | #C76B6B | 2.93 | 4.16 | Large text and graphics |
| Olive Green | #6B7A4F | 3.72 | 3.28 | Graphics only, never copy |
Three neutrals the palette could not supply
The source has no tone quiet enough for metadata that still clears AA, so four values are derived from it rather than borrowed from somewhere else.
- #6B6257Secondary text, day · 4.80:1 on Salt White
- #A39A8FSecondary text, night · 5.49:1 on Black Iris
- #C4B79CRuled keyline, day · 1.59:1 on Salt White
- #544A5ERuled keyline, night · 1.83:1 on Black Iris
Seven worlds, and the one the roll picked
Left to rank them, any designer ships their favourite. So the seven candidates were derived first, ordered by resonance, and a seed then decided which one got built. It landed on number four, not number one.
- 01Nabataean hydraulics at Petra. Carved channels and catchment basins: multi-account infrastructure, two thousand years early.
- 02Aerial survey of the Harrat. Desert kites legible only from above, line overlays on satellite plates.
- 03The keffiyeh weave. Interlocked identical cells forming one strong fabric, fringed at the selvage.
- 04Hejaz Railway survey plate. Bilingual gridded station tables, gradient profiles and mileposts, stamped and ruled.Built
- 05Dead Sea evaporation pans. A staged pipeline as graded colour fields, brine through to crystal.
- 06Amman's stair-streets. Civic wayfinding by ascending numbered staircase.
- 07Jordanian tourism poster. The brief's literal reading, held to a single slot on purpose.
What the challengers lost on
Six alternative worlds were dealt against the assignment. Each was fused with the product before being judged, then weighed on two axes only: whether the audience recognises it, and whether it makes the product clearer.
Home and away colourways map exactly onto light and dark, and big back numerals would carry the metrics well. Lost because a kit wall could belong to any country, and the brief pins Jordan.
Infrastructure as numbered assembly is genuinely apt. Sky blue and brick red are native to the form and fight the pinned palette, and the toy register undercuts a regulated-fintech pitch.
Strong engineer recognition and good for metrics. Phosphor green on near-black is the exact category default the exercise exists to refuse.
Its own governing rule is that nothing is ever drawn on white, which removes the light mode the brief requires.
Depth as rank works for a content hub, but emissive black with one signal accent and a bitmap face is the same default wearing a subculture's clothes.
A surreal world with nothing in it that can carry a service inventory, a metric, or nine content collections.
A public-works face and a plate face
AWS platforms that hold up under audit
Public Sans sets the reading. It is the typeface of a public-works documentation standard, which is the register a survey plate belongs to, and it holds up across nine content collections without asking to be noticed.
Archivo 900 · Public Sans 400 · JetBrains Mono 500
IBM Plex Sans was doing both roles before and is gone from the build entirely. It is a good face and the wrong one here: it is also the face every technical site reaches for, so it cannot carry an identity that is trying not to look like every technical site.
Archivo is a grotesque with real weight in the upper range, which is what a station name needs. It is set at 800 and 900 with negative tracking, so a long heading stays one block instead of drifting apart. JetBrains Mono stays for machine facts. If a person wrote it, it is Public Sans; if the system generated it, it is mono and uppercase.
Every control is a stamp: hard keyline, no radius, mono tracked label, and an offset shadow that collapses when the primary action is pressed, so the block lands exactly where its own shadow was.
Three rules moved sixty-eight files
The site already had its motifs declared once and shared. Renaming them would have meant editing every file that used them, and a half-finished sweep reads as a bug rather than as a decision. So the class names stayed and their bodies were rewritten.
| Motif | Files | Was | Is now |
|---|---|---|---|
| .fx-ambient-bg | 59 | Two soft radial washes | The ruled plate: a 16px fine rule and a 96px heavy division, masked off below the fold so running copy stays clean |
| .fx-fade-up | 68 | 16px float over half a second, on everything | A 3px settle on a sharp curve, cut to 0.26s. It lands on forty-chip tag clouds, so it had to get quieter rather than louder |
| .fx-divider | — | Hairline fading out at both ends, tinted at the centre | A measured tick: a heavy stub of route ink at the left margin sitting on a full-width rule |
Expressive motion deliberately stayed out of the shared class. It went into named motifs placed by hand: .fx-route-draw surveys the route across the plate and .fx-milepost presses a measurement onto it. The corner radius scale went to zero at every step, so a rounded control anywhere on the site is now evidence of a private copy that needs deleting.
Fixed along the way
- The mobile menu button was clipped off the right edge. The logo carried flex-shrink-0 and rendered the full name at text-lg, so at 390px the row was wider than the nav and the hamburger was the element that lost. The logo shrinks and truncates now; the action cluster does not.
- The theme switcher icons were unreadable. The sun and moon were hardcoded to text-gray-800, which is near-black on the new route-ink knob. They inherit the knob's own contrast colour now: 7.25:1 by day, 6.81:1 by night.
- The switcher rule was painting the wrong element. A bare span selector also matched the visually-hidden label inside the control, giving a screen-reader string a background and a transform.
- The active nav state was a tinted slab. It is a route tick under the label now, drawn with an inset shadow so changing section never shifts the row by a pixel.
- Social cards carried the retired identity. The generated OG image was a white gradient with the old green. It is plate stock, ruled, with a route-ink eyebrow stamp and the title set in Archivo.
- Toast success colour. Success stays green because it is a status rather than a brand colour, but it is the palette's olive now: 7.44:1 on the light toast surface, 6.29:1 on the dark one.
Not finished yet
The foundation is in: tokens, both themes, the type pairing, the shared motifs, the control language, the header and the social cards. What is honestly still outstanding:
- The homepage below the hero. Everything under the route line is still the old centred rhythm with uniform section spacing.
- Section pacing. Every band currently has the same height and the same alternating tint, which is what makes a long page read as one texture.
- The banner illustration. A light-mode raster sitting on plate stock. It needs redrawing in the plate's own line grammar, or removing.
- Footer and content cards. Still generic. The footer wants to be the route's terminus stamp.
- Accessibility sweep and DESIGN.md. The axe audit needs re-running against the new palette, and DESIGN.md still describes the retired green system.