Archive. This page keeps every direction explored for the house style, so any of them can be picked up again. The proposal is palette A with type B, on its own page.

Archive of all directions · 20 October 2026

House style for nia.gr: all directions

The colours and typefaces for the new nia.gr, to agree on before any page designs. It keeps what makes NIA recognisable, the navy, the sand and the lion, and fixes what fails today: low contrast, links marked by colour alone, and a typeface that was never chosen.

There are four directions, each with its own palette and its own type. You can combine the palette of one with the type of another; the whole page follows your choice, and the address bar keeps it, so a link opens the same combination. Once we agree, the next round turns this into four or five page designs.

Palette

Type

Recommended: palette A with type B. Palette A keeps navy and the menu-bar navy exactly and moves the tile by ΔE 0.005, below the noticeable step, so logo files and print stay valid; every text pair in use passes WCAG AA. Type B adds Piazzolla, a reading face with full polytonic Greek, a true italic and tabular figures, to Commissioner, a sans by a Greek designer, for names, headings and the interface. The other options are there to borrow from: a header idea from D, a callout colour from B.

Today and proposed

Top: today’s nia.grBottom:selectedΔE OK: colour distance; about 0.02 is just noticeable side by side.

Today: nameEnglish on every page, Helvetica or Arial

The Netherlands Institute at Athens

Proposed: nameAs in the hero

Today: headings and textHelvetica or Arial

News & events · Νέα & εκδηλώσεις

Under the aegis of the Institute, scholars and students from the Netherlands conduct archaeological research in Greece.

Proposed: headings and textCommissioner + Piazzolla

News & events · Νέα & εκδηλώσεις

Under the aegis of the Institute, scholars and students from the Netherlands conduct archaeological research in Greece.

Colour

Palette

Select a swatch to copy its hex value. “Was” compares it with today’s colour in the same role.

Tints and shades

Generated in OKLCH at the token’s hue; the sand ramp turns warmer as it darkens so it does not go olive. Framed steps are the palette’s own tokens. Each step is labelled in white, ink or navy-deep, whichever reads best, or in black where none of them reaches 4.5:1, with its contrast ratio.

How the colours relate

Each colour is placed by hue (angle) and chroma (distance from the centre) in OKLCH. The dashed line points to navy’s exact complement.

Proportions

Roughly how much of a typical page each colour covers.

Contrast

Every text colour against every background, computed in this page with the WCAG 2.1 formula.

AAA 7:1 or moreAA 4.5:1, enough for body textLarge only 3:1, enough for text from 24 px (19 px bold), borders and focus ringsFail below 3:1, struck through

Rules

Type

Typefaces

Fonts load from Google Fonts in this preview only. The production theme self-hosts subsetted files and makes no requests to third parties.

Specimen

In the footsteps of the Mycenean tekton. Reconstructing the facade of the Treasury of Atreus

Classical Greek

Νέστορός εἰμι εὔποτον ποτήριον· ὃς δ’ ἂν τοῦδε πίῃσι ποτηρίου, αὐτίκα κεῖνον ἵμερος αἱρήσει καλλιστεφάνου Ἀφροδίτης.

“I am Nestor’s cup, good to drink from. Whoever drinks from this cup, desire for fair-crowned Aphrodite will seize him at once.”

The inscription on the “Cup of Nestor”, a drinking cup found at Pithekoussai (Ischia), 8th century BC. The text is normalised; readings of the damaged letters vary.

Type scale

Try your own text in every step

Greek capitals

Stored text	Capitals with lang="el"	Capitals without it
Εκδηλώσεις	ΕκδηλώσειςCorrect: tonos dropped	ΕκδηλώσειςWrong: accent kept
Ολλανδικό Ινστιτούτο Αθηνών	Ολλανδικό Ινστιτούτο ΑθηνώνCorrect	Ολλανδικό Ινστιτούτο ΑθηνώνWrong
29 Μαΐου	29 ΜαΐουCorrect: dialytika kept	29 ΜαΐουWrong: accent stacked
Αθήνα ή Χαλκίδα	Αθήνα ή ΧαλκίδαCorrect: standalone Ή keeps its accent	Αθήνα ή ΧαλκίδαWrong

Dates, times and numbers

Based on browser locale data (en-GB, nl-NL, el-GR, time zone Europe/Athens), with these house-style overrides: Greek uses the 24-hour clock (hourCycle “h23”); English drops the comma after the weekday and closes up the range dash; Dutch writes times as 18.00 uur (to confirm with a native speaker). Greek month headings use the nominative, dates the genitive.

Format	English	Dutch	Greek
Long date	Thursday 29 October 2026	donderdag 29 oktober 2026	Πέμπτη 29 Οκτωβρίου 2026
Short date	29 Oct 2026	29 okt 2026	29 Οκτ 2026
Month heading	October 2026	oktober 2026	Οκτώβριος 2026
Range	12–14 November 2026	12–14 november 2026	12–14 Νοεμβρίου 2026
Deadline	1 February 2027 at 23:59	1 februari 2027 om 23.59 uur	1 Φεβρουαρίου 2027 στις 23:59
Money	€700 · €1,234.50	€ 700 · € 1.234,50	700 € · 1.234,50 €
Ordinal	20th lecture	20e lezing	20η διάλεξη
Journal	Pharos XXIII.2 (2017) · Pharos XXIV (2018–2020)

16:00–19:30
18:00–20:00
11:10–13:30
09:00–17:00

In use

A few pieces of the site in the selected colours and type, to judge the tokens at work. These are not page designs; those come in the next round. The language switch here changes the samples too.

The five palettes side by side

The same header, event, open call, panel and footer in every palette, at small size, so you can see what each one changes: B’s marble page, stone panels and bronze link underline; C’s navy field with one sand counter-field; D’s white header, sky bands and noon shadow. Type and language follow your choice.

Buttons

Text link

Event teaser, with a long real title

In the footsteps of the Mycenean tekton. Reconstructing the facade of the Treasury of Atreus

Open call with deadline badge and audience label

Machine-translated note, next to an info panel

Header with language switch and menu, and the footer, as the selected palette lays them out

·

Focus ring, shown as if focused (press Tab anywhere to see the real one)

A focused link

Lockups

The lion stays exactly as drawn. On white and on navy it sits on its sand tile; on sand the ground is the tile. On white and on navy it can also drop the tile: on white it is navy and white only, and on navy the mark turns sand and the lion’s head becomes the navy ground. The name follows the selected type. “NIA” never stands alone next to the mark, because the Norwegian Institute at Athens is also NIA.

Small sizes

The mark alone as favicon and avatar, with or without its tile. Below 32 px the eye and mouth merge, but the crescent and head still read.

With the sand tile

Without the tile

Cleaner, but it needs a second colour: in a dark browser tab the navy lion almost disappears (1.12:1), so the favicon file switches to the sand lion there, as in the navy lockup without the tile. The tile works on both without a switch.

Tokens

The selected combination as CSS custom properties, ready for the Drupal theme. Role names stay the same whatever palette is chosen, so templates do not change.