The Eval Labs logo should be used simply and consistently: small, sharp, quiet, and paired with clear body copy.
Primary logo asset
Current primary asset:
assets/binary-eval-logo.png
Use this asset for the docs homepage identity block and any Canon references to the Eval Labs mark.
Homepage Logo/Text Table
This is the working Markdown pattern for the homepage logo/text unit:
| | |
|---|---|
| <br><em>Eval Labs Logo.</em> | Eval Labs serves as the definitive proprietary AI audit-layer, engineered to govern and validate the hyper-complex outputs of Lucia’s cognitive core. |
Do not add image sizing inside the Markdown embed.
Correct:

Avoid inside tables:

The normal pipe character can interfere with Markdown table parsing.
What the homepage block should look like
purple rail on the left
small logo on the left
caption under logo
body text on the right
table borders invisible
mobile content safely inset from the rail
Logo/Text Table tuning knobs
These live near the bottom of publish.css in the block labeled:
Eval Labs — Logo/Text Table Tuning Knobs
Logo size
--eval-logo-row-logo-width: 120px;
Controls the visible logo size.
Increase for a larger logo.
Decrease for a smaller logo.
Left column width
--eval-logo-row-left-column: 190px;
Controls the full space reserved for the logo/caption column.
Increase if the logo area feels cramped.
Decrease if the right-side text feels too far away.
Distance from purple rail
--eval-logo-row-left-padding: 2rem;
Controls how far the logo sits away from the purple vertical rail.
Increase if the logo feels too close to the rail.
Decrease if the block feels too indented.
Gap between logo and text
--eval-logo-row-gap: 2rem;
Controls the horizontal gap between the left logo/caption and right-side text.
Increase if the text feels crowded.
Decrease if the text feels disconnected.
Text vertical alignment
--eval-logo-row-copy-top: 16px;
This is the main alignment knob.
Increase to move the right-side text down.
Decrease to move the right-side text up.
Most fine-tuning should happen here.
Logo-to-caption spacing
--eval-logo-row-caption-gap: 0.75rem;
Controls the space between the logo and the italic caption.
Right-side text size
--eval-logo-row-copy-size: 16px;
Controls the right-side body copy size.
Keep this near normal body text size.
Right-side line height
--eval-logo-row-copy-line-height: 1.62;
Controls the line spacing of the right-side text.
Increase for airier reading.
Decrease for tighter text.
Mobile tuning knob
This lives in the block labeled:
Eval Labs — Mobile Logo/Text Table Rail Safety
--eval-logo-row-mobile-inset: 34px;
Controls how far stacked mobile content sits away from the purple rail.
Increase if mobile text gets too close to the rail.
Decrease only if the mobile block feels too indented.
- Use the logo small
- Keep the background transparent
- Pair it with clear body copy
- Preserve the purple rail treatment on the homepage block
- Keep captions short and factual
Do not
- Stretch the logo
- Add heavy borders around the logo
- Put the logo inside a card unless intentionally designing a new component
- Use the mark as decoration between unrelated sections
- Oversize the logo into a hero graphic unless a new design is explicitly approved