CURATED · OPEN · FREE

Earlydog

Playful, geometric SaaS branding that humanizes cloud infrastructure through bold typography and abstract shapes.

SaaSDeveloper ToolsBold TypographyGeometricPlayful

↓ Download design system (2 MB)Open in OpenDesign

Visit: https://www.earlydog.com

📦 Browse pack contents →

Identity DNA

Cloud OpsInfrastructureDeveloperModern

A digital Bauhaus studio for cloud operations

Color

#0A65DBAccent

#000609Ink

#FFF9F0BG

#BFB1A3Muted

rgba(0, 6, 9, 0.1)Line

High-contrast geometric palette using a warm cream base with primary pops

Typography

geometric-sans · humanist-sans · monospace

display116px · 700
display-md80px · 700
body18px · 400

Spacing

4px

8px

16px

24px

32px

48px

64px

96px

Generous vertical spacing with 120px-128px section padding

Surfaces

sm · 4px

md · 8px

lg · 12px

pill · 9999px

1px solid rgba(0, 6, 9, 0.1) on buttons, 3px solid on active states

Layout

1280container

12columns

32pxgutter

768 / 1024breakpoints

Full-bleed hero with asymmetric text/graphic split

Motion & Interaction

220msmicro

400mssmall

800msmedium

cubic-bezier(0.25, 0.1, 0.25, 1)easing

transition: all applied globally

Subtle state change on interactive elements · Immediate response

Components

button Pill-shaped outline buttons with thick black border and bold text
card N/A - Layout uses graphic compositions instead of traditional cards
chip N/A
input N/A
hero Large split layout with bold 2-line headline and geometric graphic composition

Voice & Don'ts

Tone Professional yet approachable
Headlines Bold, direct, benefit-focused
CTAs Simple pill buttons with clear action verbs

Don't use a dark background — screenshot shows a warm cream (#FFF9F0) base
Don't use serif typography — screenshot shows geometric and humanist sans-serif fonts only
Don't use rounded cards with drop shadows — screenshot shows flat geometric compositions with no shadows
Don't use muted, desaturated colors — screenshot shows high-chroma primary accents (blue, orange, yellow)
Don't use gradient backgrounds — screenshot shows solid flat colors and geometric shapes
Don't use thin, light typography — screenshot shows bold 700-weight headlines with tight letter spacing
Don't use standard rectangular buttons — screenshot shows pill-shaped buttons with thick black borders
Avoid: Jargon-heavy language
Avoid: Dark mode aesthetics
Avoid: Photorealistic imagery

Inside the pack — real screenshots

Earlydog — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Captured from the live site · real computed styles

System prompt

EarlyDog is a cloud infrastructure SaaS company using a Bauhaus-inspired visual system. The palette centers on warm cream (#FFF9F0) with high-contrast black (#000609) text and vibrant geometric accents in blue (#0A65DB), orange-red (#EF4C2C), and yellow (#FFD100). Typography uses geometric sans-serif for display and humanist sans-serif for body, with extremely bold headlines (700 weight) and generous line heights. Critical don'ts: never use dark backgrounds, never use serif fonts, never add drop shadows to elements, never use gradient fills, and never use thin typography weights. The layout favors asymmetric splits with large graphic compositions rather than traditional card-based designs.

Bring this taste to your agent

Hand your AI agent a machine-readable spec of this design — tokens, type, motion, the whole DNA.

OpenDesign skill ↗ · This pack for agents ↗

en · zh-CN · zh-TW · ja · ko