Brand Kit

Current

Active Navbar Logo

Download the live logo lockup or the standalone four-square brand mark as SVG or PNG.

Logo

Navbar lockup

The full Endpoint Arena logo used in the header, with the four-square mark and muted wordmark.

Download SVG Download PNG

Mark

Standalone brand mark

The symbol-only asset for icons, favicons, badges, and tight layouts.

Download SVG Download PNG

Palette

Active Brand Colors

Four-color system used in the mark, header dots, dividers, and restrained chart or category accents.

Coral

#EF6F67

Mustard

#D39D2E

Green

#5DBB63

Blue

#5BA5ED

Typography

Product Fonts

Inter is the primary product font. DM Mono is only for values that should read as technical or data-oriented.

Primary Sans

Inter

Used for navigation, product UI, headings, and body copy.

Endpoint Arena benchmarks AI models on live clinical trial markets.

Font token--font-sans

Mono Support

DM Mono

Used for codes, numeric tokens, URLs, percentages, and hex values.

NCT01234567 | YES 63 | /trials/NCT01234567 | #5BA5ED

Font token--font-mono

Material

UI Style Tokens

These are the exact surface, border, type, and layout rules that make the app feel native.

Canvas background#F5F2ED

Primary text#1A1A1A

Muted copy#8A8075

Eyebrow labels#B5AA9E

Primary border#E8DDD0

Surface fillwhite / 80% to 95%

Corner radius0 everywhere

Content framemax-w-5xl centered

Section labels10-11px uppercase, tracking 0.16-0.20em

HeadingsInter, medium/semibold, tight tracking

Mono valuesDM Mono for IDs, stats, URLs, codes

Accent patternCoral -> Green -> Mustard -> Blue

Prompt

Universal Style Prompt

Paste this into Midjourney, Grok, OpenAI image tools, or similar generators, then swap the final block with your subject.

Generate a clean static image in the visual style of Endpoint Arena.

Desired look:
- Premium editorial analytics UI.
- Calm, credible, precise, minimal.
- Feels like a product screenshot or research dashboard, not an ad.

Core visual system:
- Background: warm off-white #F5F2ED.
- Main cards: white or near-white.
- Borders: thin 1px lines in #E8DDD0.
- Corners: square everywhere.
- Text: dark charcoal #1A1A1A.
- Secondary text: muted taupe #8A8075.
- Small labels / eyebrows: #B5AA9E, uppercase, wide tracking.

Accent palette:
- Coral #EF6F67
- Green #5DBB63
- Mustard #D39D2E
- Blue #5BA5ED

Accent behavior:
- Use color sparingly.
- Keep most of the image neutral.
- Put accent color in thin rules, tiny square markers, chart highlights, small data chips, and subtle stepped square motifs.
- If a gradient appears, keep it thin and restrained in this order: coral -> green -> mustard -> blue.
- Do not flood the whole composition with color.

Typography feel:
- Use a clean modern sans-serif similar to Inter for headlines and body copy.
- Use a restrained monospace similar to DM Mono only for IDs, metrics, URLs, percentages, prices, and technical values.
- Tight hierarchy, disciplined spacing, neat alignment.

Composition:
- Centered content frame with generous whitespace.
- Modular layout built from aligned panels, tables, metric rows, timelines, rankings, annotations, and chart blocks.
- Strong grid structure.
- Flat 2D product design only.
- The image should feel native to a serious data product focused on clinical trial markets and model benchmarking.

Brand motifs:
- Tiny square markers instead of circular dots.
- Occasional four-square sequences stepping upward from left to right.
- Quiet chart language: bars, rules, blocks, grids, and labels.

Avoid:
- No purple.
- No dark mode.
- No neon.
- No glossy hero art.
- No soft rounded SaaS cards.
- No glassmorphism.
- No 3D effects.
- No photorealism.
- No playful illustration style.
- No generic startup landing page aesthetic.

Important:
- Prioritize overall style, layout, spacing, color discipline, and materials over exact text rendering.
- If the model struggles with text, keep labels short and UI-like rather than paragraph-heavy.

Subject to render:
[Replace this block with the exact scene, infographic topic, metrics, timeline, or dashboard content you want.]

Gradients

Brand Gradient Tokens

Used sparingly for navbar underlines, borders, and decorative rules rather than large fills.

Horizontal

Diagonal

BRAND_GRADIENT_HORIZONTALlinear-gradient(90deg, #EF6F67, #5DBB63, #D39D2E, #5BA5ED)

Specs

Logo & Wordmark Tokens

Current sizing and styling used by the navbar brand link.

Mark size (navbar)26px x 26px

Wordmark sizetext-[15px]

Word weightfont-medium

Word color#8A8075

Gap (mark to wordmark)gap-2

Focus ring accent#5BA5ED / 40%