Biocoda: a site for a contract laboratory

Biocoda runs assays to order: a sample arrives, a report leaves. There is nothing to show — no interface, no packaging, and photographs of test tubes look the same in every laboratory on earth.

So the build rests on schemes and comparisons. `StatementHero` opens the page with a claim instead of an image. `SchemeOverview` draws the path of a sample through the lab, `FlowPanel` what happens to the data once the instrument is done. `RangeChart` shows the spread of values: for a laboratory that is the product — not the average, but how narrow the corridor is.

One comparison instead of ten arguments

In the middle sits `BeforeAfterSplitSlider`, a curtain between two states of the same image. For a lab it is the most substantial section on the page: it shows the difference the client is buying without a single adjective.

Then `ProgramCards` with the formats of work and `TeamGrid` with the people. In a service with no product, the people are the product, which is why the team comes before the prices rather than after.

What this build demonstrates

An acid lime primary on a very light blue, with near-black ink. The pair is loud on purpose: laboratory sites are usually blue and identical, and standing out in an inbox matters more than being calm.

The display face is a serif — an unusual choice for this niche — and the body face a grotesque. Changing one line of config changes both, and the headings in all thirteen sections follow.