
Preview image. Unlock full-res
Midnight gallery, etched steel.
Koto employs a high-contrast dark mode aesthetic, utilizing a deep charcoal canvas as the primary background. Typography is kept minimal and precise, featuring a distinctive condensed display font for headlines and a more functional sans-serif for body text. Interaction elements are rendered subtly with ghost-like borders, relying on text color and subtle background changes for state indication, rather than heavy fills or shadows. The overall impression is one of stark sophistication and understated control. Use Midnight Charcoal (#060606) for all primary page and section backgrounds. Apply gtKotoheimCondensed (weight 300) with -0.0100em letter-spacing for all headlines and display text larger than 16px. Ensure all primary interactive elements (links, buttons) are rendered in White Canvas (#ffffff) against dark backgrounds. Utilize a 1px solid White Canvas (#ffffff) border for subtle ghost button treatments. Employ the 6px border-radius for all card-like containers and interactive surface elements. Maintain generous padding of 36px for all card panels to ensure content breathability. Use Koto Yellow (#ffe800) exclusively for brand elements or critical accents requiring high visual callout. Avoid using heavy shadows or strong background fills for interactive elements; prefer ghost styles with subtle borders and text color changes. Do not introduce additional background colors outside of the defined neutral palette for surfaces. Refrain from using saturated colors other than Koto Yellow; maintain the achromatic dominance. Do not deviate from the specified letter-spacing for gtKotoheimCondensed; it is a signature characteristic. Avoid using default browser link styles; always override with White Canvas text and ghost interaction patterns. Do not apply rounded corners to buttons or navigation links; they should maintain a 0px border radius for a sharp, precise aesthetic.









