Baselime
A developer-tooling, dark-canvas observability marketing site built on pure black with an electric lime accent and Poppins throughout. The system reads as confident, technical SaaS — near-black canvas, a single high-voltage lime CTA color, dark-green-tinted product cards, and large Poppins display headlines that split a white phrase from a lime phrase. Brand voltage comes almost entirely from the lime accent against black plus real product UI screenshots shown in dark cards.
Works with
Claude Code·Cursor·Codex·Gemini CLI·Copilot·v0·Lovable·Bolt·Windsurf·Replit
Color Palette
Accent
Neutrals
Typography
display
60px · 500 · 1.2
The quick brown fox jumps
lead
18px · 400 · 1.556
The quick brown fox jumps
title
20px · 500 · 1.5
The quick brown fox jumps
body
20px · 400 · 1.5
The quick brown fox jumps
button
14px · 500 · 1.429
The quick brown fox jumps
Spacing & Shape
Spacing
| Name | Value | Preview |
|---|---|---|
| xxs | 4px | |
| xs | 8px | |
| sm | 12px | |
| md | 16px | |
| lg | 24px | |
| xl | 32px | |
| xxl | 48px | |
| xxxl | 64px | |
| section | 96px | |
| section-lg | 128px |
Border Radius
| Name | Value | Preview |
|---|---|---|
| xs | 4px | |
| sm | 6px | |
| md | 8px | |
| lg | 12px | |
| xl | 24px | |
| full | 9999px |
FAQ
- What colors does Baselime use?
- Baselime's core palette includes #000000, #ffffff, #fcfcfc, #a7a9b1, #777a7e. The full color set with usage roles (canvas, ink, surfaces, accent, semantic) is documented in the Baselime DESIGN.md.
- What font does Baselime use?
- Baselime'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 Baselime design system?
- A developer-tooling, dark-canvas observability marketing site built on pure black with an electric lime accent and Poppins throughout. The system reads as confident, technical SaaS — near-black canva…