Krisp. A confident editorial-tech feel.
- AI
- Light theme
- 16 colors
- 1 typeface
Krisp uses a warm-cream-and-violet language built on a single geometric humanist sans (Plus Jakarta Sans). The canvas is a soft warm beige rather than sterile white, giving the entire surface a paper-like, approachable quality. Deep indigo violet (#131032) doubles as both the primary text color and a dramatic dark section background — the same hue reading as authoritative copy on light surfaces and as immersive night-mode on dark. Vivid violet (#614efa) is the lone saturated accent, used sparingly on filled buttons and link emphasis, while a violet-to-cyan gradient sweeps through hero display text to make 'Voice AI' feel like it is lit from within. The system stays calm: soft cards, pill-shaped tabs, thin hairlines, no heavy shadows, and color restricted to small functional moments rather than broad washes.
Krisp design system
Brand2
Primary text, headings, and dark section backgrounds — the deepest near-black with a violet undertone carries the same identity across both light copy and immersive dark bands
Filled buttons, link emphasis, active states, gradient stops — the only vivid saturated color in the palette, used as a small functional spark against the cream canvas
Accent4
Soft accent washes, tag backgrounds, decorative highlights — a near-white violet tint that echoes Iris Spark at very low intensity
Supporting palette color for small decorative accents when the core palette needs contrast.
Pill badge and announcement tag backgrounds — a barely-there cool tint to differentiate informational chips from the warm cream canvas
Soft highlight overlays and secondary gradient midtones — a lighter violet used in multi-stop gradients
Neutrals10
Supporting neutral for secondary UI, dividers, and muted labels. Do not promote it to the primary CTA color
Secondary dark text, very dark UI elements
Stronger secondary text, metadata — deeper than Fog for labels that need more presence without reaching Midnight Iris
Muted body copy, helper text, secondary labels — the primary low-emphasis text color against cream and white surfaces
Disabled text, placeholder content, very low-emphasis UI elements
Shadows, very subtle borders, disabled surface tones
Borders, dividers, card outlines — a cool light gray that separates surfaces on the warm cream canvas
Dominant page canvas — a warm beige that replaces the typical cold white SaaS background, giving the entire site a tactile, editorial feel
Secondary surface, footer background — a cool off-white that sits one step below Snow
Card surfaces, button text, dark-section text — pure white for maximum contrast on dark backgrounds
Try a pairing
Pick any two colors from the palette to check whether text stays readable on top.
Aa
Snow on Midnight Iris
18.29 : 1 contrast
- Body textPasses AA 4.5
- Large textPasses AA 3
- StrictPasses AAA 7
