Apidog

A bright, developer-tools marketing surface built on white-to-pale-blue gradient canvas with an electric indigo-blue primary CTA (#4d6aff), rounded Poppins display headlines, and product UI screenshots presented inside soft-shadowed cards. The system reads as friendly, modern API-tooling SaaS — generous radii, near-white #fafbff surfaces, a multi-hue accent palette borrowed from API status/method colors, and large embedded app mockups that show the real product chrome rather than illustrations.

apidog.com

Works with Claude Code·Cursor·Codex·Gemini CLI·Copilot·v0·Lovable·Bolt·Windsurf·Replit

↓ .md ↓ All files

loading…

Color Palette

Accent

Neutrals

Typography

display-xl 64px · 600 · 1.5

The quick brown fox jumps

display-lg 48px · 600 · 1.0

The quick brown fox jumps

display-md 44px · 700 · 1.25

The quick brown fox jumps

body 14px · 500 · 1.4

The quick brown fox jumps

button 16px · 400 · 1.5

The quick brown fox jumps

Spacing & Shape

Spacing

Name	Value	Preview
xxs	4px
xs	8px
sm	12px
md	16px
lg	24px
xl	32px
xxl	40px
xxxl	48px
huge	64px
giant	80px

Border Radius

Name	Value	Preview
xs	6px
sm	8px
md	10px
lg	12px
card	14px
xl	16px
xxl	20px
xxxl	24px
huge	32px
pill	9999px

FAQ

What colors does Apidog use?: Apidog's core palette includes #4d6aff, #1a66ff, #2563eb, #6366f1, #31a6ff. The full color set with usage roles (canvas, ink, surfaces, accent, semantic) is documented in the Apidog DESIGN.md.
What font does Apidog use?: Apidog's primary typeface is Poppins. The complete type scale (sizes, weights, line-height and letter-spacing per role), with an open substitute where the original is licensed, is documented in the DESIGN.md.
What is the Apidog design system?: A bright, developer-tools marketing surface built on white-to-pale-blue gradient canvas with an electric indigo-blue primary CTA (#4d6aff), rounded Poppins display headlines, and product UI screensho…

More like this

↓ .md ↓ All files

loading…