Brand Kit

The MACHINES monogram is a brutalist representation of machine intelligence — bold, confident, and engineered without compromise. The borderless form is the default. The shape itself is the identity; it needs no container, no frame, no boundary to assert its presence.

The container variant exists for contexts that demand a defined boundary — app icons, social avatars, platform constraints that require a bounding shape. The outer radius (105px) is exactly 2.5 times the inner mark radius, creating a proportional relationship between frame and form. Use it only when the borderless mark cannot stand alone.

The angular alternate replaces the standard mark's rounded corners with 45° chamfers, sharpening the silhouette while preserving identical internal geometry. Use it where the brand needs an edgier, more aggressive posture — limited-edition materials, partnerships, or contexts where the rounded mark reads too soft. It is an alternate, not a replacement; the borderless mark with rounded corners remains the default.

At 32 pixels and below, the standard mark loses its defining details. The legibility variant compensates: corners enlarge by 94%, nodes by 76%, and grooves narrow by 34% relative to the standard proportions. These adjustments preserve the mark's identity at scales where the original geometry would collapse into noise.

The mark appears at 0° or 45° — nothing else. At 45°, the square field becomes a diamond, referencing the card form and aligning with the primitive shape's tessellation angle. This is the mark's one permitted act of rotation: a deliberate tilt, not a casual spin. All other angles are prohibited.

The borderless mark occupies a square field (1487.83 × 1487.83) with a corner radius of 42.02px (2.82% of the field width) and node radius of 53.27px. These proportions are fixed. The container variant adds 96px of padding between mark and boundary edge. Do not alter these relationships.

The MACHINES logotype is built on a 10px unit grid. Every stroke, counter, radius, and letterform height is a whole multiple of that unit — nothing is approximated, nothing is rounded. The construction grid below is the proof. Stems double counters, radii double again. The h ascender breaks above cap height by exactly 3 units — the one deliberate exception to an otherwise rigid system.

The wordmark on its original construction grid. Every letterform aligns to a 10-pixel unit grid. Strokes, counters, and spacing are not approximated — they are plotted. The grid is the proof that nothing in this system is arbitrary.

The h ascender shifts the wordmark's mathematical center upward, away from its optical center. When vertically centering the wordmark, align to the body of the letterforms — the cap-height bounding box — not the total height including the ascender. The white line marks the true optical center.

The wordmark requires a minimum display width of 240 pixels. Below this, the stroke system loses its legibility and the modular relationships break down. When space cannot accommodate 240px, use the monogram alone.

The monogram and wordmark combine in four configurations. Each serves a specific context — choose the one that fits the space, not the one you prefer. The monogram carries equal authority to the logotype; neither is subordinate. When both cannot coexist comfortably, one will do. All lockups use the legibility variant of the monogram — at lockup scale, the standard mark's fine details would be lost.

Mark in Color

Orange is the default mark color. Any palette color is permitted in supporting contexts, but orange should dominate.

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 !@#$%^&*()

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 !@#$%^&*()

Screen titles and feature headers

Section headers and modal titles

Body copy and primary content. This is your default reading size for paragraphs, descriptions, and any longer-form text within the application.

Secondary information, captions, and helper text

Timestamps, metadata, badges, and fine print

Buttons, navigation items, and form labels

Hero headlines

Section headlines

Feature callouts

Subheadings and card titles