Letterboxd

Letterboxd employs a film-noir inspired aesthetic, using a deep, nearly monochromatic dark mode to provide a cinematic backdrop for film content. The visual hierarchy is built on subtle color shifts and varied text weights rather than strong contrast. A single vivid green accent is reserved for interactive elements, creating clear focal points against the muted palette, reminiscent of a discreetly lit movie theater screen where only key information is highlighted. Use Midnight Ink (#14181c) for main page backgrounds to maintain a dark, immersive theme. Prioritize GraphikWeb for all UI text and body copy using weights 300, 400, or 700 with precise letter-spacing adjustments. Reserve TiemposHeadlineWeb 700 at 36px for dominant page titles to establish a classic, editorial feel. Apply Electric Green (#00ac1c) exclusively to primary call-to-action buttons to ensure maximum emphasis and clarity for interactions. Maintain a tight corner radius of 3px for most interactive elements, reserving 12-15px for distinct pill shapes on inputs and filter tags. Structure content with minimal card padding (0px) and transparent backgrounds, allowing image content to define visual blocks. Utilize a shallow drop shadow rgba(0,0,0,0.25) 0px 1px 5px 0px, rgba(0,0,0,0.35) 0px 1px 10px 0px for elevated panels/modals, differentiating them from flat surfaces without harshness. Avoid using highly saturated colors for anything other than specific interactive elements or brand accents; maintain the subdued neutral palette. Do not introduce strong outlines or heavy box shadows on cards; the design relies on subtle background shifts for hierarchy. Do not deviate from GraphikWeb for UI elements or TiemposHeadlineWeb for main titles; these choices are core to the brand's typographic identity. Refrain from using arbitrary large padding on cards; their structural presence is derived from their content, not artificial spacing. Do not soften edges unnecessarily; the default 3px radius is a deliberate choice for a balanced, contemporary look, with round pill shapes reserved for specific interactive components. Do not use black text on the Midnight Ink background; high-contrast white or light gray text is essential for readability.