Medium

Medium's design evokes the feeling of a refined, minimalist literary journal, emphasizing content over chrome. The dominant use of a warm off-white background (#f7f4ed) creates a soft, inviting canvas for the high-contrast text. Typography is the cornerstone, with a stately serif font for headlines paired with a clean sans-serif for body text, creating a classic yet accessible reading experience. Accent colors are deliberately minimal, primarily using deep black for interactive elements to draw clear focus and a vibrant green for specific illustrative brand moments. Do use Vellum Background (#f7f4ed) as the primary page background to maintain the soft, inviting tone. Do apply gt-super for headlines at weight 400 with 'lnum' and 'pnum' font features enabled for distinct editorial typography. Do use Charcoal Black (#191919) for primary interactive elements like buttons and primary text, and Inkwell Black (#242424) for standard body text. Do use a generous horizontal padding of 16px or 20px for buttons to emphasize their pill shape. Do rely on a minimal set of neutral colors for UI elements, reserving Story Green (#50B33A) exclusively for brand illustrations and impactful visuals. Do maintain element gaps of 16px between most inline UI elements to ensure comfortable density. Don't use strong, saturated colors for backgrounds or text, which would disrupt the subtle and content-focused aesthetic. Don't add shadows or heavy borders to UI components; design should feel flat and integrated with the canvas. Don't deviate from the established pill shapes for buttons; all interactive buttons should have extremely high border radii. Don't introduce additional serif fonts; the contrast between gt-super and sohne (or medium-content-sans-serif-font) is a core part of the identity. Don't animate UI elements with excessive complexity or duration beyond the 'ease' timing and 0.3s duration for subtle transitions. Don't use dense layouts; ensure comfortable spacing with a base unit of 8px and larger gaps for sections.