Brand

Note: This page is currently under construction.




Identity

The mark is designed to reflect both the precision and softness of our design language.

Usage guidelines

When displaying the logo as a logo, use the full viewBox of 0 0 282 127 which contains some reserved space. When using the logo inline as text, use the #tight variant.

Type

Avenir carries the interface: geometric at a glance, human in the details, and comfortable at both display and utility sizes.

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 @&!?

Color

A near-black indigo, soft paper gray, and electric mint give the system its light and focus.

Ink#080A3C
Paper#EFEFEF
Signal#3CE8B4

Controls

These are the live root controls, shown here without a parallel reinterpretation.

Superellipse corners

Squircle-like controls use the CSS superellipse curvature 1.8. When native corner-shape is unavailable, the shared rounded-corner library draws the same curve as a curvature-continuous cubic spline.

Construction of the standard superellipse corner A rounded rectangular control with its upper-right corner enlarged by guides. Seven points sampled from the analytic superellipse are joined by six curvature-continuous cubic Bézier segments. superellipse(1.8) n = 2¹·⁸ ≈ 3.4822 r r 7 points · 6 cubic segments
Exponentn=21.8≈3.4822n = 2^{1.8} \approx 3.4822
Parametric formx(θ)=cx+r sgn⁡(cos⁡θ)∣cos⁡θ∣2/ny(θ)=cy+r sgn⁡(sin⁡θ)∣sin⁡θ∣2/n\begin{aligned} x(\theta) &= c_x + r\,\operatorname{sgn}(\cos\theta)\lvert\cos\theta\rvert^{2/n} \\ y(\theta) &= c_y + r\,\operatorname{sgn}(\sin\theta)\lvert\sin\theta\rvert^{2/n} \end{aligned}
Implicit curve∣x−cxr∣n+∣y−cyr∣n=1\left\lvert\frac{x-c_x}{r}\right\rvert^n + \left\lvert\frac{y-c_y}{r}\right\rvert^n = 1
The dots are the seven analytic samples used for each 90° corner. Axis-aligned end conditions bring curvature to zero where the corner meets each straight edge.

From curve to canvas

  1. Sample the analytic corner every 15 degrees.
  2. Use centripetal intervals hi=∥Pi+1−Pi∥h_i = \sqrt{\lVert P_{i+1} - P_i \rVert}.
  3. Solve a linear system for the spline derivatives, enforcing curvature-continuous interior joins and horizontal or vertical endpoint tangents.
  4. Convert each interval into cubic Bézier handles:
    C1=Pi+hiDi3C_1 = P_i + \frac{h_iD_i}{3}C2=Pi+1−hiDi+13C_2 = P_{i+1} - \frac{h_iD_{i+1}}{3}
  5. Use r=min⁡ ⁣(w2,h2)r = \min\!\left(\frac{w}{2},\frac{h}{2}\right), joining the four spline corners with straight edges.

A final sanity check prevents Bézier handles longer than 43\frac{4}{3} of their chord; if it fails, the endpoint handles are clamped.

Forms

Write a long description.

Windows

In-app windows use familiar desktop structure, the shared controls, and a quiet stamped layer.

Dialogs

A dialog arrives as a new layer in the same room, with focus and dismissal kept predictable.

A calm, capable dialog

The page stays present while the decision gets exactly the room it needs.

Print

Print preview is a small application around a paper world with its own scale.

Brand reference

Brand reference
2026