Preview image. Unlock full-res
Calm productivity, like a well-organized office. Light-filled and orderly, with key tools highlighted in a crisp blue.
Resume.io evokes a feeling of quiet competence through its balanced use of a predominantly cool color palette and generous spacing. The interface prioritizes clarity and approachability, using soft blues and grays alongside a confident, sans-serif typography. Interactive elements are clearly distinguished by a vibrant blue, making complex forms feel manageable and guiding users through the resume-building process with a reassuring visual tone. Use Action Blue (#1a91f0) for all primary interactive elements like buttons and active navigation states to guide user flow. Apply a 4px radius consistently to all standard buttons, cards, and input fields for a subtle softness. Maintain a clear visual hierarchy by using Page Graphite (#0f141e) for main headings and Slate Text (#1e2532) for body content. Utilize Whisper White (#f7f9fc) as the default background for content cards and sections to ensure a clean, breathable canvas. Employ the TT Commons typeface for all text elements, leveraging its 400, 500, and 600 weights to delineate content importance. Do not use dark backgrounds for main content areas; reserve them for specific hero sections or full-bleed branding only. Avoid arbitrary border radii; stick to the defined 4px for standard elements, 24px for rounded cards, and 36px for pill buttons. Do not introduce new saturated colors beyond Action Blue (#1a91f0); rely on the existing neutral palette for variety. Do not use letter-spacing on body text; apply it only to larger headings or specific styled elements as defined in typography. Avoid heavy drop shadows or complex gradients; the aesthetic is grounded in simplicity and subtle shifts in background color and outline.
