Preview image. Unlock full-res
Dark-mode website layout with bold typographic hierarchy, bright red maple-leaf logo accent, and white serif text on black background.
Summary
A dark website interface for a documentary film, featuring bold white text and a striking bright red maple-leaf logo that serves as the primary visual accent.
Visual description
Black background fills the viewport. Upper-left shows the site title "Design Canada Film" in white sans-serif and serif type. A bright red (#FC342E) stylized maple-leaf logo sits in the top-right, immediately commanding attention. Left column contains menu links and social icons (Twitter, Facebook, Instagram). Center shows descriptive text in small white serif type about the film. Right column displays the film title, credits, and a "Watch the Trailer" button with an outlined arrow. Bottom-right corner credits the design to "Locomotive." Clean grid structure; minimal use of gray accent color for secondary type. High contrast ensures legibility on black.
Key takeaway
Color accent (red) as the sole visual interest against a dark, text-heavy interface. Asymmetric layout guides the eye from top-left to bottom-right. The maple leaf connects to Canadian cultural identity without requiring additional imagery or decoration.
Reuse notes
Template for documentary, cultural, or media brand websites. The dark mode works well for premium or artistic positioning. The single accent color (red) can be swapped for any high-contrast hue. White serif type for descriptive copy adds editorial sophistication. Works across responsive breakpoints when text hierarchy is maintained.
