Durante Brand

Brand assets and guidelines for Durante

Logo

Mark only — favicon and app icon
Mark + wordmark — hero sections and docs
Wordmark alone — most other contexts

Colors

Primary Palette

Brand Blue

#3B82F6

Primary — CTAs, links, interactive elements, brand mark

Deep Navy

#0C0F1A

Background — default dark surface

Dark Card

#111827

Surface — cards, elevated containers

Subtle

#1F2937

Border — dividers, subtle separators

Slate

#94A3B8

Muted text — secondary copy, captions

Semantic Palette

Scoped to specific UI contexts. Never used in logo, marketing headers, or printed materials.

Purple

#8B5CF6

Skills — skill-related UI elements only

Green

#10B981

Agents — agent-related UI elements only

Amber

#F59E0B

Tests / Memory — test and memory UI only

Pink

#EC4899

Themes — theme-related UI elements only

Red

#EF4444

Destructive — error, gate failure, delete

Typography

Plus Jakarta Sans

Display & Headings

Geometric sans-serif. 700-800 for hero, 600 for H2/H3.

Aa Bb Cc

Space Grotesk

Body & UI

Geometric sans-serif. 400 body, 500 UI/nav/buttons.

Aa Bb Cc

Geist Mono

Code & Technical

Code blocks, terminal output, pipeline logs, gate results.

const x = 42

Token Architecture

Option Tokens (private)

Raw palette values (--palette-blue-500, --palette-neutral-50). Never consumed directly by components.

Decision Tokens (public)

Semantic references (--primary, --background, --success). Dark/light mode swap happens here. Components consume these.

Component Tokens (scoped)

Bind decision tokens to specific UI elements (--button-primary-bg, --card-bg). Optional layer for design system maturity.

Motion

Fast100ms

Normal200ms

Slow300ms

The Remove-It Test

Every animation must pass: "If I remove this animation, do I lose information or clarity?" If the answer is no, the animation is decorative and should be questioned.

Default easing: ease-out (CSS) or spring with low bounce
State changes are the only reason to animate
Respect prefers-reduced-motion unconditionally
No ambient looping animations in production UI

Downloads

Full brand assets and the design token system are available in the GitHub repository.

View on GitHub →