Wayfinder

Wayfinder

Preview image. Unlock full-res

Enchanted forest parchment

Industrymedia
Palette
#000000
#1a1a1a
#ffffff
#e3e3e2
#c0bfbe

Wayfinder presents a dark, immersive canvas for interactive storytelling, drawing the user into an experience where content is paramount. Typography is both functional and expressive, set against a backdrop of deep, muted neutrals. Interactions are subtly highlighted through minimal borders and a deliberate avoidance of strong color, making the interface feel integrated with the narrative rather than superimposed upon it. Prioritize Ebon (#000000) for large background areas to maintain the dark, immersive aesthetic. Use Canvas (#ffffff) sparingly for primary headings and highlighted interactive elements to create strong contrast against dark backgrounds. Apply Graphite (#1a1a1a) for all functional text and subtle borders to keep the interface understated. Reinforce interactivity with 1px borders in Graphite (#1a1a1a) for hover or active states on ghost buttons and links. Maintain sharp 0px radius on all interactive elements to preserve visual precision and a lack of overt softness. Allow a generous 40px vertical sectionGap between distinct content areas for clear separation. Employ the Enreal font with its distinct positive letter-spacing for all significant headings to establish brand identity. Avoid introducing saturated colors for UI elements; stick strictly to the achromatic palette. Do not use heavy shadows or gradients; elevation should be primarily achieved through contrast or subtle bordering. Refrain from using rounded corners; all interface elements should maintain a square or rectangular form. Do not vary letterSpacing for Enreal; keep it consistently 0.0420em across all sizes. Do not use any spacing unit smaller than 4px, and minimize its usage to tight element gaps. Avoid filling buttons with solid background colors; interactive elements should appear as ghost buttons or text links. Do not rely on color alone to convey interactive states; always supplement with border changes.

More like this