
Preview image. Unlock full-res
Architectural blueprint on white marble. Sharp, clean, and formally structured.
Loops presents a precise, document-like interface with stark black typography on crisp white and soft gray backgrounds. A distinctive, serif-led typographic voice for headlines creates an established feel, contrasting with system sans-serifs for body text and interactive elements. Interaction is direct and functional, guided by subtle borders, soft shadows, and a singular, vibrant orange accent for specific highlights and calls to attention, rather than primary actions. The overall impression is one of clarity, focused content, and understated authority. Use Newsreader 600 with tight letter-spacing for all primary headings (display, heading-lg, heading). Employ Greige Canvas (#faf9f7) as the default page background to maintain a light, expansive feel. Accentuate specific terms using Flame Orange (#f97316) for keywords in body text or small decorative icons. Structure interactive elements and content cards with a default border-radius of 8px, defaulting to 12px for elevated cards. Utilize Slate Gray (#1c1917) as the background for primary action buttons to create visual weight and clear calls to action. Apply Soft Shadows (rgba(0, 0, 0, 0.05) 0px 1px 4px 0px, rgba(0, 0, 0, 0.03) 0px 0px 0px 0.5px) sparingly for only truly elevated components like cards or modals. Implement the 12px unit as the primary elementGap for vertical and horizontal spacing between content blocks. Do not use saturated colors other than Flame Orange (#f97316) unless for semantic success/error states. Avoid heavy drop shadows; elevation should be subtle, usually a single soft shadow layer. Do not deviate from the specified serif for headlines; maintain its distinct, opinionated character. Refrain from using complex background gradients; surfaces should remain flat or subtly shaded neutrals. Do not use pure white for large content blocks unless it's a card on a Greige Canvas (#faf9f7) background. Avoid excessive spacing or overly large typography for body text; prioritize compact and dense readability. Do not introduce new typefaces; rely on the established system sans-serifs, Newsreader, and ui-monospace.









