Mintlify

Mintlify, minimal, documentation

Preview image. Unlock full-res

Digital librarian's desk. Precise information architecture meets subtle brand identity through selective color accents.

Palette
#000000
#ffffff
#08090a
#f2f2f2
#dddddd
#0c8c5
#00dc8d
#0052ff

Mintlify captures an atmosphere of serene, intelligent efficiency, like navigating a well-organized digital library. The predominant use of highly desaturated grays and stark black-on-white provides a clean, information-focused base. A single vivid green (#0c8c5e) acts as a digital beacon, highlighting interactive elements and key information without visual clutter. The visual restraint in color and a subtle elevation system communicate authority through clarity, making complex documentation feel approachable. Prioritize Inter font at all sizes and weights; use negative letter spacing on display sizes (57px: -1.14px, 40px: -0.4px) for a refined look and positive spacing (13px: 0.65px) for captions to ensure legibility. Use Sage Mark (#0c8c5e) exclusively for primary interactive elements, active states, and essential brand indicators to maintain its visual impact and clarity. Apply White Canvas (#ffffff) strictly as the default page background and for card surfaces, allowing content to breathe and accent colors to pop. Form inputs should be minimal, using a borderRadius of 0px and a transparent background (rgba(0,0,0,0)), allowing the surrounding design to define their presence. Employ the lab(2.42579 -0.165291 -0.470081 / 0.03) 0px 2px 4px 0px shadow for subtle content elevation against dark backgrounds and lab(100 0 0 / 0.05) 0px 2px 4px 0px for light backgrounds. Maintain a consistent elementGap of 4px, 6px, 8px, 10px, or 12px between adjacent UI elements to ensure a harmonious and comfortable density. Round all buttons, and other interactive pill-shaped elements to 1.67772e+07px for a modern, distinct soft edge that contrasts with the sharper 4px and 16px radii found elsewhere. Do not introduce new typefaces; rely solely on Inter to preserve the visual identity. Avoid using highly saturated colors other than Sage Mark (#0c8c5e) or Emerald Glow (#00dc8d) for primary UI elements; reserve others for illustrative accents only. Do not deviate from the specified borderRadius values (1.67772e+07px for pills, 0px for inputs, 4px for tags, 16px for cards) to maintain shape consistency. Do not use dark backgrounds where White Canvas (#ffffff) is expected, as this would break the light theme consistency and intended contrast ratios. Do not use letter-spacing: normal. Always apply precise letter-spacing according to the type scale to maintain typographic rhythm. Avoid excessive decoration or complex gradients on UI elements; the design emphasizes clarity and directness. Do not add additional shadows beyond the specified lab(2.42579 -0.165291 -0.470081 / 0.03) 0px 2px 4px 0px or lab(100 0 0 / 0.05) 0px 2px 4px 0px to maintain a light and intentional elevation profile.

More like this