design.vecreal.com / Workshop / V overshoot
Brand atom workshop · V optical overshoot
Operator-spotted: the V's tip mathematically sits on the baseline (same as the rev-3 dot did, before we fixed it in rev-4). The visible mass of a V is concentrated at the top, so the tip touching the baseline reads as floating. Apply the same em-based translateY pattern we used for the dot, and pick a magnitude.
Why the V floats
The V SVG path is M10 14 L31 50 Q32 52 33 50 L54 14 L42 14 L32 32 L22 14 Z.
ViewBox 10 14 44 38. The quadratic apex hits y=52 — exactly the viewBox
bottom. With preserveAspectRatio="xMidYMax meet" + vertical-align: baseline,
the SVG element's bottom edge sits on the line baseline, putting the V's geometric
tip on the baseline.
But the V's visible mass is concentrated at the top. A flat-bottomed letter like "e" has horizontal mass at the baseline; the V has a single point. Visually the V reads as floating above where "ecreal" is grounded.
The fix is the same pattern we used for the dot in rev-4: transform:
translateY(N×em) on the .bk-v element. Em-based so the descent scales
proportionally with font-size. The V tip ends up sitting slightly below the
baseline (visible in the comparison via the clay baseline ruler in each specimen
stage), and the visual mass of the V is properly grounded with "ecreal".
Pointed shapes may want more overshoot than round shapes. The dot (round) got 0.025em. The V (pointed) may want the same, or more. Variants below range from 0.015em (less) to 0.060em (more).
| VARIANT | V translate-Y | vs DOT (0.025em) | SM 22 / LG 48 / HERO 96 px shift |
|---|---|---|---|
| Current · rev-4 | none | — | — |
| V1 · 0.015em | 0.015em | less than dot | 0.33 / 0.72 / 1.44 px |
| V2 · 0.025em | 0.025em | = dot exactly | 0.55 / 1.20 / 2.40 px |
| V2a · 0.0325em | 0.0325em | midpoint V2-V3 | 0.72 / 1.56 / 3.12 px |
| V2b · 0.033em | 0.033em | ≈ V2a (sub-pixel diff) | 0.73 / 1.58 / 3.17 px |
| V3 · 0.040em | 0.040em | more than dot | 0.88 / 1.92 / 3.84 px |
| V4 · 0.060em | 0.060em | much more than dot | 1.32 / 2.88 / 5.76 px |
--bk-v-translate-y on .bk-wordmark .bk-v.
Same propagation pattern as rev-4 dot tune — touches reference HTMLs, design-tokens.json,
wordmark.md spec, CHANGELOG, brand-atoms/index.html, vecreal.com landing, OG preview,
wordmark.svg (V transform updated for the descent), plus the LinkedIn logo PNG.