
Preview image. Unlock full-res
Gallery wall of stark contrasts
The Daniel Triendl portfolio uses a stark, high-contrast aesthetic reminiscent of print media, built on a pure white canvas and almost exclusively black typography. Its visual identity is defined by a bold, unadorned structure where content takes precedence, eschewing soft gradients, rounded corners, or shadows for a direct, impactful presentation. Interactivity is subtle, highlighted by thin borders and text color changes rather than expressive fills. The system prioritizes clear communication, leveraging a precise and minimal set of visual rules to showcase vibrant illustration work with understated elegance. Prioritize 'Canvas White' (#ffffff) for all main backgrounds and 'Midnight Black' (#000000) for primary text and interface elements to maintain high contrast. Use 'UniversalSans' weights 400 and 500 for most body copy and labels, and ‘Rza’ font for headings, adhering to the specified type scale: 10px (UniversalSans-500) for captions, 14px (UniversalSans-400) for body, and 24px (Rza) for headings. Apply precise letter-spacing: -0.0100em for 'Times' and 'UniversalSans' and -0.0060em for 'Rza' to maintain distinct typographic rhythm. Implement interactive elements like Ghost Buttons with transparent backgrounds and 'Midnight Black' borders or text for a subtle, print-like interaction. Utilize 'Soft Gray' (#f2f2f2) sparingly for secondary background areas or dividers, creating soft visual separation without introducing strong color. Use geometric shapes for navigation elements (e.g., circular floating action buttons with 48px radius) to introduce subtle design flair. Maintain a compact density with an 'elementGap' of '6px' to keep elements closely related within content blocks. Avoid using shadows or excessive elevation; the design system largely relies on flat surfaces and high color contrast for visual depth, with only 'rgba(0,0,0,0.1) 0px 4px 4px 0px' permissible for specific navigation-related elements. Do not introduce strong accent colors. Color should be reserved for the artwork itself, maintaining achromaticity in the UI. Do not use rounded corners on main content cards; they should maintain a 0px radius for a sharp, gallery-like presentation. Avoid large horizontal or vertical padding on interactive elements like buttons; they generally have minimal to zero explicit padding, relying on their text content for sizing. Do not use gradient fills for UI elements, as the design system is explicitly flat and high-contrast. Do not add superfluous decorative elements; the UI is meant to be a neutral frame for the vibrant illustrations. Avoid heavy borders or solid fills for buttons; most interactive elements are ghost buttons with 'Midnight Black' text against a white background.









