Tatem

Tatem's design offers a sophisticated and focused dark-mode experience, reminiscent of a command line interface or focused developer tool. Its visual atmosphere is calm, quiet, and highly systematic. The primary visual impression is created by a clean, neutral dark background punctuated by purposeful text and subtle interactive elements. Very sparing use of color, primarily for status or accent in a muted blue, maintains serious functionality while avoiding distraction. The design prioritizes readability and information hierarchy through careful typographic sizing and achromatic value contrasts. Use Inter weight 400 for all text to maintain visual consistency and clarity. Apply Twilight Ink (#000000) for primary page backgrounds, anchoring the dark theme. Use Polar White (#ffffff) for primary headlines and significant UI text against dark backgrounds. Utilize Cerulean Accent (#007eed) exclusively for interactive elements like links and active states to signal interactivity. Maintain a primary border radius of 6px for most interactive elements and a larger 8px for buttons, with 16px for unique hero elements. Employ a base spacing unit of 8px for element gaps and 28px for vertical section separation. Integrate the Sky Gradient (linear-gradient(rgb(90, 118, 148), rgb(171, 183, 181))) for large, atmospheric hero backgrounds. Avoid introducing additional saturated colors beyond the established Cerulean Accent and its subtle variations to maintain the focused atmosphere. Do not use heavy shadows or artificial light sources; rely on value contrast and subtle borders for depth. Do not vary font weights or families; Inter 400 is the only typeface for this system. Avoid busy backgrounds or textures in content areas; stick to solid dark neutrals or the approved gradient. Do not use overly expressive or decorative typography; the system prioritizes functional readability. Steer clear of radii smaller than 6px for interactive components, and avoid overly sharp, unrounded edges where a softer form is intended.